@triagepilot/ui 1.1.0

package/LICENSE

@@ -0,0 +1,105 @@
+# Functional Source License, Version 1.1, Apache 2.0 Future License
+
+## Abbreviation
+
+FSL-1.1-Apache-2.0
+
+## Notice
+
+Copyright 2026 Miroslav Babjak
+
+## Terms and Conditions
+
+### Licensor ("We")
+
+The party offering the Software under these Terms and Conditions.
+
+### The Software
+
+The "Software" is each version of the software that we make available under
+these Terms and Conditions, as indicated by our inclusion of these Terms and
+Conditions with the Software.
+
+### License Grant
+
+Subject to your compliance with this License Grant and the Patents,
+Redistribution and Trademark clauses below, we hereby grant you the right to
+use, copy, modify, create derivative works, publicly perform, publicly display
+and redistribute the Software for any Permitted Purpose identified below.
+
+### Permitted Purpose
+
+A Permitted Purpose is any purpose other than a Competing Use. A Competing Use
+means making the Software available to others in a commercial product or
+service that:
+
+1. substitutes for the Software;
+
+2. substitutes for any other product or service we offer using the Software
+   that exists as of the date we make the Software available; or
+
+3. offers the same or substantially similar functionality as the Software.
+
+Permitted Purposes specifically include using the Software:
+
+1. for your internal use and access;
+
+2. for non-commercial education;
+
+3. for non-commercial research; and
+
+4. in connection with professional services that you provide to a licensee
+   using the Software in accordance with these Terms and Conditions.
+
+### Patents
+
+To the extent your use for a Permitted Purpose would necessarily infringe our
+patents, the license grant above includes a license under our patents. If you
+make a claim against any party that the Software infringes or contributes to
+the infringement of any patent, then your patent license to the Software ends
+immediately.
+
+### Redistribution
+
+The Terms and Conditions apply to all copies, modifications and derivatives of
+the Software.
+
+If you redistribute any copies, modifications or derivatives of the Software,
+you must include a copy of or a link to these Terms and Conditions and not
+remove any copyright notices provided in or with the Software.
+
+### Disclaimer
+
+THE SOFTWARE IS PROVIDED "AS IS" AND WITHOUT WARRANTIES OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING WITHOUT LIMITATION WARRANTIES OF FITNESS FOR A PARTICULAR
+PURPOSE, MERCHANTABILITY, TITLE OR NON-INFRINGEMENT.
+
+IN NO EVENT WILL WE HAVE ANY LIABILITY TO YOU ARISING OUT OF OR RELATED TO THE
+SOFTWARE, INCLUDING INDIRECT, SPECIAL, INCIDENTAL OR CONSEQUENTIAL DAMAGES,
+EVEN IF WE HAVE BEEN INFORMED OF THEIR POSSIBILITY IN ADVANCE.
+
+### Trademarks
+
+Except for displaying the License Details and identifying us as the origin of
+the Software, you have no right under these Terms and Conditions to use our
+trademarks, trade names, service marks or product names.
+
+## Grant of Future License
+
+We hereby irrevocably grant you an additional license to use the Software under
+the Apache License, Version 2.0 that is effective on the second anniversary of
+the date we make the Software available. On or after that date, you may use the
+Software under the Apache License, Version 2.0, in which case the following
+will apply:
+
+Licensed under the Apache License, Version 2.0 (the "License"); you may not use
+this file except in compliance with the License.
+
+You may obtain a copy of the License at
+
+http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software distributed
+under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR
+CONDITIONS OF ANY KIND, either express or implied. See the License for the
+specific language governing permissions and limitations under the License.

package/dist/api.d.ts

@@ -0,0 +1,155 @@
+import type { ActionStatus, RepositoryMode, ReviewerReplacementOutcome, RiskTier, RoutingAction } from "@triagepilot/contracts";
+export interface WorkspaceContext {
+    id: string;
+    displayName: string;
+}
+export interface AuthorizationCapabilities {
+    canViewOperations: boolean;
+    canManageConfiguration: boolean;
+    canManageReviewerAvailability: boolean;
+    canRunRoutingRecovery: boolean;
+}
+export type NavigationTarget = "configuration";
+export interface NavigationHost {
+    hrefFor(target: NavigationTarget): string;
+}
+export interface OperationsApiClient {
+    readOperationsOverview(workspace: WorkspaceContext): Promise<OperationsOverview>;
+    readEffectiveConfiguration(workspace: WorkspaceContext, repository: RepositoryContext): Promise<EffectiveConfigurationOverview>;
+    readAvailabilitySettings(workspace: WorkspaceContext): Promise<AvailabilitySettingsOverview>;
+    updateAvailabilityTimezone(workspace: WorkspaceContext, timezone: string): Promise<AvailabilitySettingsOverview>;
+    listReviewerAbsences(workspace: WorkspaceContext): Promise<ReviewerAbsenceOverview[]>;
+    scheduleReviewerAbsence(workspace: WorkspaceContext, input: ReviewerAbsenceMutation): Promise<ReviewerAbsenceOverview>;
+    reviseReviewerAbsence(workspace: WorkspaceContext, absenceId: string, input: ReviewerAbsenceMutation & {
+        expectedRevision: number;
+    }): Promise<ReviewerAbsenceOverview>;
+    cancelReviewerAbsence(workspace: WorkspaceContext, absenceId: string, expectedRevision: number): Promise<ReviewerAbsenceOverview>;
+    listReviewerReplacementHistory(workspace: WorkspaceContext, absenceId?: string): Promise<ReviewerReplacementOverview[]>;
+    queueRoutingRecovery(workspace: WorkspaceContext, request: {
+        decisionId: string;
+    } | {
+        changeRequestUrl: string;
+    }): Promise<{
+        jobId: string;
+    }>;
+}
+export interface AvailabilitySettingsOverview {
+    timezone: string;
+    updatedAt: string;
+}
+export interface ReviewerAbsenceMutation {
+    externalActorId: string;
+    startLocal: string;
+    endLocal: string;
+    startUtcOffset?: string;
+    endUtcOffset?: string;
+}
+export interface ReviewerAbsenceOverview {
+    id: string;
+    externalActorId: string;
+    startAt: string;
+    endAt: string;
+    status: "active" | "upcoming" | "ended" | "cancelled";
+    revision: number;
+    cancelledAt: string | null;
+    createdAt: string;
+    updatedAt: string;
+}
+export interface ReviewerReplacementOverview {
+    id: string;
+    absenceId: string;
+    absenceRevision: number;
+    decisionId: string;
+    unavailableActorId: string;
+    replacementActorId: string | null;
+    outcome: ReviewerReplacementOutcome;
+    reason: string;
+    state: "finalizer_pending" | "completed" | "permanent_failure";
+    lastError: string | null;
+    completedAt: string;
+}
+export interface ProviderLink {
+    label: string;
+    href: string | null;
+}
+export interface RepositoryContext {
+    id: string;
+    repository: ProviderLink;
+}
+export interface ProviderStatusOverview {
+    id: string;
+    label: string;
+    value: string;
+    detail?: string;
+    state?: "neutral" | "healthy" | "failed";
+}
+export interface RepositoryOverview extends RepositoryContext {
+    configState: string;
+    mode: RepositoryMode;
+}
+export interface DecisionOverview {
+    id: string;
+    repository: ProviderLink;
+    changeRequest: ProviderLink | null;
+    mode: RepositoryMode;
+    action: RoutingAction;
+    actionStatus: ActionStatus;
+    actionError: string | null;
+    policyCheckState: "not_started" | "in_progress" | "success" | "failure";
+    riskScore: number;
+    riskBreakdown: RiskBreakdown | null;
+    requestedReviewerCount: number | null;
+    reviewerShortfall: number | null;
+    selectedReviewer: string | null;
+    selectedReviewers: string[];
+    createdAt: string;
+}
+export interface RiskBreakdown {
+    classifierVersion: string;
+    tier: RiskTier;
+    components: Array<{
+        reason: string;
+        score: number;
+        detail: string;
+    }>;
+}
+export interface JobFailureOverview {
+    id: string;
+    error: string;
+    failedAt: string;
+}
+export interface ActionFailureOverview {
+    decisionId: string;
+    repository: ProviderLink;
+    error: string;
+    failedAt: string;
+}
+export interface OperationsOverview {
+    statuses: ProviderStatusOverview[];
+    repositories: RepositoryOverview[];
+    decisions: DecisionOverview[];
+    failures: {
+        jobs: JobFailureOverview[];
+        actions: ActionFailureOverview[];
+    };
+    worker: {
+        available: boolean;
+        workerId: string | null;
+        lastHeartbeatAt: string | null;
+    };
+}
+export interface EffectiveConfigurationOverview {
+    repository: ProviderLink;
+    trustedPath: string | null;
+    trustedRevision: string;
+    repositoryRevision: string | null;
+    inheritanceMode: "defaults" | "organization" | "replace" | "inherit" | "legacy";
+    effectiveHash: string | null;
+    values: EffectiveConfigurationValue[];
+}
+export interface EffectiveConfigurationValue {
+    path: string;
+    label: string;
+    value: unknown;
+    source: "default" | "organization" | "repository";
+}

package/dist/api.js

@@ -0,0 +1 @@
+export {};

package/dist/components/EffectiveConfiguration.d.ts

@@ -0,0 +1,10 @@
+import type { AuthorizationCapabilities, EffectiveConfigurationOverview, NavigationHost, OperationsApiClient, RepositoryContext, WorkspaceContext } from "../api.js";
+export interface EffectiveConfigurationProps {
+    api: OperationsApiClient;
+    workspace: WorkspaceContext;
+    repository: RepositoryContext;
+    authorization: AuthorizationCapabilities;
+    navigation: NavigationHost;
+    initialConfiguration?: EffectiveConfigurationOverview;
+}
+export declare function EffectiveConfiguration({ api, workspace, repository, authorization, navigation, initialConfiguration, }: EffectiveConfigurationProps): import("react").JSX.Element;

package/dist/components/EffectiveConfiguration.js

@@ -0,0 +1,48 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from "react";
+export function EffectiveConfiguration({ api, workspace, repository, authorization, navigation, initialConfiguration, }) {
+    const [state, setState] = useState(initialConfiguration ? { status: "ready", configuration: initialConfiguration } : { status: "loading" });
+    async function loadConfiguration() {
+        if (!authorization.canViewOperations) {
+            setState({ status: "failed", message: "Configuration is not available for this workspace." });
+            return;
+        }
+        setState({ status: "loading" });
+        try {
+            setState({ status: "ready", configuration: await api.readEffectiveConfiguration(workspace, repository) });
+        }
+        catch (caught) {
+            setState({ status: "failed", message: messageFrom(caught, "Could not load the effective configuration.") });
+        }
+    }
+    useEffect(() => {
+        if (initialConfiguration) {
+            setState({ status: "ready", configuration: initialConfiguration });
+            return;
+        }
+        void loadConfiguration();
+    }, [api, workspace.id, repository.id, authorization.canViewOperations, initialConfiguration]);
+    if (state.status === "loading") {
+        return (_jsxs("section", { className: "data-section", role: "status", "aria-live": "polite", children: [_jsx("div", { className: "section-heading", children: _jsx("h2", { children: "Effective configuration" }) }), _jsx("p", { className: "empty-cell", children: "Reading configuration provenance." })] }));
+    }
+    if (state.status === "failed") {
+        return (_jsxs("section", { className: "data-section data-section--danger", "aria-labelledby": "configuration-error-title", children: [_jsx("div", { className: "section-heading", children: _jsx("h2", { id: "configuration-error-title", children: "Effective configuration" }) }), _jsx("p", { role: "alert", className: "notice notice--danger", children: state.message })] }));
+    }
+    const configuration = state.configuration;
+    return (_jsxs("section", { className: "effective-configuration data-section", id: "effective-configuration", "aria-labelledby": "effective-configuration-heading", children: [_jsxs("div", { className: "section-heading", children: [_jsx("h2", { id: "effective-configuration-heading", children: "Effective configuration" }), authorization.canManageConfiguration ? (_jsx("a", { className: "button-link button-link--quiet", href: navigation.hrefFor("configuration"), children: "Edit configuration" })) : null] }), _jsxs("dl", { className: "configuration-provenance", children: [_jsxs("div", { children: [_jsx("dt", { children: "Workspace" }), _jsx("dd", { children: workspace.displayName })] }), _jsxs("div", { children: [_jsx("dt", { children: "Repository" }), _jsx("dd", { children: _jsx(ProviderLinkValue, { link: configuration.repository }) })] }), _jsxs("div", { children: [_jsx("dt", { children: "Trusted path" }), _jsx("dd", { children: configuration.trustedPath ?? "No repository configuration" })] }), _jsxs("div", { children: [_jsx("dt", { children: "Trusted revision" }), _jsx("dd", { children: configuration.repositoryRevision ?? configuration.trustedRevision })] }), _jsxs("div", { children: [_jsx("dt", { children: "Inheritance" }), _jsx("dd", { children: configuration.inheritanceMode })] }), _jsxs("div", { children: [_jsx("dt", { children: "Effective hash" }), _jsx("dd", { children: configuration.effectiveHash ?? "invalid" })] })] }), _jsx("div", { className: "table-scroll", role: "region", tabIndex: 0, "aria-labelledby": "effective-configuration-heading", children: _jsxs("table", { children: [_jsx("caption", { className: "sr-only", children: "Effective configuration values" }), _jsx("thead", { children: _jsxs("tr", { children: [_jsx("th", { scope: "col", children: "Value" }), _jsx("th", { scope: "col", children: "Setting" }), _jsx("th", { scope: "col", children: "Source" })] }) }), _jsx("tbody", { children: configuration.values.length === 0 ? (_jsx("tr", { children: _jsx("td", { className: "empty-cell", colSpan: 3, children: "No effective configuration values are available." }) })) : (configuration.values.map((entry) => (_jsxs("tr", { children: [_jsx("td", { className: "data-text", children: formatValue(entry.value) }), _jsxs("th", { scope: "row", children: [_jsx("span", { className: "data-text", children: entry.label }), _jsx("span", { className: "cell-detail", children: entry.path })] }), _jsx("td", { children: _jsxs("span", { className: `chip chip--${entry.source}`, children: [entry.source, " source"] }) })] }, entry.path)))) })] }) })] }));
+}
+function ProviderLinkValue({ link }) {
+    return link.href === null ? link.label : (_jsx("a", { href: link.href, target: "_blank", rel: "noreferrer", children: link.label }));
+}
+function formatValue(value) {
+    if (typeof value === "string")
+        return value;
+    if (typeof value === "number" || typeof value === "boolean")
+        return String(value);
+    if (value === null)
+        return "null";
+    return JSON.stringify(value);
+}
+function messageFrom(caught, fallback) {
+    return caught instanceof Error ? caught.message : fallback;
+}

package/dist/components/OperationsDashboard.d.ts

@@ -0,0 +1,13 @@
+import { type ReactNode } from "react";
+import type { AuthorizationCapabilities, NavigationHost, OperationsApiClient, OperationsOverview, WorkspaceContext } from "../api.js";
+export interface OperationsDashboardProps {
+    api: OperationsApiClient;
+    workspace: WorkspaceContext;
+    authorization: AuthorizationCapabilities;
+    navigation: NavigationHost;
+    initialOverview?: OperationsOverview;
+    headerActions?: ReactNode;
+    onUnauthorized?(message: string): void;
+    onOverviewChange?(overview: OperationsOverview): void;
+}
+export declare function OperationsDashboard({ ...props }: OperationsDashboardProps): import("react").JSX.Element;

package/dist/components/OperationsDashboard.js

@@ -0,0 +1,168 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useRef, useState } from "react";
+export function OperationsDashboard({ ...props }) {
+    return _jsx(OperationsDashboardWorkspace, { ...props }, props.workspace.id);
+}
+function OperationsDashboardWorkspace({ api, workspace, authorization, navigation, initialOverview, headerActions, onUnauthorized, onOverviewChange, }) {
+    const [state, setState] = useState(() => !authorization.canViewOperations
+        ? { status: "failed", message: "Operations are not available for this workspace." }
+        : initialOverview
+            ? { status: "ready", overview: initialOverview }
+            : { status: "loading" });
+    const [recoveryUrl, setRecoveryUrl] = useState("");
+    const [pendingRecovery, setPendingRecovery] = useState(null);
+    const [recoveryNotice, setRecoveryNotice] = useState(null);
+    const recoveryInFlight = useRef(false);
+    async function loadOverview() {
+        if (!authorization.canViewOperations) {
+            setState({ status: "failed", message: "Operations are not available for this workspace." });
+            return;
+        }
+        setState({ status: "loading" });
+        try {
+            const overview = await api.readOperationsOverview(workspace);
+            setState({ status: "ready", overview });
+            onOverviewChange?.(overview);
+        }
+        catch (caught) {
+            if (isUnauthorized(caught)) {
+                onUnauthorized?.(messageFrom(caught, "The operations session has expired."));
+                return;
+            }
+            setState({ status: "failed", message: messageFrom(caught, "Could not load the operations overview.") });
+        }
+    }
+    useEffect(() => {
+        if (!authorization.canViewOperations) {
+            setState({ status: "failed", message: "Operations are not available for this workspace." });
+            return;
+        }
+        if (initialOverview) {
+            setState({ status: "ready", overview: initialOverview });
+            return;
+        }
+        void loadOverview();
+    }, [api, workspace.id, authorization.canViewOperations, initialOverview]);
+    async function queueRecovery(request, key) {
+        if (recoveryInFlight.current || !authorization.canRunRoutingRecovery)
+            return;
+        recoveryInFlight.current = true;
+        setPendingRecovery(key);
+        setRecoveryNotice(null);
+        try {
+            await api.queueRoutingRecovery(workspace, request);
+            if ("changeRequestUrl" in request)
+                setRecoveryUrl("");
+            setRecoveryNotice({
+                tone: "success",
+                message: "Routing run queued. The new revision will appear after the worker processes it.",
+            });
+            await loadOverview();
+        }
+        catch (caught) {
+            const message = messageFrom(caught, "Could not queue the routing run.");
+            if (isUnauthorized(caught)) {
+                onUnauthorized?.(message);
+                return;
+            }
+            setRecoveryNotice({ tone: "danger", message });
+        }
+        finally {
+            recoveryInFlight.current = false;
+            setPendingRecovery(null);
+        }
+    }
+    async function submitMissingRequest(event) {
+        event.preventDefault();
+        await queueRecovery({ changeRequestUrl: recoveryUrl }, "missing-request");
+    }
+    if (state.status === "loading") {
+        return (_jsxs("section", { className: "operations-state", role: "status", "aria-live": "polite", children: [headerActions ? _jsx("div", { className: "operations-actions operations-actions--state", children: headerActions }) : null, _jsx("p", { className: "eyebrow", children: workspace.displayName }), _jsx("h1", { children: "Loading operational data" }), _jsx("p", { className: "lede", children: "Reading the current installation state." })] }));
+    }
+    if (state.status === "failed") {
+        return (_jsxs("section", { className: "operations-state", "aria-labelledby": "overview-error-title", children: [headerActions ? _jsx("div", { className: "operations-actions operations-actions--state", children: headerActions }) : null, _jsx("p", { className: "eyebrow", children: "Operations unavailable" }), _jsx("h1", { id: "overview-error-title", children: "The dashboard could not load" }), _jsx("p", { role: "alert", className: "notice notice--danger", children: state.message }), authorization.canViewOperations ? (_jsx("div", { className: "recovery-actions", children: _jsx("button", { type: "button", onClick: () => void loadOverview(), children: "Retry overview" }) })) : null] }));
+    }
+    const overview = state.overview;
+    return (_jsxs("section", { className: "operations-dashboard", id: "overview", children: [_jsxs("div", { className: "operations-heading", children: [_jsxs("div", { children: [_jsx("h1", { id: "dashboard-title", children: "Operations ledger" }), _jsx("p", { className: "lede", children: "Monitor routing health and review the decisions made by this installation." })] }), headerActions || authorization.canManageConfiguration ? (_jsxs("div", { className: "operations-actions", children: [headerActions, authorization.canManageConfiguration ? (_jsx("a", { className: "button-link button-link--quiet", href: navigation.hrefFor("configuration"), children: "Edit configuration" })) : null] })) : null] }), _jsxs("section", { className: "status-ledger", id: "system-health", "aria-label": "Installation status", children: [overview.statuses.map((status) => (_jsx(StatusNode, { label: status.label, value: status.value, ...(status.detail === undefined ? {} : { detail: status.detail }), ...(status.state === undefined ? {} : { state: status.state }) }, status.id))), _jsx(StatusNode, { label: "Worker", value: overview.worker.available ? "Worker available" : "Worker unavailable", detail: overview.worker.lastHeartbeatAt
+                            ? `Last heartbeat ${formatDate(overview.worker.lastHeartbeatAt)}`
+                            : "No heartbeat recorded", state: overview.worker.available ? "healthy" : "failed" })] }), _jsx(DataSection, { id: "repositories", title: "Connected repositories", count: overview.repositories.length, children: _jsx(TableRegion, { labelledBy: "repositories-heading", children: _jsxs("table", { children: [_jsx("caption", { className: "sr-only", children: "Connected repositories" }), _jsx("thead", { children: _jsxs("tr", { children: [_jsx("th", { scope: "col", children: "Repository" }), _jsx("th", { scope: "col", children: "Configuration" }), _jsx("th", { scope: "col", children: "Mode" })] }) }), _jsx("tbody", { children: overview.repositories.length === 0 ? (_jsx(EmptyRow, { columns: 3, children: "No repositories are connected to this provider connection." })) : (overview.repositories.map((repository) => (_jsxs("tr", { children: [_jsx("th", { scope: "row", className: "data-text", children: _jsx(ProviderLinkValue, { link: repository.repository }) }), _jsx("td", { children: _jsx(StatusChip, { value: repository.configState }) }), _jsx("td", { children: _jsx(StatusChip, { value: repository.mode }) })] }, repository.id)))) })] }) }) }), _jsxs(DataSection, { id: "decisions", title: "Recent routing decisions", count: overview.decisions.length, children: [authorization.canRunRoutingRecovery ? (_jsxs("form", { className: "routing-recovery-form", onSubmit: (event) => void submitMissingRequest(event), children: [_jsxs("div", { children: [_jsx("label", { htmlFor: "routing-recovery-url", children: "Run missing change request" }), _jsx("span", { className: "cell-detail", children: "Use its provider URL or reference when no routing decision exists yet." })] }), _jsx("input", { id: "routing-recovery-url", type: "url", required: true, placeholder: "https://provider.example/owner/repository/change/123", value: recoveryUrl, onChange: (event) => setRecoveryUrl(event.target.value), disabled: pendingRecovery !== null }), _jsx("button", { type: "submit", disabled: pendingRecovery !== null, children: pendingRecovery === "missing-request" ? "Queueing…" : "Run routing" })] })) : null, recoveryNotice ? (_jsxs("div", { role: recoveryNotice.tone === "danger" ? "alert" : "status", className: `notice notice--${recoveryNotice.tone} routing-notice`, children: [_jsx("span", { children: recoveryNotice.message }), recoveryNotice.tone === "success" ? (_jsx("button", { className: "button--quiet button--compact", type: "button", disabled: pendingRecovery !== null, onClick: () => void loadOverview(), children: "Refresh ledger" })) : null] })) : null, _jsx(TableRegion, { labelledBy: "decisions-heading", children: _jsxs("table", { children: [_jsx("caption", { className: "sr-only", children: "Recent routing decisions" }), _jsx("thead", { children: _jsxs("tr", { children: [_jsx("th", { scope: "col", children: "Change request" }), _jsx("th", { scope: "col", children: "Risk" }), _jsx("th", { scope: "col", children: "Route" }), _jsx("th", { scope: "col", children: "Human review" }), _jsx("th", { scope: "col", children: "Outcome" }), _jsx("th", { scope: "col", children: "Reviewers" }), _jsx("th", { scope: "col", children: "Recorded" }), authorization.canRunRoutingRecovery ? _jsx("th", { scope: "col", children: "Action" }) : null] }) }), _jsx("tbody", { children: overview.decisions.length === 0 ? (_jsx(EmptyRow, { columns: authorization.canRunRoutingRecovery ? 8 : 7, children: "No routing decisions have been recorded yet." })) : (overview.decisions.map((decision) => (_jsxs("tr", { children: [_jsxs("th", { scope: "row", children: [_jsx("span", { className: "data-text", children: _jsx(ProviderLinkValue, { link: decision.repository }) }), _jsx("span", { className: "cell-detail", children: decision.changeRequest === null ? ("—") : (_jsx(ProviderLinkValue, { link: decision.changeRequest })) })] }), _jsxs("td", { children: [_jsx("span", { className: "data-text", children: decision.riskScore }), _jsx(RiskBreakdown, { breakdown: decision.riskBreakdown })] }), _jsxs("td", { children: [_jsx("span", { className: "data-text", children: labelFor(decision.action) }), _jsx("span", { className: "cell-detail", children: decision.mode })] }), _jsx("td", { children: _jsx(HumanReviewStatusChip, { state: decision.policyCheckState }) }), _jsxs("td", { children: [_jsx(StatusChip, { value: decision.actionStatus }), decision.actionError ? _jsx("span", { className: "cell-error", children: decision.actionError }) : null] }), _jsxs("td", { children: [_jsx("span", { className: "data-text", children: decision.selectedReviewers.join(", ") || "—" }), _jsx(ReviewerRequirement, { decision: decision })] }), _jsx("td", { children: _jsx("time", { dateTime: decision.createdAt, children: formatDate(decision.createdAt) }) }), authorization.canRunRoutingRecovery ? (_jsx("td", { children: decision.changeRequest === null ? (_jsx("span", { className: "cell-detail", children: "\u2014" })) : (_jsx("button", { className: "button--compact", type: "button", disabled: pendingRecovery !== null, onClick: () => void queueRecovery({ decisionId: decision.id }, decision.id), children: pendingRecovery === decision.id ? "Queueing…" : "Re-run routing" })) })) : null] }, decision.id)))) })] }) })] }), _jsxs("div", { className: "failure-grid", children: [_jsx(DataSection, { id: "job-failures", title: "Permanent job failures", count: overview.failures.jobs.length, tone: "danger", children: _jsx(TableRegion, { labelledBy: "job-failures-heading", children: _jsxs("table", { children: [_jsx("caption", { className: "sr-only", children: "Permanent job failures" }), _jsx("thead", { children: _jsxs("tr", { children: [_jsx("th", { scope: "col", children: "Job" }), _jsx("th", { scope: "col", children: "Error" }), _jsx("th", { scope: "col", children: "Failed" })] }) }), _jsx("tbody", { children: overview.failures.jobs.length === 0 ? (_jsx(EmptyRow, { columns: 3, children: "No permanent job failures." })) : (overview.failures.jobs.map((failure) => (_jsxs("tr", { children: [_jsx("th", { scope: "row", className: "data-text id-cell", children: failure.id }), _jsx("td", { children: failure.error }), _jsx("td", { children: _jsx("time", { dateTime: failure.failedAt, children: formatDate(failure.failedAt) }) })] }, failure.id)))) })] }) }) }), _jsx(DataSection, { id: "action-failures", title: "Action failures", count: overview.failures.actions.length, tone: "danger", children: _jsx(TableRegion, { labelledBy: "action-failures-heading", children: _jsxs("table", { children: [_jsx("caption", { className: "sr-only", children: "Action failures" }), _jsx("thead", { children: _jsxs("tr", { children: [_jsx("th", { scope: "col", children: "Repository" }), _jsx("th", { scope: "col", children: "Error" }), _jsx("th", { scope: "col", children: "Failed" })] }) }), _jsx("tbody", { children: overview.failures.actions.length === 0 ? (_jsx(EmptyRow, { columns: 3, children: "No action failures." })) : (overview.failures.actions.map((failure) => (_jsxs("tr", { children: [_jsx("th", { scope: "row", className: "data-text", children: _jsx(ProviderLinkValue, { link: failure.repository }) }), _jsx("td", { children: failure.error }), _jsx("td", { children: _jsx("time", { dateTime: failure.failedAt, children: formatDate(failure.failedAt) }) })] }, failure.decisionId)))) })] }) }) })] })] }));
+}
+function ProviderLinkValue({ link }) {
+    return link.href === null ? link.label : (_jsx("a", { href: link.href, target: "_blank", rel: "noreferrer", children: link.label }));
+}
+function RiskBreakdown({ breakdown }) {
+    if (!breakdown)
+        return _jsx("span", { className: "cell-detail", children: "Breakdown unavailable" });
+    return (_jsxs("details", { className: "risk-breakdown", children: [_jsx("summary", { children: "Score breakdown" }), _jsxs("p", { className: "risk-breakdown__meta", children: [breakdown.classifierVersion, " \u00B7 ", breakdown.tier] }), _jsx("ul", { children: breakdown.components.map((component, index) => (_jsxs("li", { children: [_jsx("span", { className: "data-text risk-breakdown__score", children: formatComponentScore(component) }), _jsxs("span", { children: [_jsx("strong", { children: labelForRiskComponent(component.reason) }), _jsx("span", { className: "cell-detail", children: component.detail })] })] }, `${component.reason}-${index}`))) })] }));
+}
+function ReviewerRequirement({ decision }) {
+    if (decision.requestedReviewerCount === null || decision.requestedReviewerCount <= 0)
+        return null;
+    const reviewerShortfall = decision.reviewerShortfall ?? Math.max(0, decision.requestedReviewerCount - decision.selectedReviewers.length);
+    return (_jsxs("span", { className: "cell-detail", children: [decision.selectedReviewers.length, " of ", decision.requestedReviewerCount, " required", reviewerShortfall > 0 ? ` · shortfall ${reviewerShortfall}` : ""] }));
+}
+function TableRegion({ labelledBy, children }) {
+    return (_jsx("div", { className: "table-scroll", role: "region", tabIndex: 0, "aria-labelledby": labelledBy, children: children }));
+}
+function StatusNode({ label, value, detail, state = "neutral", }) {
+    return (_jsxs("div", { className: `status-node status-node--${state}`, children: [_jsx("span", { className: "status-label", children: label }), _jsx("strong", { children: value }), detail ? _jsx("small", { children: detail }) : null] }));
+}
+function DataSection({ id, title, count, tone = "neutral", children, }) {
+    return (_jsxs("section", { className: `data-section data-section--${tone}`, id: id, children: [_jsxs("div", { className: "section-heading", children: [_jsx("h2", { id: `${id}-heading`, children: title }), _jsx("span", { className: "count", "aria-label": `${count} records`, children: count })] }), children] }));
+}
+function EmptyRow({ columns, children }) {
+    return (_jsx("tr", { children: _jsx("td", { className: "empty-cell", colSpan: columns, children: children }) }));
+}
+function StatusChip({ value }) {
+    return _jsx("span", { className: `chip chip--${value.replaceAll("_", "-")}`, children: labelFor(value) });
+}
+function HumanReviewStatusChip({ state }) {
+    const tone = state === "success" ? "succeeded" : state === "failure" ? "failed" : "neutral";
+    return _jsx("span", { className: `chip chip--${tone}`, children: humanReviewLabelFor(state) });
+}
+function humanReviewLabelFor(state) {
+    switch (state) {
+        case "in_progress":
+            return "Waiting for approval";
+        case "success":
+            return "Approved";
+        case "failure":
+            return "Failed";
+        case "not_started":
+            return "Not started";
+    }
+}
+function formatComponentScore(component) {
+    if (component.reason === "docs_or_test_suppressor")
+        return "cap";
+    return component.score >= 0 ? `+${component.score}` : String(component.score);
+}
+function labelForRiskComponent(reason) {
+    const labels = {
+        changed_file_count: "Changed file count",
+        large_line_delta: "Large line delta",
+        dependency_lockfile_change: "Dependency lockfile change",
+        migration_or_schema_change: "Migration or schema change",
+        ai_authorship_signal: "AI authorship signal",
+        docs_or_test_suppressor: "Documentation or test-only cap",
+    };
+    if (reason.startsWith("high_risk_path:")) {
+        return `High-risk path: ${reason.slice("high_risk_path:".length)}`;
+    }
+    return labels[reason] ?? reason.replaceAll("_", " ");
+}
+function labelFor(value) {
+    return value.replaceAll("_", " ");
+}
+function formatDate(value) {
+    return new Intl.DateTimeFormat(undefined, {
+        dateStyle: "medium",
+        timeStyle: "short",
+    }).format(new Date(value));
+}
+function messageFrom(caught, fallback) {
+    return caught instanceof Error ? caught.message : fallback;
+}
+function isUnauthorized(caught) {
+    return typeof caught === "object" && caught !== null && "status" in caught && caught.status === 401;
+}

package/dist/components/ReviewerAvailability.d.ts

@@ -0,0 +1,11 @@
+import type { AuthorizationCapabilities, AvailabilitySettingsOverview, OperationsApiClient, ReviewerAbsenceOverview, ReviewerReplacementOverview, WorkspaceContext } from "../api.js";
+export interface ReviewerAvailabilityProps {
+    api: OperationsApiClient;
+    workspace: WorkspaceContext;
+    authorization: AuthorizationCapabilities;
+    initialSettings?: AvailabilitySettingsOverview;
+    initialAbsences?: ReviewerAbsenceOverview[];
+    initialReplacementHistory?: ReviewerReplacementOverview[];
+    onUnauthorized?(message: string): void;
+}
+export declare function ReviewerAvailability({ ...props }: ReviewerAvailabilityProps): import("react").JSX.Element;

package/dist/components/ReviewerAvailability.js

@@ -0,0 +1,158 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useEffect, useRef, useState } from "react";
+const emptyForm = { externalActorId: "", startLocal: "", endLocal: "" };
+export function ReviewerAvailability({ ...props }) {
+    return _jsx(ReviewerAvailabilityWorkspace, { ...props }, props.workspace.id);
+}
+function ReviewerAvailabilityWorkspace({ api, workspace, authorization, initialSettings, initialAbsences, initialReplacementHistory, onUnauthorized, }) {
+    const [settings, setSettings] = useState(initialSettings ?? null);
+    const [timezone, setTimezone] = useState(initialSettings?.timezone ?? "UTC");
+    const [absences, setAbsences] = useState(initialAbsences ?? []);
+    const [history, setHistory] = useState(initialReplacementHistory ?? []);
+    const [form, setForm] = useState(emptyForm);
+    const [editing, setEditing] = useState(null);
+    const [cancelling, setCancelling] = useState(null);
+    const [loading, setLoading] = useState(initialSettings === undefined || initialAbsences === undefined || initialReplacementHistory === undefined);
+    const [pending, setPending] = useState(null);
+    const [error, setError] = useState(null);
+    const mutationInFlight = useRef(false);
+    useEffect(() => {
+        if (!authorization.canViewOperations)
+            return;
+        if (initialSettings !== undefined && initialAbsences !== undefined && initialReplacementHistory !== undefined)
+            return;
+        let current = true;
+        setLoading(true);
+        void Promise.all([
+            api.readAvailabilitySettings(workspace),
+            api.listReviewerAbsences(workspace),
+            api.listReviewerReplacementHistory(workspace),
+        ]).then(([nextSettings, nextAbsences, nextHistory]) => {
+            if (!current)
+                return;
+            setSettings(nextSettings);
+            setTimezone(nextSettings.timezone);
+            setAbsences(nextAbsences);
+            setHistory(nextHistory);
+            setError(null);
+        }).catch((caught) => handleError(caught, onUnauthorized, setError)).finally(() => {
+            if (current)
+                setLoading(false);
+        });
+        return () => { current = false; };
+    }, [api, workspace, authorization.canViewOperations, initialSettings, initialAbsences, initialReplacementHistory, onUnauthorized]);
+    if (!authorization.canViewOperations) {
+        return _jsx("section", { className: "availability-grid", id: "reviewer-availability", children: _jsx("p", { children: "You are not authorized to view reviewer availability." }) });
+    }
+    if (loading || settings === null) {
+        return _jsx("section", { className: "availability-grid", id: "reviewer-availability", "aria-live": "polite", children: _jsx("p", { children: "Loading reviewer availability\u2026" }) });
+    }
+    const busy = pending !== null;
+    async function mutate(key, action) {
+        if (mutationInFlight.current)
+            return false;
+        mutationInFlight.current = true;
+        setPending(key);
+        setError(null);
+        try {
+            await action();
+            return true;
+        }
+        catch (caught) {
+            handleError(caught, onUnauthorized, setError);
+            return false;
+        }
+        finally {
+            mutationInFlight.current = false;
+            setPending(null);
+        }
+    }
+    async function submitTimezone(event) {
+        event.preventDefault();
+        if (editing !== null)
+            return;
+        await mutate("timezone", async () => {
+            const next = await api.updateAvailabilityTimezone(workspace, timezone);
+            setSettings(next);
+        });
+    }
+    async function submitAbsence(event) {
+        event.preventDefault();
+        const current = editing;
+        const saved = await mutate("absence", async () => {
+            const next = current
+                ? await api.reviseReviewerAbsence(workspace, current.id, { ...form, expectedRevision: current.revision })
+                : await api.scheduleReviewerAbsence(workspace, form);
+            setAbsences((items) => [next, ...items.filter((item) => item.id !== next.id)]);
+        });
+        if (saved) {
+            setEditing(null);
+            setForm(emptyForm);
+        }
+    }
+    async function confirmCancellation(absence) {
+        const saved = await mutate(absence.id, async () => {
+            const next = await api.cancelReviewerAbsence(workspace, absence.id, absence.revision);
+            setAbsences((items) => items.map((item) => item.id === next.id ? next : item));
+        });
+        if (saved)
+            setCancelling(null);
+    }
+    function beginEdit(absence) {
+        setEditing(absence);
+        setCancelling(null);
+        setError(null);
+        setForm({
+            externalActorId: absence.externalActorId,
+            startLocal: toLocalDateTime(absence.startAt, settings.timezone),
+            endLocal: toLocalDateTime(absence.endAt, settings.timezone),
+            startUtcOffset: toUtcOffset(absence.startAt, settings.timezone),
+            endUtcOffset: toUtcOffset(absence.endAt, settings.timezone),
+        });
+    }
+    return (_jsxs("section", { className: "availability-grid", id: "reviewer-availability", children: [_jsxs("div", { className: "availability-intro", children: [_jsx("p", { className: "eyebrow", children: "Reviewer routing" }), _jsx("h2", { id: "availability-heading", children: "Reviewer availability" }), _jsx("p", { children: "Schedule individual reviewer absences in the workspace timezone." })] }), error ? _jsx("p", { role: "alert", className: "notice notice--danger", children: error }) : null, authorization.canManageReviewerAvailability ? (_jsxs(_Fragment, { children: [_jsxs("form", { className: "availability-form", onSubmit: (event) => void submitTimezone(event), children: [_jsx("label", { htmlFor: "availability-timezone", children: "Workspace timezone" }), _jsx("input", { id: "availability-timezone", value: timezone, onChange: (event) => setTimezone(event.target.value), disabled: busy || editing !== null, required: true }), _jsx("small", { children: editing ? "Finish or discard the active edit before changing timezone." : "Use an IANA timezone, for example Europe/Bratislava." }), _jsx("button", { type: "submit", disabled: busy || editing !== null, children: pending === "timezone" ? "Saving…" : "Save timezone" })] }), _jsxs("form", { className: "availability-form", onSubmit: (event) => void submitAbsence(event), children: [_jsx("h3", { children: editing ? `Edit absence for ${editing.externalActorId}` : "Record reviewer absence" }), _jsx("label", { htmlFor: "absence-actor", children: "External actor ID" }), _jsx("input", { id: "absence-actor", value: form.externalActorId, onChange: (event) => setForm({ ...form, externalActorId: event.target.value }), disabled: busy, required: true }), _jsxs("label", { htmlFor: "absence-start", children: ["Start (", settings.timezone, ")"] }), _jsx("input", { id: "absence-start", type: "datetime-local", value: form.startLocal, onChange: (event) => setForm({ ...form, startLocal: event.target.value }), disabled: busy, required: true }), _jsx("label", { htmlFor: "absence-start-offset", children: "Start UTC offset (only for ambiguous times)" }), _jsx("input", { id: "absence-start-offset", placeholder: "+02:00", value: form.startUtcOffset ?? "", onChange: (event) => setForm(withOptionalOffset(form, "startUtcOffset", event.target.value)), disabled: busy }), _jsxs("label", { htmlFor: "absence-end", children: ["End (", settings.timezone, ")"] }), _jsx("input", { id: "absence-end", type: "datetime-local", value: form.endLocal, onChange: (event) => setForm({ ...form, endLocal: event.target.value }), disabled: busy, required: true }), _jsx("label", { htmlFor: "absence-end-offset", children: "End UTC offset (only for ambiguous times)" }), _jsx("input", { id: "absence-end-offset", placeholder: "+01:00", value: form.endUtcOffset ?? "", onChange: (event) => setForm(withOptionalOffset(form, "endUtcOffset", event.target.value)), disabled: busy }), _jsxs("div", { className: "availability-form__actions", children: [_jsx("button", { type: "submit", disabled: busy, children: pending === "absence" ? "Saving…" : editing ? "Save absence" : "Add absence" }), editing ? _jsx("button", { type: "button", className: "button--quiet", disabled: busy, onClick: () => { setEditing(null); setForm(emptyForm); }, children: "Discard edit" }) : null] })] })] })) : _jsxs("p", { className: "cell-detail", children: ["Timezone: ", settings.timezone, ". Availability is read-only."] }), _jsxs("div", { className: "availability-history table-scroll", role: "region", tabIndex: 0, "aria-labelledby": "availability-history-heading", children: [_jsx("h3", { id: "availability-history-heading", children: "Absence history" }), _jsxs("table", { children: [_jsx("caption", { className: "sr-only", children: "Reviewer absences" }), _jsx("thead", { children: _jsxs("tr", { children: [_jsx("th", { scope: "col", children: "Reviewer" }), _jsx("th", { scope: "col", children: "Window" }), _jsx("th", { scope: "col", children: "Status" }), _jsx("th", { scope: "col", children: "Replacement history" }), _jsx("th", { scope: "col", children: "Actions" })] }) }), _jsx("tbody", { children: absences.length === 0 ? _jsx("tr", { children: _jsx("td", { colSpan: 5, className: "empty-cell", children: "No reviewer absences are recorded." }) }) : absences.map((absence) => {
+                                    const replacements = history.filter((item) => item.absenceId === absence.id);
+                                    const mutable = absence.status === "active" || absence.status === "upcoming";
+                                    return _jsxs("tr", { children: [_jsx("th", { scope: "row", className: "data-text", children: absence.externalActorId }), _jsxs("td", { children: [_jsx("time", { dateTime: absence.startAt, children: formatDate(absence.startAt, settings.timezone) }), _jsxs("span", { className: "cell-detail", children: ["to ", _jsx("time", { dateTime: absence.endAt, children: formatDate(absence.endAt, settings.timezone) })] })] }), _jsx("td", { children: _jsx("span", { className: `chip chip--${absence.status}`, children: capitalize(absence.status) }) }), _jsx("td", { children: replacements.length === 0 ? _jsx("span", { className: "cell-detail", children: "No replacement outcomes recorded." }) : _jsx("ul", { className: "replacement-list", children: replacements.map((item) => _jsxs("li", { children: [_jsx("span", { className: "data-text", children: item.replacementActorId ?? "No replacement" }), _jsxs("span", { className: "cell-detail", children: [item.outcome.replaceAll("_", " "), " \u00B7 ", item.reason] }), item.lastError ? _jsx("span", { className: "cell-error", children: item.lastError }) : null] }, item.id)) }) }), _jsx("td", { children: authorization.canManageReviewerAvailability && mutable ? _jsxs("div", { className: "availability-actions", children: [_jsx("button", { type: "button", className: "button--quiet", disabled: busy, onClick: () => beginEdit(absence), children: "Edit" }), cancelling === absence.id ? _jsxs(_Fragment, { children: [_jsx("span", { className: "cell-detail", children: "Cancel this absence?" }), _jsx("button", { type: "button", disabled: busy, onClick: () => void confirmCancellation(absence), children: "Confirm cancel" }), _jsx("button", { type: "button", className: "button--quiet", disabled: busy, onClick: () => setCancelling(null), children: "Keep" })] }) : _jsx("button", { type: "button", disabled: busy, onClick: () => setCancelling(absence.id), children: "Cancel" })] }) : _jsx("span", { className: "cell-detail", children: "\u2014" }) })] }, absence.id);
+                                }) })] })] })] }));
+}
+function handleError(caught, onUnauthorized, setError) {
+    const message = caught instanceof Error ? caught.message : "Could not update reviewer availability.";
+    if (typeof caught === "object" && caught !== null && "status" in caught && caught.status === 401) {
+        onUnauthorized?.(message);
+        return;
+    }
+    setError(message);
+}
+function formatDate(value, timezone) {
+    return new Intl.DateTimeFormat(undefined, { dateStyle: "medium", timeStyle: "short", timeZone: timezone }).format(new Date(value));
+}
+function toLocalDateTime(value, timezone) {
+    const fields = Object.fromEntries(new Intl.DateTimeFormat("en-CA", {
+        timeZone: timezone, year: "numeric", month: "2-digit", day: "2-digit", hour: "2-digit", minute: "2-digit", hourCycle: "h23",
+    }).formatToParts(new Date(value)).filter((part) => part.type !== "literal").map((part) => [part.type, part.value]));
+    return `${fields.year}-${fields.month}-${fields.day}T${fields.hour}:${fields.minute}`;
+}
+function toUtcOffset(value, timezone) {
+    const instant = new Date(value);
+    const parts = new Intl.DateTimeFormat("en-CA", {
+        timeZone: timezone, year: "numeric", month: "2-digit", day: "2-digit", hour: "2-digit", minute: "2-digit", hourCycle: "h23",
+    }).formatToParts(instant);
+    const read = (type) => Number(parts.find((part) => part.type === type)?.value);
+    const localAsUtc = Date.UTC(read("year"), read("month") - 1, read("day"), read("hour"), read("minute"));
+    const offsetMinutes = Math.round((localAsUtc - instant.getTime()) / 60_000);
+    const sign = offsetMinutes < 0 ? "-" : "+";
+    const absolute = Math.abs(offsetMinutes);
+    return `${sign}${String(Math.floor(absolute / 60)).padStart(2, "0")}:${String(absolute % 60).padStart(2, "0")}`;
+}
+function capitalize(value) {
+    return value.charAt(0).toUpperCase() + value.slice(1);
+}
+function withOptionalOffset(form, field, value) {
+    const next = { ...form };
+    if (value === "")
+        delete next[field];
+    else
+        next[field] = value;
+    return next;
+}

package/dist/index.d.ts

@@ -0,0 +1,4 @@
+export { OperationsDashboard, type OperationsDashboardProps, } from "./components/OperationsDashboard.js";
+export { EffectiveConfiguration, type EffectiveConfigurationProps, } from "./components/EffectiveConfiguration.js";
+export { ReviewerAvailability, type ReviewerAvailabilityProps, } from "./components/ReviewerAvailability.js";
+export type { ActionFailureOverview, AvailabilitySettingsOverview, AuthorizationCapabilities, DecisionOverview, EffectiveConfigurationOverview, EffectiveConfigurationValue, JobFailureOverview, NavigationHost, NavigationTarget, OperationsApiClient, OperationsOverview, ProviderLink, ProviderStatusOverview, RepositoryContext, RepositoryOverview, RiskBreakdown, ReviewerAbsenceMutation, ReviewerAbsenceOverview, ReviewerReplacementOverview, WorkspaceContext, } from "./api.js";

package/dist/index.js

@@ -0,0 +1,3 @@
+export { OperationsDashboard, } from "./components/OperationsDashboard.js";
+export { EffectiveConfiguration, } from "./components/EffectiveConfiguration.js";
+export { ReviewerAvailability, } from "./components/ReviewerAvailability.js";

package/dist/styles.css

@@ -0,0 +1,146 @@
+.operations-state {
+  width: min(100%, 440px);
+  border: 1px solid var(--rule);
+  border-radius: 14px;
+  padding: 32px;
+  background: var(--surface);
+  box-shadow: 0 12px 30px #0b395914;
+}
+
+.operations-dashboard { display: grid; gap: 18px; scroll-margin-top: 20px; }
+.operations-heading { display: flex; align-items: end; justify-content: space-between; gap: 28px; margin-bottom: 2px; }
+.operations-heading .lede { margin-top: 7px; }
+.operations-actions { display: flex; align-items: center; gap: 12px; }
+.operations-actions--state { justify-content: flex-end; margin-bottom: 22px; }
+.button-link {
+  display: inline-block;
+  border: 1px solid var(--navy);
+  border-radius: 7px;
+  padding: 10px 16px;
+  color: white;
+  background: var(--navy);
+  font-size: .78rem;
+  font-weight: 700;
+  text-decoration: none;
+}
+.button-link--quiet { border-color: var(--rule); color: var(--navy); background: white; }
+
+.status-ledger {
+  display: grid;
+  grid-template-columns: repeat(3, minmax(0, 1fr));
+  gap: 12px;
+  scroll-margin-top: 20px;
+}
+.status-node {
+  position: relative;
+  display: grid;
+  gap: 5px;
+  min-width: 0;
+  border: 1px solid var(--rule);
+  border-radius: 8px;
+  padding: 15px 16px 16px;
+  background: var(--surface);
+}
+.status-node::after { position: absolute; top: 16px; right: 16px; width: 7px; height: 7px; border-radius: 50%; background: #a8bac4; content: ""; }
+.status-node--healthy::after { background: var(--teal); box-shadow: 0 0 0 4px #08b7b616; }
+.status-node--failed::after { background: var(--caution); box-shadow: 0 0 0 4px #c6494915; }
+.status-node strong { overflow: hidden; padding-right: 18px; color: var(--navy); font-family: "Geist Mono", ui-monospace, monospace; font-size: .85rem; text-overflow: ellipsis; white-space: nowrap; }
+.status-node small { overflow: hidden; color: var(--muted); font-size: .69rem; text-overflow: ellipsis; white-space: nowrap; }
+
+.data-section {
+  scroll-margin-top: 20px;
+  overflow: hidden;
+  border: 1px solid var(--rule);
+  border-radius: 8px;
+  background: var(--surface);
+}
+.data-section--danger { border-color: #ecdada; }
+.section-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 56px; border-bottom: 1px solid var(--rule); padding: 12px 18px; }
+.count { min-width: 30px; border-radius: 999px; padding: 4px 8px; color: var(--teal-dark); background: var(--surface-soft); font-family: "Geist Mono", ui-monospace, monospace; font-size: .66rem; font-weight: 700; text-align: center; }
+.table-scroll { max-width: 100%; overflow-x: auto; }
+.table-scroll:focus-visible, .button-link:focus-visible { outline: 3px solid var(--teal); outline-offset: -3px; }
+.button-link:focus-visible { outline-offset: 3px; }
+table { width: 100%; border-collapse: collapse; font-size: .77rem; text-align: left; }
+th, td { border-bottom: 1px solid var(--rule); padding: 13px 18px; vertical-align: top; }
+thead th { color: var(--muted); background: #f8fbfb; font-size: .61rem; font-weight: 750; letter-spacing: .07em; text-transform: uppercase; white-space: nowrap; }
+tbody tr:last-child > * { border-bottom: 0; }
+tbody tr:hover > * { background: #fbfdfd; }
+tbody th { font-weight: 650; }
+a { color: var(--teal-dark); text-underline-offset: 2px; }
+.data-text, time, .chip { font-family: "Geist Mono", ui-monospace, monospace; }
+.cell-detail, .cell-error { display: block; margin-top: 5px; color: var(--muted); font-size: .67rem; line-height: 1.4; }
+.cell-error { max-width: 32ch; color: var(--caution); }
+.risk-breakdown { margin-top: 6px; color: var(--ink); font-size: .68rem; }
+.risk-breakdown summary { cursor: pointer; color: var(--teal-dark); font-weight: 700; }
+.risk-breakdown__meta { margin: 7px 0; color: var(--muted); }
+.risk-breakdown ul { display: grid; gap: 7px; min-width: 29ch; margin: 0; padding: 0; list-style: none; }
+.risk-breakdown li { display: grid; grid-template-columns: 3.5ch 1fr; gap: 8px; }
+.risk-breakdown__score { color: var(--teal-dark); font-weight: 700; }
+.chip { display: inline-block; border: 1px solid var(--rule); border-radius: 999px; padding: 3px 7px; color: var(--muted); background: #f8fbfb; font-size: .61rem; font-weight: 700; white-space: nowrap; }
+.chip--valid, .chip--succeeded, .chip--enforce, .chip--repository, .chip--active, .chip--upcoming {
+  border-color: #b8e7e3;
+  color: var(--teal-dark);
+  background: #effbfa;
+}
+.chip--invalid, .chip--failed, .chip--cancelled { border-color: #eccaca; color: var(--caution); background: #fff6f6; }
+.id-cell { max-width: 15ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.empty-cell { height: 76px; color: var(--muted); text-align: center; vertical-align: middle; }
+.failure-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
+
+.routing-recovery-form {
+  display: grid;
+  grid-template-columns: minmax(15rem, 1fr) minmax(18rem, 1.8fr) auto;
+  align-items: end;
+  gap: 12px;
+  border-bottom: 1px solid var(--rule);
+  padding: 16px 18px;
+  background: var(--surface-soft);
+}
+.routing-recovery-form label { display: block; color: var(--navy); font-size: .75rem; font-weight: 700; }
+.routing-recovery-form input, .availability-form input {
+  width: 100%;
+  border: 1px solid #b9d4dd;
+  border-radius: 7px;
+  padding: 9px 10px;
+  color: var(--ink);
+  background: white;
+}
+.routing-notice { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0; border-right: 0; border-left: 0; border-radius: 0; }
+.button--compact { padding: 7px 10px; font-size: .67rem; white-space: nowrap; }
+
+.availability-grid {
+  display: grid;
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  gap: 18px;
+  margin-top: 18px;
+  scroll-margin-top: 20px;
+  border: 1px solid var(--rule);
+  border-radius: 8px;
+  padding: 20px;
+  background: var(--surface);
+}
+.availability-intro, .availability-history, .availability-grid > .notice { grid-column: 1 / -1; }
+.availability-intro { border-bottom: 1px solid var(--rule); padding-bottom: 15px; }
+.availability-intro p:last-child { margin: 7px 0 0; color: var(--muted); font-size: .76rem; }
+.availability-form { display: grid; align-content: start; gap: 8px; border: 1px solid var(--rule); border-radius: 8px; padding: 16px; background: #fbfdfd; }
+.availability-form label { margin-top: 8px; color: var(--ink); font-size: .72rem; font-weight: 700; }
+.availability-form small { color: var(--muted); font-size: .67rem; line-height: 1.4; }
+.availability-form__actions, .availability-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 8px; }
+.availability-history { border: 1px solid var(--rule); border-radius: 8px; }
+.availability-history h3 { margin: 0; border-bottom: 1px solid var(--rule); padding: 14px 16px; }
+.replacement-list { display: grid; gap: 8px; margin: 0; padding-left: 18px; }
+
+.effective-configuration { margin-top: 18px; }
+.configuration-provenance { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; margin: 0; border-bottom: 1px solid var(--rule); background: var(--rule); }
+.configuration-provenance div { min-width: 0; padding: 13px 16px; background: var(--surface); }
+.configuration-provenance dt { margin-bottom: 5px; color: var(--muted); font-size: .62rem; font-weight: 750; letter-spacing: .06em; text-transform: uppercase; }
+.configuration-provenance dd { margin: 0; overflow-wrap: anywhere; font-family: "Geist Mono", ui-monospace, monospace; font-size: .72rem; }
+.sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0; white-space: nowrap; }
+
+@media (max-width: 760px) {
+  .operations-heading, .operations-actions { align-items: flex-start; flex-direction: column; gap: 14px; }
+  .status-ledger, .failure-grid, .availability-grid, .routing-recovery-form, .configuration-provenance { grid-template-columns: 1fr; }
+  .availability-grid { padding: 15px; }
+  table { min-width: 680px; }
+  .failure-grid table { min-width: 520px; }
+}

package/package.json

@@ -0,0 +1,46 @@
+{
+  "name": "@triagepilot/ui",
+  "version": "1.1.0",
+  "license": "FSL-1.1-Apache-2.0",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/TriagePilot/triage-pilot.git",
+    "directory": "packages/ui"
+  },
+  "type": "module",
+  "files": [
+    "dist",
+    "LICENSE"
+  ],
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    },
+    "./styles.css": "./dist/styles.css"
+  },
+  "dependencies": {
+    "@triagepilot/contracts": "1.1.0"
+  },
+  "peerDependencies": {
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1"
+  },
+  "devDependencies": {
+    "@types/react": "^18.3.18",
+    "@types/react-dom": "^18.3.5",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "publishedAt": "2026-09-22T09:41:47.000Z",
+  "futureLicenseEffectiveAt": "2028-09-22T09:41:47.000Z",
+  "scripts": {
+    "build": "rm -rf dist && tsc -p tsconfig.json && node ../../scripts/prepare-package.mjs --package . --asset src/styles.css=dist/styles.css",
+    "check": "tsc -p tsconfig.json --noEmit"
+  }
+}