@deksden-com/cpa-kit-react 0.0.0-stage → 0.1.4

package/CHANGELOG.md

@@ -0,0 +1,11 @@
+# @deksden-com/cpa-kit-react
+
+## 0.1.4
+
+### Patch Changes
+
+- ede8760: Include generated package changelogs in npm distributions. Release versions and the exact core peer dependency are maintained together through Changesets.
+- Skip irrelevant archive entries without decompressing them, allow larger uploads, and show clear import progress and limit errors.
+- Updated dependencies [ede8760]
+- Updated dependencies
+  - @deksden-com/cpa-kit@0.1.4

package/NOTICE

@@ -0,0 +1,7 @@
+CPA Kit React
+Copyright 2026 deksden-com. All rights reserved.
+
+Original UI implementation; no third-party UI source is
+vendored. React and React DOM are external peer dependencies under their
+respective MIT license. Their original copyright and license terms remain
+applicable when a host redistributes those dependencies.

package/README.md

@@ -1,3 +1,33 @@
-# Temporary Holding Version
+# CPA Kit React
 
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
+Portable, host-authenticated CPA console. No login page, router, Next.js, Tailwind scanner or toast provider is required.
+
+Available on [npm](https://www.npmjs.com/package/@deksden-com/cpa-kit-react):
+`pnpm add @deksden-com/cpa-kit-react @deksden-com/cpa-kit`. No install token required.
+
+```tsx
+import { useMemo } from 'react';
+import { createCpaAdminClient } from '@deksden-com/cpa-kit/client';
+import { CpaConsole } from '@deksden-com/cpa-kit-react';
+import '@deksden-com/cpa-kit-react/styles.css';
+
+export function Administration({ csrfToken }: { csrfToken: string }) {
+  const client = useMemo(() => createCpaAdminClient({
+    baseUrl: '/api/cpa', instanceId: 'primary',
+    headers: () => ({ 'X-CSRF-Token': csrfToken }),
+  }), [csrfToken]);
+  return <CpaConsole client={client} instanceId="primary" locale="ru" theme="dark" />;
+}
+```
+
+[Documentation index](https://github.com/deksden-com/dd-cpa-kit/blob/main/docs/index.md): installation, host API and safe runtime updates. React and React DOM 19.2.x are required; use the matching core peer version.
+
+Memoize the scoped client for the lifetime of the instance. `initialPanel` provides internal navigation; `panel` + `onNavigate` allows a host router to control navigation. `initialOperationId` resumes a durable job after reload; `onOperationChange` lets the host put its safe operation ID in the URL. The package never stores credentials, files or management/inference keys in browser storage. The host must authenticate and authorize every read/mutation, enforce same-origin/CSRF and execute the accepted operation in a durable worker.
+
+`initialCandidateId` can reopen an owner-authorized import preview, including an alias resolved by the host API. Apply/cancel always use the canonical `candidateId` from the validated preview response, never the URL alias. Capability `modes` and `overwrite` govern the available import controls; absent policy fails closed. PG merge-only pools cannot select full replacement or overwrite existing identities.
+
+Individual `CpaOverviewPanel`, `CpaCredentialsPanel`, `CpaModelsPanel`, `CpaVersionsPanel`, and `CpaOperationsPanel` use the same props; when controlled the host must handle `onNavigate`. `locale` supports Russian and English; `labels` overrides phrasing without a mandatory i18n dependency. `probeProtocols` and `reasoningProfiles` must match host-approved probe policies. A probe always requires explicit confirmation. Missing capabilities show disabled actions with reason codes; management unavailability does not imply inference failure.
+
+Import is one ZIP/JSON control, with an optional native directory picker inside a disclosure. Unsupported directory pickers fall back to ZIP. Preview is explicit, and deletions must be confirmed. Polling is 1 second active/5 seconds hidden, transient backoff capped at 30 seconds, stopped at terminal or recovery state and aborted on unmount. The redacted operation outcome is displayed inline, not only as a transient toast.
+
+All styles are scoped under `.cpa-kit`, with overridable `--cpa-*` CSS custom properties. No fonts or global reset are injected. Light/dark, reduced-motion-compatible static UI, 320px layout and keyboard focus are supported. Keys and upstream error bodies must not be passed as props.

package/dist/index.d.ts

@@ -0,0 +1,27 @@
+import type { CpaAdminClient } from "@deksden-com/cpa-kit/client";
+import { type CpaLabels, type CpaLocale } from "./labels.js";
+export type { CpaLocale, CpaLabels } from "./labels.js";
+export type CpaPanel = "overview" | "credentials" | "models" | "versions" | "operations";
+export interface CpaConsoleProps {
+    client: CpaAdminClient;
+    instanceId: string;
+    locale?: CpaLocale;
+    labels?: Partial<CpaLabels>;
+    initialPanel?: CpaPanel;
+    panel?: CpaPanel;
+    initialOperationId?: string;
+    initialCandidateId?: string;
+    onOperationChange?: (id: string) => void;
+    onNavigate?: (panel: CpaPanel) => void;
+    onBack?: () => void;
+    className?: string;
+    theme?: "light" | "dark";
+    probeProtocols?: string[];
+    reasoningProfiles?: (string | null)[];
+}
+export declare function CpaConsole(props: CpaConsoleProps): import("react").JSX.Element;
+export declare const CpaOverviewPanel: (props: CpaConsoleProps) => import("react").JSX.Element;
+export declare const CpaCredentialsPanel: (props: CpaConsoleProps) => import("react").JSX.Element;
+export declare const CpaModelsPanel: (props: CpaConsoleProps) => import("react").JSX.Element;
+export declare const CpaVersionsPanel: (props: CpaConsoleProps) => import("react").JSX.Element;
+export declare const CpaOperationsPanel: (props: CpaConsoleProps) => import("react").JSX.Element;

package/dist/index.js

@@ -0,0 +1,402 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useCallback, useEffect, useId, useRef, useState, } from "react";
+import { labels } from "./labels.js";
+const panels = [
+    "overview",
+    "credentials",
+    "models",
+    "versions",
+    "operations",
+];
+const active = (o) => o.state === "queued" || o.state === "running";
+const key = () => `ui-${globalThis.crypto.randomUUID()}`;
+const errorCode = (error) => typeof error === "object" && error !== null && "detail" in error
+    ? String(error.detail.code ?? "INTERNAL")
+    : "INTERNAL";
+function Button({ children, onClick, disabled = false, reason, className = "", type = "button", }) {
+    return (_jsxs("span", { children: [_jsx("button", { type: type, className: `cpa-button ${className}`, disabled: disabled, onClick: onClick, title: reason, children: children }), disabled && reason ? (_jsxs("span", { className: "cpa-disabled", children: [" \u00B7 ", reason] })) : null] }));
+}
+export function CpaConsole(props) {
+    const { client, instanceId } = props;
+    const l = { ...labels[props.locale ?? "ru"], ...props.labels };
+    const readable = (value) => {
+        const label = value === "running"
+            ? "stateRunning"
+            : value === "usable"
+                ? "usableState"
+                : value === "preview"
+                    ? "previewPhase"
+                    : value;
+        return l[label] ?? value;
+    };
+    const [localPanel, setPanel] = useState(props.initialPanel ?? "overview");
+    const panel = props.panel ?? localPanel;
+    const [status, setStatus] = useState(null), [credentials, setCredentials] = useState([]), [models, setModels] = useState(null), [releases, setReleases] = useState([]), [operations, setOperations] = useState([]);
+    const [nextCursor, setNextCursor] = useState(null), [operationId, setOperationId] = useState(props.initialOperationId ?? ""), [operation, setOperation] = useState(null), [error, setError] = useState(null), [loading, setLoading] = useState(false), [pending, setPending] = useState(false);
+    const [draftOperationId, setDraftOperationId] = useState(props.initialOperationId ?? "");
+    const [files, setFiles] = useState([]), [candidate, setCandidate] = useState(props.initialCandidateId ?? null), [preview, setPreview] = useState(null), [mode, setMode] = useState("merge"), [overwrite, setOverwrite] = useState([]), [confirmedRemovals, setConfirmedRemovals] = useState(false);
+    const [confirmation, setConfirmation] = useState(null);
+    const [protocol, setProtocol] = useState(props.probeProtocols?.[0] ?? "chat-completions"), [reasoning, setReasoning] = useState(props.reasoningProfiles?.[0] ?? "");
+    const mounted = useRef(true), mutation = useRef(null), loadController = useRef(null), inflight = useRef(false), dialog = useRef(null), retryCommand = useRef(null);
+    const fieldId = useId();
+    useEffect(() => {
+        mounted.current = true;
+        return () => {
+            mounted.current = false;
+            mutation.current?.abort();
+            loadController.current?.abort();
+        };
+    }, [client]);
+    const fail = useCallback((e) => {
+        if (mounted.current && !(e?.name === "AbortError"))
+            setError(errorCode(e));
+    }, []);
+    const navigate = (p) => {
+        setPanel(p);
+        props.onNavigate?.(p);
+        setConfirmation(null);
+        setError(null);
+    };
+    const capability = (kind) => status?.capabilities[kind];
+    const reason = (kind) => capability(kind)?.reasonCode ?? l.unsupported;
+    const can = (kind) => capability(kind)?.enabled === true &&
+        !pending &&
+        (!(operation && active(operation)) || kind === "operation.cancel");
+    const importCapability = capability("import.apply");
+    const allowedModes = importCapability?.modes ?? [];
+    const overwriteAllowed = importCapability?.overwrite === true;
+    const importModeAllowed = allowedModes.includes(mode);
+    useEffect(() => {
+        if (allowedModes.length && !allowedModes.includes(mode))
+            setMode(allowedModes[0]);
+        if (!overwriteAllowed && overwrite.length)
+            setOverwrite([]);
+    }, [allowedModes, mode, overwriteAllowed, overwrite]);
+    useEffect(() => {
+        if (confirmation) {
+            const previous = document.activeElement instanceof HTMLElement
+                ? document.activeElement
+                : null;
+            dialog.current?.focus();
+            return () => previous?.focus();
+        }
+    }, [confirmation]);
+    const load = useCallback(async () => {
+        loadController.current?.abort();
+        const controller = new AbortController();
+        loadController.current = controller;
+        setLoading(true);
+        try {
+            const next = await client.status(controller.signal);
+            if (controller.signal.aborted)
+                return;
+            setStatus(next);
+            if (panel === "credentials" &&
+                next.capabilities["credentials.list"]?.enabled) {
+                const list = await client.credentials(controller.signal);
+                if (!controller.signal.aborted)
+                    setCredentials(list.items);
+            }
+            if (panel === "models" && next.capabilities["models.get"]?.enabled) {
+                const data = await client.models(controller.signal);
+                if (!controller.signal.aborted)
+                    setModels(data);
+            }
+            if (panel === "versions" && next.capabilities["releases.list"]?.enabled) {
+                const data = await client.releases(controller.signal);
+                if (!controller.signal.aborted)
+                    setReleases(data.items);
+            }
+            if (panel === "operations") {
+                const data = await client.operations({ signal: controller.signal });
+                if (!controller.signal.aborted) {
+                    setOperations(data.items);
+                    setNextCursor(data.nextCursor);
+                }
+            }
+        }
+        catch (e) {
+            fail(e);
+        }
+        finally {
+            if (!controller.signal.aborted && mounted.current)
+                setLoading(false);
+        }
+    }, [client, panel, fail]);
+    useEffect(() => {
+        setError(null);
+        void load();
+        return () => loadController.current?.abort();
+    }, [load]);
+    const track = (id) => {
+        setOperationId(id);
+        setDraftOperationId(id);
+        setOperation(null);
+        props.onOperationChange?.(id);
+    };
+    const command = async (kind, payload, revision) => {
+        if (inflight.current)
+            return;
+        inflight.current = true;
+        setPending(true);
+        setError(null);
+        const controller = new AbortController();
+        mutation.current = controller;
+        try {
+            const signature = JSON.stringify({ instanceId, kind, payload });
+            if (retryCommand.current?.signature !== signature)
+                retryCommand.current = {
+                    signature,
+                    key: key(),
+                    revision: revision === undefined ? (status?.revision ?? null) : revision,
+                };
+            const envelope = {
+                apiVersion: 1,
+                instanceId,
+                kind,
+                payload,
+                idempotencyKey: retryCommand.current.key,
+                expectedRevision: retryCommand.current.revision,
+            };
+            const result = await client.command(envelope, controller.signal);
+            retryCommand.current = null;
+            if (mounted.current)
+                track(result.operationId);
+        }
+        catch (e) {
+            if (errorCode(e) !== "INTERNAL")
+                retryCommand.current = null;
+            fail(e);
+        }
+        finally {
+            inflight.current = false;
+            if (mounted.current)
+                setPending(false);
+        }
+    };
+    useEffect(() => {
+        if (!operationId)
+            return;
+        const controller = new AbortController();
+        let timer;
+        let failures = 0;
+        const poll = async () => {
+            try {
+                const data = await client.operation(operationId, controller.signal);
+                if (controller.signal.aborted)
+                    return;
+                setOperation(data);
+                failures = 0;
+                if (active(data)) {
+                    timer = setTimeout(poll, document.visibilityState === "hidden" ? 5000 : 1000);
+                }
+                else {
+                    if (data.kind === "import.stage" &&
+                        data.state === "succeeded" &&
+                        typeof data.result?.candidateId === "string")
+                        setCandidate(data.result.candidateId);
+                    if (data.kind === "import.apply" && data.state === "succeeded") {
+                        setCandidate(null);
+                        setPreview(null);
+                        setOverwrite([]);
+                    }
+                    void load();
+                }
+            }
+            catch (e) {
+                if (controller.signal.aborted)
+                    return;
+                fail(e);
+                if (errorCode(e) === "NOT_AUTHORIZED")
+                    return;
+                timer = setTimeout(poll, Math.min(30000, 1000 * 2 ** ++failures));
+            }
+        };
+        void poll();
+        return () => {
+            controller.abort();
+            if (timer)
+                clearTimeout(timer);
+        };
+    }, [client, operationId, fail, load]);
+    useEffect(() => {
+        if (!candidate)
+            return;
+        const controller = new AbortController();
+        setPreview(null);
+        setConfirmedRemovals(false);
+        void client
+            .preview(candidate, {
+            mode,
+            overwriteIds: overwrite,
+            signal: controller.signal,
+        })
+            .then((data) => {
+            if (!controller.signal.aborted)
+                setPreview(data);
+        })
+            .catch((e) => {
+            if (!controller.signal.aborted)
+                fail(e);
+        });
+        return () => controller.abort();
+    }, [client, candidate, mode, overwrite, fail]);
+    const upload = async () => {
+        if (!files.length) {
+            setError("INVALID_INPUT");
+            return;
+        }
+        if (inflight.current)
+            return;
+        inflight.current = true;
+        setPending(true);
+        setError(null);
+        const controller = new AbortController();
+        mutation.current = controller;
+        try {
+            const data = await client.upload(files, controller.signal);
+            setFiles([]);
+            const result = await client.command({
+                apiVersion: 1,
+                instanceId,
+                kind: "import.stage",
+                payload: { uploadId: data.uploadId, format: "auto" },
+                idempotencyKey: key(),
+                expectedRevision: null,
+            }, controller.signal);
+            if (mounted.current)
+                track(result.operationId);
+        }
+        catch (e) {
+            fail(e);
+        }
+        finally {
+            inflight.current = false;
+            if (mounted.current)
+                setPending(false);
+        }
+    };
+    const request = (kind, payload, text) => setConfirmation({
+        kind,
+        payload,
+        text,
+        revision: status?.revision ?? null,
+    });
+    const renderOperation = () => operation ? (_jsxs("section", { className: "cpa-card cpa-operation", "aria-label": l.progress, "aria-live": "polite", children: [_jsxs("div", { className: "cpa-row", children: [_jsx("h3", { children: l[operation.state] }), _jsx("span", { className: "cpa-badge", children: operation.kind })] }), _jsxs("p", { className: "cpa-muted", children: [l.phase, ": ", readable(operation.phase), " \u00B7", " ", _jsx("span", { className: "cpa-mono", children: operation.id })] }), operation.progress.total !== null ? (_jsxs(_Fragment, { children: [_jsx("progress", { value: operation.progress.completed, max: operation.progress.total || 1 }), _jsxs("span", { children: [operation.progress.completed, " / ", operation.progress.total] })] })) : null, operation.error ? (_jsxs("p", { role: "alert", children: [operation.error.code === "UPLOAD_LIMIT" && operation.kind === "import.stage"
+                        ? (props.locale === "en" ? "The archive exceeded a safety limit. Remove logs, databases and temporary files, then retry." : "Архив превысил ограничение безопасности. Удалите журналы, базы и временные файлы, затем повторите загрузку.")
+                        : `${operation.error.code}: ${operation.error.message}`, operation.error.retryAt ? ` · ${operation.error.retryAt}` : ""] })) : null, operation.state === "partially_applied" ? _jsx("p", { children: l.partial }) : null, operation.state === "recovery_required" ? (_jsxs("p", { children: [l.recovery, " \u00B7 ", operation.recoveryDisposition] })) : null, active(operation) && !operation.cancelRequested ? (_jsx(Button, { disabled: !can("operation.cancel"), reason: !can("operation.cancel") ? reason("operation.cancel") : undefined, onClick: () => void command("operation.cancel", { operationId: operation.id }), children: l.cancel })) : null, operation.cancelRequested && active(operation) ? (_jsxs("p", { children: [l.cancel, "\u2026"] })) : null] })) : operationId ? (_jsxs("p", { role: "status", children: [l.loading, " \u00B7 ", _jsx("span", { className: "cpa-mono", children: operationId })] })) : null;
+    return (_jsxs("div", { className: `cpa-kit ${props.className ?? ""}`, "data-theme": props.theme, children: [_jsxs("nav", { className: "cpa-crumbs", "aria-label": props.locale === "en" ? "Breadcrumb" : "Хлебные крошки", children: [props.onBack ? (_jsxs(Button, { onClick: props.onBack, children: ["\u2190 ", l.back] })) : null, _jsx(Button, { onClick: () => navigate("overview"), children: "CPA" }), panel !== "overview" ? (_jsxs(_Fragment, { children: [_jsx("span", { "aria-hidden": "true", children: "\u203A" }), _jsx("span", { "aria-current": "page", children: l[panel] })] })) : null] }), _jsxs("header", { className: "cpa-head", children: [_jsx("h2", { children: l[panel] }), _jsx(Button, { disabled: loading || pending, onClick: () => void load(), children: loading ? l.loading : l.refresh })] }), _jsx("nav", { className: "cpa-nav", "aria-label": props.locale === "en" ? "CPA sections" : "Разделы CPA", children: panels.map((p) => (_jsx("button", { className: "cpa-button", "aria-current": panel === p ? "page" : undefined, onClick: () => navigate(p), children: l[p] }, p))) }), error ? (_jsxs("div", { role: "alert", className: "cpa-notice", children: [error === "NOT_AUTHORIZED" ? l.unauthorized : l.inputError, " ", _jsx("span", { className: "cpa-mono", children: error }), _jsx(Button, { onClick: () => {
+                            setError(null);
+                            void load();
+                        }, children: l.retry })] })) : null, confirmation ? (_jsx("div", { className: "cpa-modal", children: _jsxs("div", { ref: dialog, tabIndex: -1, className: "cpa-dialog", role: "alertdialog", "aria-modal": "true", "aria-label": l.confirm, "aria-describedby": `${fieldId}-confirm`, onKeyDown: (e) => {
+                        if (e.key === "Escape") {
+                            setConfirmation(null);
+                            return;
+                        }
+                        if (e.key === "Tab") {
+                            const nodes = dialog.current?.querySelectorAll("button:not(:disabled)");
+                            if (!nodes?.length)
+                                return;
+                            const first = nodes[0], last = nodes[nodes.length - 1];
+                            if (e.shiftKey &&
+                                (document.activeElement === first ||
+                                    document.activeElement === dialog.current)) {
+                                e.preventDefault();
+                                last.focus();
+                            }
+                            else if (!e.shiftKey &&
+                                (document.activeElement === last ||
+                                    document.activeElement === dialog.current)) {
+                                e.preventDefault();
+                                first.focus();
+                            }
+                        }
+                    }, children: [_jsx("p", { id: `${fieldId}-confirm`, children: confirmation.text }), _jsxs("div", { className: "cpa-actions", children: [_jsx(Button, { className: "cpa-danger", disabled: pending, onClick: () => {
+                                        const value = confirmation;
+                                        setConfirmation(null);
+                                        void command(value.kind, value.payload, value.revision);
+                                    }, children: l.confirm }), _jsx(Button, { onClick: () => setConfirmation(null), children: l.cancel })] })] }) })) : null, _jsxs("div", { className: "cpa-panel", "aria-busy": loading || pending, children: [panel === "overview" ? (_jsxs(_Fragment, { children: [_jsx("p", { className: "cpa-muted", children: l.safe }), _jsx("div", { className: "cpa-grid", children: [
+                                    [l.service, status?.runtime.state ?? "unknown"],
+                                    [l.management, status?.management.availability ?? "unknown"],
+                                    [
+                                        l.inference,
+                                        status?.inference.reachable === true
+                                            ? "reachable"
+                                            : status?.inference.reachable === false
+                                                ? "offline"
+                                                : "unknown",
+                                    ],
+                                ].map(([title, value]) => (_jsxs("section", { className: "cpa-card", children: [_jsx("h3", { children: title }), _jsx("p", { children: readable(value) })] }, title))) }), _jsxs("section", { className: "cpa-card", children: [_jsx("h3", { children: l.version }), _jsx("p", { className: "cpa-mono", children: status?.runtime.version ?? "—" }), _jsxs("p", { className: "cpa-muted", children: [readable(status?.runtime.mode ?? "—"), " \u00B7", " ", status?.management.protocol ?? "—"] }), _jsxs(Button, { onClick: () => navigate("versions"), children: [l.versions, " \u2192"] })] }), status?.busyOperationId ? (_jsxs(Button, { onClick: () => track(status.busyOperationId), children: [l.progress, " \u2192"] })) : null] })) : null, panel === "credentials" ? (_jsxs(_Fragment, { children: [_jsxs("section", { className: "cpa-card", children: [_jsx("h3", { children: l.import }), _jsx("p", { className: "cpa-muted", children: l.uploadHint }), _jsxs("div", { className: "cpa-form", children: [_jsxs("label", { className: "cpa-field", children: [l.choose, _jsx("input", { "aria-label": l.choose, type: "file", multiple: true, accept: ".zip,.json,application/zip,application/json", disabled: !can("import.stage"), onChange: (e) => setFiles(Array.from(e.currentTarget.files ?? [])) })] }), _jsxs("details", { children: [_jsx("summary", { children: l.directory }), _jsx("input", { "aria-label": l.directory, type: "file", multiple: true, webkitdirectory: "", disabled: !can("import.stage"), onChange: (e) => setFiles(Array.from(e.currentTarget.files ?? [])) })] }), pending ? _jsx("p", { role: "status", "aria-live": "polite", children: props.locale === "en" ? "Uploading files and preparing verification…" : "Загружаем файлы и подготавливаем проверку…" }) : null, _jsx(Button, { disabled: !can("import.stage") || !files.length, reason: !can("import.stage") ? reason("import.stage") : undefined, onClick: () => void upload(), children: pending ? l.loading : l.preview })] })] }), candidate ? (_jsxs("section", { className: "cpa-card", children: [_jsx("h3", { children: l.preview }), _jsxs("label", { className: "cpa-field", children: [l.import, _jsxs("select", { value: mode, disabled: !can("import.apply"), "aria-describedby": allowedModes.includes("replace")
+                                                    ? undefined
+                                                    : `${fieldId}-mode-policy`, onChange: (e) => {
+                                                    const next = e.target.value;
+                                                    if (allowedModes.includes(next))
+                                                        setMode(next);
+                                                }, children: [_jsx("option", { value: "merge", disabled: !allowedModes.includes("merge"), children: l.merge }), _jsx("option", { value: "replace", disabled: !allowedModes.includes("replace"), children: l.replace })] })] }), !allowedModes.includes("replace") ? (_jsx("p", { id: `${fieldId}-mode-policy`, className: "cpa-disabled", children: l.modeUnavailable })) : null, preview ? (_jsxs(_Fragment, { children: [_jsxs("div", { className: "cpa-stats", children: [[
+                                                        "additions",
+                                                        "preserved",
+                                                        "replacements",
+                                                        "removals",
+                                                    ].map((k) => (_jsxs("div", { className: "cpa-stat", children: [_jsx("strong", { children: preview[k].length }), l[k]] }, k))), _jsxs("div", { className: "cpa-stat", children: [_jsx("strong", { children: preview.skipped }), l.skipped] })] }), Object.entries(preview.reasons).map(([r, n]) => (_jsxs("p", { className: "cpa-muted", children: [r, ": ", n] }, r))), preview.preserved.length ? (_jsxs("fieldset", { children: [_jsx("legend", { children: l.overwrite }), !overwriteAllowed ? (_jsx("p", { className: "cpa-disabled", children: l.overwriteUnavailable })) : null, preview.preserved.map((id) => (_jsxs("label", { className: "cpa-check", children: [_jsx("input", { type: "checkbox", checked: overwrite.includes(id), disabled: !overwriteAllowed || !can("import.apply"), onChange: (e) => overwriteAllowed &&
+                                                                    setOverwrite((old) => e.target.checked
+                                                                        ? [...old, id]
+                                                                        : old.filter((x) => x !== id)) }), _jsx("span", { className: "cpa-mono", children: id })] }, id)))] })) : null, preview.removals.length ? (_jsxs(_Fragment, { children: [_jsx("ul", { children: preview.removals.map((id) => (_jsx("li", { className: "cpa-mono", children: id }, id))) }), _jsxs("label", { className: "cpa-check", children: [_jsx("input", { type: "checkbox", checked: confirmedRemovals, onChange: (e) => setConfirmedRemovals(e.target.checked) }), l.checkRemovals] })] })) : null, _jsxs("div", { className: "cpa-actions", children: [_jsx(Button, { className: "cpa-primary", disabled: !can("import.apply") ||
+                                                            !importModeAllowed ||
+                                                            (!overwriteAllowed && overwrite.length > 0) ||
+                                                            (preview.removals.length > 0 && !confirmedRemovals), reason: !importModeAllowed
+                                                            ? l.modeUnavailable
+                                                            : !can("import.apply")
+                                                                ? reason("import.apply")
+                                                                : undefined, onClick: () => void command("import.apply", {
+                                                            candidateId: preview.candidateId,
+                                                            previewRevision: preview.revision,
+                                                            mode,
+                                                            overwriteIds: overwrite,
+                                                            confirmedRemovals: preview.removals,
+                                                        }, preview.revision), children: l.apply }), _jsx(Button, { disabled: !can("import.cancel"), onClick: () => {
+                                                            void command("import.cancel", {
+                                                                candidateId: preview.candidateId,
+                                                            });
+                                                            setCandidate(null);
+                                                            setPreview(null);
+                                                        }, children: l.cancel })] })] })) : (_jsx("p", { children: l.loading }))] })) : null, _jsxs("section", { className: "cpa-card", children: [_jsx("h3", { children: l.credentials }), !capability("credentials.list")?.enabled ? (_jsx("p", { children: reason("credentials.list") })) : credentials.length ? (credentials.map((c) => (_jsxs("div", { className: "cpa-row", children: [_jsxs("div", { children: [_jsx("strong", { children: c.provider }), _jsx("p", { className: "cpa-mono", children: c.fingerprint }), _jsx("span", { className: "cpa-badge", children: readable(c.usability) })] }), _jsx(Button, { className: "cpa-danger", disabled: !can("credential.delete") || credentials.length <= 1, reason: credentials.length <= 1
+                                                    ? l.last
+                                                    : !can("credential.delete")
+                                                        ? reason("credential.delete")
+                                                        : undefined, onClick: () => request("credential.delete", { credentialId: c.id, confirmed: true }, l.confirmHint), children: l.remove })] }, c.id)))) : (_jsx("p", { className: "cpa-muted", children: l.empty }))] })] })) : null, panel === "models" ? (_jsxs("section", { className: "cpa-card", children: [_jsxs("div", { className: "cpa-row", children: [_jsx("h3", { children: l.models }), _jsx(Button, { disabled: !can("catalog.refresh"), reason: !can("catalog.refresh")
+                                            ? reason("catalog.refresh")
+                                            : undefined, onClick: () => void command("catalog.refresh", {}), children: l.refresh })] }), models?.stale ? _jsx("p", { className: "cpa-notice", children: l.stale }) : null, _jsx("p", { className: "cpa-muted", children: l.probeHint }), _jsxs("div", { className: "cpa-actions", children: [_jsxs("label", { className: "cpa-field", children: [l.protocol, _jsx("select", { value: protocol, onChange: (e) => setProtocol(e.target.value), children: (props.probeProtocols ?? ["chat-completions"]).map((p) => (_jsx("option", { children: p }, p))) })] }), _jsxs("label", { className: "cpa-field", children: [l.reasoning, _jsx("select", { value: reasoning, onChange: (e) => setReasoning(e.target.value), children: (props.reasoningProfiles ?? [null]).map((r) => (_jsx("option", { value: r ?? "", children: r ?? "—" }, r ?? ""))) })] })] }), !capability("models.get")?.enabled ? (_jsx("p", { children: reason("models.get") })) : models?.models.length ? (models.models.map((m) => (_jsxs("div", { className: "cpa-row", children: [_jsxs("div", { children: [_jsx("strong", { className: "cpa-mono", children: m.id }), _jsx("p", { className: "cpa-muted", children: m.capabilities.join(" · ") })] }), _jsx(Button, { disabled: !can("model.probe"), reason: !can("model.probe") ? reason("model.probe") : undefined, onClick: () => request("model.probe", {
+                                            modelId: m.id,
+                                            protocol,
+                                            reasoningProfile: reasoning || null,
+                                        }, l.probeHint), children: l.probe })] }, m.id)))) : (_jsx("p", { children: l.empty }))] })) : null, panel === "versions" ? (_jsxs("section", { className: "cpa-card", children: [_jsxs("div", { className: "cpa-row", children: [_jsx("h3", { children: l.versions }), _jsx(Button, { disabled: !can("release.discover"), reason: !can("release.discover")
+                                            ? reason("release.discover")
+                                            : undefined, onClick: () => void command("release.discover", {}), children: l.discover })] }), !capability("releases.list")?.enabled ? (_jsx("p", { children: reason("releases.list") })) : releases.length ? (releases.map((r) => (_jsxs("div", { className: "cpa-row", children: [_jsxs("div", { children: [_jsxs("strong", { className: "cpa-mono", children: ["v", r.version] }), " ", r.active ? (_jsx("span", { className: "cpa-badge", children: l.active })) : r.installed ? (_jsx("span", { className: "cpa-badge", children: l.installed })) : null] }), _jsx("div", { className: "cpa-actions", children: !r.installed ? (_jsx(Button, { disabled: !can("release.install"), reason: !can("release.install")
+                                                ? reason("release.install")
+                                                : undefined, onClick: () => void command("release.install", { releaseId: r.id }), children: l.install })) : !r.active ? (_jsxs(_Fragment, { children: [_jsx(Button, { disabled: !can("release.activate"), reason: !can("release.activate")
+                                                        ? reason("release.activate")
+                                                        : undefined, onClick: () => request("release.activate", { installedReleaseId: r.id, confirmed: true }, l.confirmHint), children: l.activate }), _jsx(Button, { className: "cpa-danger", disabled: !can("release.delete") || r.lastKnownGood, reason: r.lastKnownGood
+                                                        ? l.recovery
+                                                        : !can("release.delete")
+                                                            ? reason("release.delete")
+                                                            : undefined, onClick: () => request("release.delete", { installedReleaseId: r.id, confirmed: true }, l.confirmHint), children: l.remove }), r.lastKnownGood ? (_jsx(Button, { disabled: !can("release.rollback"), onClick: () => request("release.rollback", {
+                                                        lastKnownGoodReleaseId: r.id,
+                                                        confirmed: true,
+                                                    }, l.confirmHint), children: l.rollback })) : null] })) : null })] }, r.id)))) : (_jsx("p", { children: l.empty }))] })) : null, panel === "operations" ? (_jsxs("section", { className: "cpa-card", children: [_jsx("h3", { children: l.operations }), _jsxs("label", { className: "cpa-field", children: [l.operationId, _jsx("input", { value: draftOperationId, onChange: (e) => setDraftOperationId(e.target.value), maxLength: 128, pattern: "[A-Za-z0-9_.:-]+" })] }), _jsx(Button, { disabled: !/^[A-Za-z0-9_.:-]{1,128}$/.test(draftOperationId), onClick: () => track(draftOperationId), children: l.resume }), operations.length ? (operations.map((o) => (_jsxs("div", { className: "cpa-row", children: [_jsxs("div", { children: [_jsx("strong", { children: o.kind }), _jsxs("p", { className: "cpa-muted", children: [l[o.state], " \u00B7 ", o.createdAt] })] }), _jsx(Button, { onClick: () => track(o.id), children: l.resume })] }, o.id)))) : (_jsx("p", { children: l.empty })), nextCursor ? (_jsxs(Button, { disabled: pending, onClick: () => {
+                                    setPending(true);
+                                    void client
+                                        .operations({ cursor: nextCursor })
+                                        .then((data) => {
+                                        setOperations((old) => [...old, ...data.items]);
+                                        setNextCursor(data.nextCursor);
+                                    })
+                                        .catch(fail)
+                                        .finally(() => setPending(false));
+                                }, children: [l.operations, " \u2192"] })) : null] })) : null, renderOperation()] })] }));
+}
+export const CpaOverviewPanel = (props) => (_jsx(CpaConsole, { ...props, panel: "overview" }));
+export const CpaCredentialsPanel = (props) => (_jsx(CpaConsole, { ...props, panel: "credentials" }));
+export const CpaModelsPanel = (props) => (_jsx(CpaConsole, { ...props, panel: "models" }));
+export const CpaVersionsPanel = (props) => (_jsx(CpaConsole, { ...props, panel: "versions" }));
+export const CpaOperationsPanel = (props) => (_jsx(CpaConsole, { ...props, panel: "operations" }));

package/dist/labels.d.ts

@@ -0,0 +1,188 @@
+export declare const labels: {
+    readonly ru: {
+        readonly overview: "Обзор";
+        readonly credentials: "Авторизации";
+        readonly models: "Модели";
+        readonly versions: "Версии ядра";
+        readonly operations: "Операции";
+        readonly back: "Назад";
+        readonly refresh: "Обновить";
+        readonly loading: "Загрузка…";
+        readonly retry: "Повторить";
+        readonly empty: "Пока нет данных.";
+        readonly offline: "Недоступно";
+        readonly service: "Сервис";
+        readonly management: "Управление";
+        readonly inference: "Генерация";
+        readonly version: "Версия";
+        readonly status: "Состояние";
+        readonly import: "Импорт авторизаций";
+        readonly choose: "Выбрать ZIP или JSON";
+        readonly directory: "Выбрать папку";
+        readonly uploadHint: "Формат определим по содержимому. Служебные файлы пропустим; временную загрузку удалим после разбора.";
+        readonly preview: "Проверить загрузку";
+        readonly merge: "Дополнить пул";
+        readonly replace: "Заменить весь пул";
+        readonly additions: "Добавить";
+        readonly preserved: "Сохранить";
+        readonly replacements: "Заменить";
+        readonly removals: "Удалить";
+        readonly skipped: "Пропустить";
+        readonly apply: "Подтвердить и применить";
+        readonly cancel: "Отменить";
+        readonly remove: "Удалить";
+        readonly confirm: "Подтвердить";
+        readonly confirmHint: "Действие изменит активную конфигурацию. Продолжить?";
+        readonly active: "Активна";
+        readonly installed: "Установлена";
+        readonly install: "Установить";
+        readonly activate: "Активировать";
+        readonly rollback: "Вернуть предыдущую";
+        readonly discover: "Проверить обновления";
+        readonly probe: "Проверить модель";
+        readonly probeHint: "Проверка делает короткий запрос и может расходовать квоту.";
+        readonly protocol: "Протокол";
+        readonly reasoning: "Рассуждение";
+        readonly stale: "Устаревший каталог — показаны последние успешные данные.";
+        readonly fingerprint: "Отпечаток";
+        readonly provider: "Провайдер";
+        readonly usable: "Доступность";
+        readonly last: "Последнюю рабочую авторизацию удалить нельзя.";
+        readonly safe: "Здесь только безопасные статусы и отпечатки. Ключи и токены не отображаются.";
+        readonly progress: "Ход операции";
+        readonly resume: "Открыть операцию";
+        readonly terminal: "Операция завершена";
+        readonly phase: "Этап";
+        readonly recovery: "Требуется восстановление";
+        readonly partial: "Часть изменений применена. Проверьте фактическое состояние перед новой попыткой.";
+        readonly overwrite: "Заменить совпадающие авторизации";
+        readonly modeUnavailable: "Замена всего пула недоступна для текущего хранилища.";
+        readonly overwriteUnavailable: "Совпадающие серверные авторизации сохраняются: перезапись недоступна для текущего хранилища.";
+        readonly checkRemovals: "Я подтверждаю удаление перечисленных авторизаций";
+        readonly noFiles: "Выберите файлы.";
+        readonly unauthorized: "Нет доступа или сеанс завершён. Войдите в приложение повторно.";
+        readonly unsupported: "Действие недоступно";
+        readonly operationId: "ID операции";
+        readonly inputError: "Не удалось выполнить действие. Повторите загрузку состояния.";
+        readonly succeeded: "Завершено";
+        readonly queued: "В очереди";
+        readonly running: "Выполняется";
+        readonly failed: "Ошибка";
+        readonly cancelled: "Отменено";
+        readonly partially_applied: "Частично применено";
+        readonly recovery_required: "Требуется восстановление";
+        readonly stateRunning: "Запущен";
+        readonly stopped: "Остановлен";
+        readonly unknown: "Не проверено";
+        readonly available: "Доступно";
+        readonly unavailable: "Недоступно";
+        readonly reachable: "Доступна";
+        readonly managed: "Управляемый сервис";
+        readonly remote: "Внешний сервис";
+        readonly usableState: "Рабочая";
+        readonly disabled: "Отключена";
+        readonly validate: "Проверка данных";
+        readonly previewPhase: "Предварительный просмотр";
+        readonly drain: "Ожидание текущих запросов";
+        readonly prepare: "Подготовка";
+        readonly switch: "Переключение";
+        readonly verify: "Проверка результата";
+        readonly commit: "Сохранение результата";
+        readonly cleanup: "Очистка";
+    };
+    readonly en: {
+        readonly overview: "Overview";
+        readonly credentials: "Authorizations";
+        readonly models: "Models";
+        readonly versions: "Core versions";
+        readonly operations: "Operations";
+        readonly back: "Back";
+        readonly refresh: "Refresh";
+        readonly loading: "Loading…";
+        readonly retry: "Retry";
+        readonly empty: "No data yet.";
+        readonly offline: "Unavailable";
+        readonly service: "Service";
+        readonly management: "Management";
+        readonly inference: "Generation";
+        readonly version: "Version";
+        readonly status: "State";
+        readonly import: "Import authorizations";
+        readonly choose: "Choose ZIP or JSON";
+        readonly directory: "Choose folder";
+        readonly uploadHint: "The content determines the format. Unrelated files are skipped; temporary uploads are removed after parsing.";
+        readonly preview: "Validate upload";
+        readonly merge: "Merge pool";
+        readonly replace: "Replace entire pool";
+        readonly additions: "Add";
+        readonly preserved: "Preserve";
+        readonly replacements: "Replace";
+        readonly removals: "Remove";
+        readonly skipped: "Skip";
+        readonly apply: "Confirm and apply";
+        readonly cancel: "Cancel";
+        readonly remove: "Delete";
+        readonly confirm: "Confirm";
+        readonly confirmHint: "This action changes the active configuration. Continue?";
+        readonly active: "Active";
+        readonly installed: "Installed";
+        readonly install: "Install";
+        readonly activate: "Activate";
+        readonly rollback: "Restore previous";
+        readonly discover: "Check for updates";
+        readonly probe: "Probe model";
+        readonly probeHint: "A probe makes a short request and may consume quota.";
+        readonly protocol: "Protocol";
+        readonly reasoning: "Reasoning";
+        readonly stale: "Stale catalog — showing the last successful data.";
+        readonly fingerprint: "Fingerprint";
+        readonly provider: "Provider";
+        readonly usable: "Usability";
+        readonly last: "The last usable authorization cannot be deleted.";
+        readonly safe: "Only safe statuses and fingerprints are shown. Keys and tokens are never displayed.";
+        readonly progress: "Operation progress";
+        readonly resume: "Open operation";
+        readonly terminal: "Operation finished";
+        readonly phase: "Phase";
+        readonly recovery: "Recovery required";
+        readonly partial: "Some changes were applied. Check the actual state before retrying.";
+        readonly overwrite: "Replace matching authorizations";
+        readonly modeUnavailable: "Pool replacement is unavailable for this storage.";
+        readonly overwriteUnavailable: "Matching server authorizations are preserved: this storage does not support overwriting them.";
+        readonly checkRemovals: "I confirm deletion of the listed authorizations";
+        readonly noFiles: "Choose files.";
+        readonly unauthorized: "Access denied or session expired. Sign in to the application again.";
+        readonly unsupported: "Action unavailable";
+        readonly operationId: "Operation ID";
+        readonly inputError: "The action could not be completed. Reload the current state.";
+        readonly succeeded: "Completed";
+        readonly queued: "Queued";
+        readonly running: "Running";
+        readonly failed: "Failed";
+        readonly cancelled: "Cancelled";
+        readonly partially_applied: "Partially applied";
+        readonly recovery_required: "Recovery required";
+        readonly stateRunning: "running";
+        readonly stopped: "stopped";
+        readonly unknown: "unknown";
+        readonly available: "available";
+        readonly unavailable: "unavailable";
+        readonly reachable: "reachable";
+        readonly managed: "Managed service";
+        readonly remote: "Remote service";
+        readonly usableState: "Usable";
+        readonly disabled: "Disabled";
+        readonly validate: "Validate data";
+        readonly previewPhase: "Preview";
+        readonly drain: "Drain active requests";
+        readonly prepare: "Prepare";
+        readonly switch: "Switch";
+        readonly verify: "Verify result";
+        readonly commit: "Save result";
+        readonly cleanup: "Clean up";
+    };
+};
+export type CpaLocale = keyof typeof labels;
+export type CpaLabels = {
+    [K in keyof typeof labels.en]: string;
+};

package/dist/labels.js

@@ -0,0 +1,184 @@
+export const labels = {
+    ru: {
+        overview: "Обзор",
+        credentials: "Авторизации",
+        models: "Модели",
+        versions: "Версии ядра",
+        operations: "Операции",
+        back: "Назад",
+        refresh: "Обновить",
+        loading: "Загрузка…",
+        retry: "Повторить",
+        empty: "Пока нет данных.",
+        offline: "Недоступно",
+        service: "Сервис",
+        management: "Управление",
+        inference: "Генерация",
+        version: "Версия",
+        status: "Состояние",
+        import: "Импорт авторизаций",
+        choose: "Выбрать ZIP или JSON",
+        directory: "Выбрать папку",
+        uploadHint: "Формат определим по содержимому. Служебные файлы пропустим; временную загрузку удалим после разбора.",
+        preview: "Проверить загрузку",
+        merge: "Дополнить пул",
+        replace: "Заменить весь пул",
+        additions: "Добавить",
+        preserved: "Сохранить",
+        replacements: "Заменить",
+        removals: "Удалить",
+        skipped: "Пропустить",
+        apply: "Подтвердить и применить",
+        cancel: "Отменить",
+        remove: "Удалить",
+        confirm: "Подтвердить",
+        confirmHint: "Действие изменит активную конфигурацию. Продолжить?",
+        active: "Активна",
+        installed: "Установлена",
+        install: "Установить",
+        activate: "Активировать",
+        rollback: "Вернуть предыдущую",
+        discover: "Проверить обновления",
+        probe: "Проверить модель",
+        probeHint: "Проверка делает короткий запрос и может расходовать квоту.",
+        protocol: "Протокол",
+        reasoning: "Рассуждение",
+        stale: "Устаревший каталог — показаны последние успешные данные.",
+        fingerprint: "Отпечаток",
+        provider: "Провайдер",
+        usable: "Доступность",
+        last: "Последнюю рабочую авторизацию удалить нельзя.",
+        safe: "Здесь только безопасные статусы и отпечатки. Ключи и токены не отображаются.",
+        progress: "Ход операции",
+        resume: "Открыть операцию",
+        terminal: "Операция завершена",
+        phase: "Этап",
+        recovery: "Требуется восстановление",
+        partial: "Часть изменений применена. Проверьте фактическое состояние перед новой попыткой.",
+        overwrite: "Заменить совпадающие авторизации",
+        modeUnavailable: "Замена всего пула недоступна для текущего хранилища.",
+        overwriteUnavailable: "Совпадающие серверные авторизации сохраняются: перезапись недоступна для текущего хранилища.",
+        checkRemovals: "Я подтверждаю удаление перечисленных авторизаций",
+        noFiles: "Выберите файлы.",
+        unauthorized: "Нет доступа или сеанс завершён. Войдите в приложение повторно.",
+        unsupported: "Действие недоступно",
+        operationId: "ID операции",
+        inputError: "Не удалось выполнить действие. Повторите загрузку состояния.",
+        succeeded: "Завершено",
+        queued: "В очереди",
+        running: "Выполняется",
+        failed: "Ошибка",
+        cancelled: "Отменено",
+        partially_applied: "Частично применено",
+        recovery_required: "Требуется восстановление",
+        stateRunning: "Запущен",
+        stopped: "Остановлен",
+        unknown: "Не проверено",
+        available: "Доступно",
+        unavailable: "Недоступно",
+        reachable: "Доступна",
+        managed: "Управляемый сервис",
+        remote: "Внешний сервис",
+        usableState: "Рабочая",
+        disabled: "Отключена",
+        validate: "Проверка данных",
+        previewPhase: "Предварительный просмотр",
+        drain: "Ожидание текущих запросов",
+        prepare: "Подготовка",
+        switch: "Переключение",
+        verify: "Проверка результата",
+        commit: "Сохранение результата",
+        cleanup: "Очистка",
+    },
+    en: {
+        overview: "Overview",
+        credentials: "Authorizations",
+        models: "Models",
+        versions: "Core versions",
+        operations: "Operations",
+        back: "Back",
+        refresh: "Refresh",
+        loading: "Loading…",
+        retry: "Retry",
+        empty: "No data yet.",
+        offline: "Unavailable",
+        service: "Service",
+        management: "Management",
+        inference: "Generation",
+        version: "Version",
+        status: "State",
+        import: "Import authorizations",
+        choose: "Choose ZIP or JSON",
+        directory: "Choose folder",
+        uploadHint: "The content determines the format. Unrelated files are skipped; temporary uploads are removed after parsing.",
+        preview: "Validate upload",
+        merge: "Merge pool",
+        replace: "Replace entire pool",
+        additions: "Add",
+        preserved: "Preserve",
+        replacements: "Replace",
+        removals: "Remove",
+        skipped: "Skip",
+        apply: "Confirm and apply",
+        cancel: "Cancel",
+        remove: "Delete",
+        confirm: "Confirm",
+        confirmHint: "This action changes the active configuration. Continue?",
+        active: "Active",
+        installed: "Installed",
+        install: "Install",
+        activate: "Activate",
+        rollback: "Restore previous",
+        discover: "Check for updates",
+        probe: "Probe model",
+        probeHint: "A probe makes a short request and may consume quota.",
+        protocol: "Protocol",
+        reasoning: "Reasoning",
+        stale: "Stale catalog — showing the last successful data.",
+        fingerprint: "Fingerprint",
+        provider: "Provider",
+        usable: "Usability",
+        last: "The last usable authorization cannot be deleted.",
+        safe: "Only safe statuses and fingerprints are shown. Keys and tokens are never displayed.",
+        progress: "Operation progress",
+        resume: "Open operation",
+        terminal: "Operation finished",
+        phase: "Phase",
+        recovery: "Recovery required",
+        partial: "Some changes were applied. Check the actual state before retrying.",
+        overwrite: "Replace matching authorizations",
+        modeUnavailable: "Pool replacement is unavailable for this storage.",
+        overwriteUnavailable: "Matching server authorizations are preserved: this storage does not support overwriting them.",
+        checkRemovals: "I confirm deletion of the listed authorizations",
+        noFiles: "Choose files.",
+        unauthorized: "Access denied or session expired. Sign in to the application again.",
+        unsupported: "Action unavailable",
+        operationId: "Operation ID",
+        inputError: "The action could not be completed. Reload the current state.",
+        succeeded: "Completed",
+        queued: "Queued",
+        running: "Running",
+        failed: "Failed",
+        cancelled: "Cancelled",
+        partially_applied: "Partially applied",
+        recovery_required: "Recovery required",
+        stateRunning: "running",
+        stopped: "stopped",
+        unknown: "unknown",
+        available: "available",
+        unavailable: "unavailable",
+        reachable: "reachable",
+        managed: "Managed service",
+        remote: "Remote service",
+        usableState: "Usable",
+        disabled: "Disabled",
+        validate: "Validate data",
+        previewPhase: "Preview",
+        drain: "Drain active requests",
+        prepare: "Prepare",
+        switch: "Switch",
+        verify: "Verify result",
+        commit: "Save result",
+        cleanup: "Clean up",
+    },
+};

package/dist/styles.css

@@ -0,0 +1,251 @@
+.cpa-kit {
+  --cpa-bg: #fff;
+  --cpa-surface: #f6f8fb;
+  --cpa-text: #172337;
+  --cpa-muted: #617089;
+  --cpa-border: #dbe2ec;
+  --cpa-accent: #3566a8;
+  --cpa-danger: #b53543;
+  --cpa-focus: #4285d4;
+  box-sizing: border-box;
+  color: var(--cpa-text);
+  background: var(--cpa-bg);
+  font: inherit;
+  line-height: 1.5;
+  max-width: 100%;
+  color-scheme: light;
+}
+.cpa-kit[data-theme="dark"] {
+  --cpa-bg: #151c28;
+  --cpa-surface: #1e2939;
+  --cpa-text: #e9eef7;
+  --cpa-muted: #a0afc4;
+  --cpa-border: #34435a;
+  --cpa-accent: #91bafb;
+  --cpa-danger: #ff9aa4;
+  --cpa-focus: #91bafb;
+  color-scheme: dark;
+}
+@media (prefers-color-scheme: dark) {
+  .cpa-kit:not([data-theme="light"]) {
+    --cpa-bg: #151c28;
+    --cpa-surface: #1e2939;
+    --cpa-text: #e9eef7;
+    --cpa-muted: #a0afc4;
+    --cpa-border: #34435a;
+    --cpa-accent: #91bafb;
+    --cpa-danger: #ff9aa4;
+    --cpa-focus: #91bafb;
+    color-scheme: dark;
+  }
+}
+.cpa-kit * {
+  box-sizing: border-box;
+}
+.cpa-kit h2,
+.cpa-kit h3,
+.cpa-kit p {
+  margin: 0;
+}
+.cpa-kit h2 {
+  font-size: 1.35rem;
+  font-weight: 650;
+  letter-spacing: -0.025em;
+}
+.cpa-kit h3 {
+  font-size: 1rem;
+  font-weight: 650;
+}
+.cpa-kit .cpa-head,
+.cpa-kit .cpa-row,
+.cpa-kit .cpa-actions,
+.cpa-kit .cpa-nav {
+  display: flex;
+  align-items: center;
+  gap: 0.65rem;
+  flex-wrap: wrap;
+}
+.cpa-kit .cpa-head {
+  justify-content: space-between;
+  margin-bottom: 1rem;
+}
+.cpa-kit .cpa-nav {
+  margin-bottom: 1rem;
+}
+.cpa-kit .cpa-nav button[aria-current="page"] {
+  color: var(--cpa-accent);
+  background: var(--cpa-surface);
+  border-color: var(--cpa-border);
+}
+.cpa-kit .cpa-panel {
+  display: grid;
+  gap: 1rem;
+}
+.cpa-kit .cpa-card {
+  padding: 1.1rem;
+  border: 1px solid var(--cpa-border);
+  border-radius: 0.65rem;
+  background: var(--cpa-bg);
+  display: grid;
+  gap: 0.8rem;
+}
+.cpa-kit .cpa-grid {
+  display: grid;
+  grid-template-columns: repeat(3, minmax(0, 1fr));
+  gap: 0.85rem;
+}
+.cpa-kit .cpa-muted {
+  font-size: 0.875rem;
+  color: var(--cpa-muted);
+}
+.cpa-kit .cpa-mono {
+  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
+  font-size: 0.875rem;
+  overflow-wrap: anywhere;
+}
+.cpa-kit .cpa-row {
+  justify-content: space-between;
+  padding: 0.8rem 0;
+  border-top: 1px solid var(--cpa-border);
+}
+.cpa-kit .cpa-row:first-child {
+  border-top: 0;
+}
+.cpa-kit .cpa-button {
+  font: inherit;
+  font-size: 0.875rem;
+  font-weight: 550;
+  border: 1px solid var(--cpa-border);
+  border-radius: 0.45rem;
+  background: var(--cpa-bg);
+  color: var(--cpa-text);
+  padding: 0.42rem 0.75rem;
+  cursor: pointer;
+  min-height: 2.2rem;
+}
+.cpa-kit .cpa-button:hover:not(:disabled) {
+  background: var(--cpa-surface);
+}
+.cpa-kit .cpa-button:disabled {
+  opacity: 0.55;
+  cursor: not-allowed;
+}
+.cpa-kit .cpa-danger {
+  color: var(--cpa-danger);
+}
+.cpa-kit .cpa-primary {
+  color: var(--cpa-accent);
+  border-color: var(--cpa-accent);
+}
+.cpa-kit .cpa-badge {
+  padding: 0.12rem 0.45rem;
+  border: 1px solid var(--cpa-border);
+  border-radius: 1rem;
+  font-size: 0.75rem;
+  color: var(--cpa-muted);
+}
+.cpa-kit .cpa-notice {
+  padding: 0.8rem 1rem;
+  border: 1px solid var(--cpa-border);
+  border-left: 3px solid var(--cpa-accent);
+  border-radius: 0.4rem;
+  background: var(--cpa-surface);
+  overflow-wrap: anywhere;
+}
+.cpa-kit .cpa-notice[role="alert"] {
+  border-left-color: var(--cpa-danger);
+}
+.cpa-kit .cpa-form {
+  display: grid;
+  gap: 0.85rem;
+}
+.cpa-kit .cpa-field {
+  display: grid;
+  gap: 0.35rem;
+  font-size: 0.875rem;
+}
+.cpa-kit input:not([type="checkbox"]),
+.cpa-kit select {
+  font: inherit;
+  max-width: 100%;
+  color: var(--cpa-text);
+  background: var(--cpa-bg);
+  padding: 0.45rem;
+  border: 1px solid var(--cpa-border);
+  border-radius: 0.4rem;
+}
+.cpa-kit input[type="file"] {
+  width: 100%;
+}
+.cpa-kit .cpa-check {
+  display: flex;
+  gap: 0.45rem;
+  align-items: flex-start;
+  font-size: 0.875rem;
+}
+.cpa-kit :is(button, input, select):focus-visible {
+  outline: 3px solid var(--cpa-focus);
+  outline-offset: 3px;
+}
+.cpa-kit .cpa-crumbs {
+  display: flex;
+  gap: 0.4rem;
+  align-items: center;
+  margin-bottom: 0.7rem;
+  font-size: 0.875rem;
+}
+.cpa-kit .cpa-stats {
+  display: flex;
+  gap: 1.1rem;
+  flex-wrap: wrap;
+}
+.cpa-kit .cpa-stat strong {
+  font-size: 1.25rem;
+  display: block;
+}
+.cpa-kit .cpa-disabled {
+  font-size: 0.8rem;
+  color: var(--cpa-muted);
+}
+.cpa-kit .cpa-operation {
+  border-left: 3px solid var(--cpa-accent);
+}
+.cpa-kit progress {
+  width: 100%;
+  accent-color: var(--cpa-accent);
+}
+.cpa-kit .cpa-dialog {
+  padding: 1rem;
+  border: 1px solid var(--cpa-border);
+  border-radius: 0.6rem;
+  background: var(--cpa-surface);
+  display: grid;
+  gap: 0.7rem;
+  width: min(100%, 32rem);
+  max-height: 85vh;
+  overflow: auto;
+}
+.cpa-kit .cpa-modal {
+  position: fixed;
+  inset: 0;
+  z-index: 1000;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 1rem;
+  background: rgb(8 18 32 / 55%);
+}
+@media (max-width: 640px) {
+  .cpa-kit .cpa-grid {
+    grid-template-columns: 1fr;
+  }
+  .cpa-kit .cpa-card {
+    padding: 0.85rem;
+  }
+  .cpa-kit .cpa-row {
+    align-items: flex-start;
+  }
+  .cpa-kit .cpa-actions {
+    width: 100%;
+  }
+}

package/package.json

@@ -1,6 +1,51 @@
 {
   "name": "@deksden-com/cpa-kit-react",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
+  "version": "0.1.4",
+  "private": false,
+  "type": "module",
+  "license": "UNLICENSED",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/deksden-com/dd-cpa-kit.git",
+    "directory": "packages/cpa-kit-react"
+  },
+  "homepage": "https://github.com/deksden-com/dd-cpa-kit/blob/main/docs/index.md",
+  "files": [
+    "dist",
+    "README.md",
+    "CHANGELOG.md",
+    "NOTICE"
+  ],
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    },
+    "./styles.css": "./dist/styles.css"
+  },
+  "peerDependencies": {
+    "react": ">=19.2.0 <20",
+    "react-dom": ">=19.2.0 <20",
+    "@deksden-com/cpa-kit": "0.1.4"
+  },
+  "devDependencies": {
+    "@types/react": "^19.2.0",
+    "@types/react-dom": "^19.2.0",
+    "react": "^19.2.0",
+    "react-dom": "^19.2.0",
+    "typescript": "^5.8.3",
+    "vitest": "^4.0.15",
+    "@testing-library/react": "^16.3.0",
+    "jsdom": "^26.1.0",
+    "@deksden-com/cpa-kit": "0.1.4"
+  },
+  "publishConfig": {
+    "registry": "https://registry.npmjs.org/",
+    "access": "public"
+  },
+  "scripts": {
+    "build": "tsc -p tsconfig.json && cp src/styles.css dist/styles.css",
+    "typecheck": "tsc -p tsconfig.json --noEmit",
+    "test": "vitest run"
+  }
 }