@rightkit/agent-ui-settings 0.0.0-stage → 0.1.0

package/dist/components/settings/marketplace/McpDiscoverPanel.js

@@ -0,0 +1,66 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { EmptyState } from "@rightkit/react-shell/react";
+import { useMemo, useState } from "react";
+import Icon from "@rightkit/agent-ui-core/components/Icon";
+function transport(server) {
+    return server.remotes.length > 0 ? "http" : "stdio";
+}
+function transportLabel(server) {
+    if (server.remotes.length > 0)
+        return "HTTP";
+    return server.packages[0]?.registryType || "stdio";
+}
+function codexKey(name) {
+    return name.replace(/[^a-zA-Z0-9_-]/g, "-").replace(/-{2,}/g, "-").replace(/^-|-$/g, "");
+}
+function isInstalled(server, installedServers, agent) {
+    const rows = installedServers.filter((item) => (item.agent ?? "claude") === agent);
+    if (server.remotes.length > 0) {
+        return rows.some((item) => item.url === server.remotes[0]?.url);
+    }
+    const identifier = server.packages[0]?.identifier;
+    return identifier
+        ? rows.some((item) => item.args?.some((arg) => arg === identifier || arg.includes(identifier)))
+        : false;
+}
+function RegistryStatus({ health, onRefresh, refreshing }) {
+    const tone = health === null || health === undefined ? "bg-text-3/40" : health.available ? "bg-accent-2" : "bg-danger";
+    return (_jsxs("div", { className: "flex shrink-0 items-center gap-1", children: [_jsxs("span", { className: "flex items-center gap-1.5 text-[10px] text-text-3", title: health?.reason ?? "", children: [_jsx("span", { className: `inline-block h-2 w-2 rounded-full ${tone}`, "aria-hidden": "true" }), "registry"] }), onRefresh ? (_jsx("button", { type: "button", className: "rounded p-1 text-text-3 hover:bg-panel hover:text-text disabled:opacity-40", title: "Refresh registry", "aria-label": "Refresh registry", disabled: refreshing, onClick: onRefresh, children: _jsx(Icon, { name: "refresh", size: 13 }) })) : null] }));
+}
+export default function McpDiscoverPanel({ projectCwd = "", query, results, popularResults = [], selectedServer = null, installedServers = [], health = null, searching = false, refreshing = false, operationLoading = null, installAgent = "claude", installScope = "user", onQueryChange, onAgentChange, onScopeChange, onRefresh, onSelect, onClearSelection, onInstall, onImportClaudeDesktop, onImportJson, }) {
+    const [environment, setEnvironment] = useState({});
+    const [headers, setHeaders] = useState({});
+    const displayResults = query.trim().length >= 2 ? results : popularResults;
+    const selectedInstalled = selectedServer
+        ? isInstalled(selectedServer, installedServers, installAgent)
+        : false;
+    const canUseProjectScope = Boolean(projectCwd) && installAgent !== "codex";
+    const selectedPackage = selectedServer?.packages[0];
+    const selectedRemote = selectedServer?.remotes[0];
+    const environmentVariables = useMemo(() => selectedPackage?.environmentVariables ?? [], [selectedPackage]);
+    const headerDefinitions = useMemo(() => selectedRemote?.headers ?? [], [selectedRemote]);
+    function selectServer(server) {
+        setEnvironment(Object.fromEntries((server.packages[0]?.environmentVariables ?? []).map((item) => [item.name, ""])));
+        setHeaders(Object.fromEntries((server.remotes[0]?.headers ?? []).map((item) => [item.name, item.value ?? ""])));
+        onSelect(server);
+    }
+    function install(server) {
+        onInstall(server, {
+            agent: installAgent,
+            scope: installScope,
+            cwd: projectCwd || undefined,
+            environment,
+            headers,
+        });
+    }
+    return (_jsxs("section", { className: "flex min-h-0 flex-col gap-4", children: [_jsxs("div", { className: "flex flex-wrap items-center gap-3", children: [_jsx(RegistryStatus, { health: health, onRefresh: onRefresh, refreshing: refreshing }), _jsxs("label", { className: "flex min-w-[220px] flex-1 items-center gap-2 rounded-lg border border-line bg-panel px-3 text-text-3", children: [_jsx(Icon, { name: "search", size: 13 }), _jsx("input", { type: "search", "aria-label": "Search MCP registry", className: "h-9 min-w-0 flex-1 border-0 bg-transparent text-[13px] text-text outline-none placeholder:text-text-3", placeholder: "Search MCP registry", value: query, onChange: (event) => onQueryChange(event.target.value) })] }), _jsx("div", { className: "inline-flex rounded-lg border border-line bg-panel p-1", children: ["claude", "codex"].map((agent) => (_jsx("button", { type: "button", className: `rounded-md px-3 py-1.5 text-[12px] ${installAgent === agent ? "bg-panel-2 text-text" : "text-text-3 hover:text-text"}`, "aria-pressed": installAgent === agent, onClick: () => onAgentChange?.(agent), children: agent === "claude" ? "Claude" : "Codex" }, agent))) }), _jsx("div", { className: "inline-flex rounded-lg border border-line bg-panel p-1", children: ["user", "project", "local"].map((scope) => (_jsx("button", { type: "button", className: `rounded-md px-3 py-1.5 text-[12px] capitalize ${installScope === scope ? "bg-panel-2 text-text" : "text-text-3 hover:text-text"}`, disabled: (scope !== "user" && !canUseProjectScope) || (scope === "local" && installAgent === "codex"), "aria-pressed": installScope === scope, onClick: () => onScopeChange?.(scope), children: scope }, scope))) })] }), _jsx("div", { className: "flex flex-wrap gap-2", children: ["filesystem", "database", "github", "api", "web", "docker"].map((filter) => (_jsx("button", { type: "button", className: `rounded-full border px-3 py-1 text-[11px] ${query === filter ? "border-accent/50 bg-accent/10 text-text" : "border-line text-text-3 hover:border-line-2 hover:text-text"}`, onClick: () => onQueryChange(filter), children: filter }, filter))) }), onImportClaudeDesktop || onImportJson ? (_jsxs("div", { className: "flex flex-wrap items-center gap-2 rounded-lg border border-line bg-panel px-3 py-2", children: [_jsx("span", { className: "mr-auto text-[12px] text-text-2", children: "Import existing MCP configuration" }), onImportClaudeDesktop ? (_jsxs("button", { type: "button", className: "inline-flex h-8 items-center gap-1.5 rounded-lg border border-line px-3 text-[12px] text-text-2 hover:bg-panel-2", onClick: onImportClaudeDesktop, children: [_jsx(Icon, { name: "download", size: 13 }), " Claude Desktop"] })) : null, onImportJson ? (_jsxs("label", { className: "inline-flex h-8 cursor-pointer items-center gap-1.5 rounded-lg border border-line px-3 text-[12px] text-text-2 hover:bg-panel-2", children: [_jsx(Icon, { name: "document", size: 13 }), " JSON", _jsx("input", { type: "file", accept: ".json,application/json", className: "sr-only", onChange: (event) => {
+                                    const file = event.currentTarget.files?.[0];
+                                    if (file)
+                                        void onImportJson(file);
+                                    event.currentTarget.value = "";
+                                } })] })) : null] })) : null, searching ? (_jsxs("div", { className: "flex items-center justify-center gap-2 py-10 text-[12px] text-text-3", role: "status", children: [_jsx(Icon, { name: "refresh", size: 14 }), " Searching registry\u2026"] })) : displayResults.length === 0 ? (_jsx(EmptyState, { icon: _jsx(Icon, { name: "server", size: 18 }), title: query.trim().length >= 2 ? "No MCP servers found." : "No popular MCP servers available.", action: onRefresh && query.trim().length < 2 ? _jsx("button", { type: "button", className: "rounded-lg border border-line px-3 py-1.5 text-[12px] text-text-2 hover:bg-panel", onClick: onRefresh, children: "Retry" }) : undefined, children: query.trim().length >= 2 ? "Try a broader search term." : "Refresh the registry or search by capability." })) : (_jsxs("div", { className: "flex min-h-[300px] min-w-0 gap-3", children: [_jsxs("div", { className: "w-[280px] shrink-0 space-y-2 overflow-y-auto pr-1", children: [_jsx("div", { className: "px-1 text-[11px] text-text-3", children: query.trim().length >= 2 ? `${results.length} results` : "Popular servers" }), displayResults.map((server) => {
+                                const installed = isInstalled(server, installedServers, installAgent);
+                                const pending = operationLoading === server.name;
+                                return (_jsx("article", { className: `rounded-lg border px-3 py-2 ${selectedServer?.name === server.name ? "border-accent/50 bg-accent/5" : "border-line bg-panel hover:bg-panel-2"}`, children: _jsxs("div", { className: "flex items-start gap-2", children: [_jsxs("button", { type: "button", className: "min-w-0 flex-1 text-left", onClick: () => selectServer(server), children: [_jsx("strong", { className: "block truncate text-[13px] font-semibold text-text", children: server.title || server.name }), _jsxs("span", { className: "mt-1 block text-[11px] text-text-3", children: [server.version ? `v${server.version} · ` : "", transportLabel(server)] })] }), _jsx("button", { type: "button", className: `shrink-0 rounded-md px-2 py-1 text-[11px] font-semibold ${installed ? "bg-accent-2/10 text-accent-2" : "bg-accent text-on-accent"}`, disabled: installed || pending, onClick: () => install(server), children: pending ? "…" : installed ? "Installed" : "Install" })] }) }, `${server.name}:${server.version ?? ""}`));
+                            })] }), _jsx("div", { className: "min-w-0 flex-1 overflow-y-auto", children: selectedServer ? (_jsxs("div", { className: "space-y-4 rounded-lg border border-line bg-panel p-4", children: [_jsxs("div", { className: "flex items-start gap-3", children: [_jsxs("div", { className: "min-w-0 flex-1", children: [_jsx("h3", { className: "truncate text-[14px] font-semibold text-text", children: selectedServer.title || selectedServer.name }), _jsxs("div", { className: "mt-1 flex flex-wrap gap-2 text-[11px] text-text-3", children: [selectedServer.version ? _jsxs("span", { children: ["v", selectedServer.version] }) : null, _jsx("span", { children: transportLabel(selectedServer) }), selectedServer.repository?.url ? _jsx("a", { className: "underline hover:text-text", href: selectedServer.repository.url, target: "_blank", rel: "noreferrer", children: "Repository" }) : null] }), _jsx("p", { className: "mt-2 text-[12px] leading-5 text-text-2", children: selectedServer.description || "No description provided." })] }), _jsx("button", { type: "button", "aria-label": "Close MCP server preview", className: "text-text-3 hover:text-text", onClick: () => onClearSelection?.(), children: _jsx(Icon, { name: "close", size: 14 }) })] }), selectedPackage ? _jsxs("div", { className: "border-t border-line pt-3", children: [_jsx("h4", { className: "mb-2 text-[11px] uppercase text-text-3", children: "Package" }), _jsxs("div", { className: "rounded-lg bg-bg px-3 py-2 text-[12px] text-text", children: [_jsx("code", { children: selectedPackage.identifier }), _jsx("span", { className: "ml-2 text-text-3", children: selectedPackage.registryType })] })] }) : null, selectedRemote ? _jsxs("div", { className: "border-t border-line pt-3", children: [_jsx("h4", { className: "mb-2 text-[11px] uppercase text-text-3", children: "Remote endpoint" }), _jsxs("div", { className: "rounded-lg bg-bg px-3 py-2 text-[12px] text-text", children: [_jsx("code", { className: "break-all", children: selectedRemote.url }), _jsx("span", { className: "ml-2 text-text-3", children: selectedRemote.type })] })] }) : null, environmentVariables.length > 0 ? _jsxs("div", { className: "space-y-2 border-t border-line pt-3", children: [_jsx("h4", { className: "text-[11px] uppercase text-text-3", children: "Environment variables" }), environmentVariables.map((item) => _jsxs("label", { className: "flex items-center gap-2 text-[11px] text-text-2", children: [_jsxs("span", { className: "w-36 shrink-0 truncate font-mono", title: item.description, children: [item.name, item.isRequired ? " *" : ""] }), _jsx("input", { "aria-label": `${item.name} environment variable`, type: item.isSecret ? "password" : "text", className: "h-8 min-w-0 flex-1 rounded-lg border border-line bg-bg px-2 text-[12px] text-text outline-none", value: environment[item.name] ?? "", onChange: (event) => setEnvironment((current) => ({ ...current, [item.name]: event.target.value })), placeholder: item.description })] }, item.name))] }) : null, headerDefinitions.length > 0 ? _jsxs("div", { className: "space-y-2 border-t border-line pt-3", children: [_jsx("h4", { className: "text-[11px] uppercase text-text-3", children: "HTTP headers" }), headerDefinitions.map((item) => _jsxs("label", { className: "flex items-center gap-2 text-[11px] text-text-2", children: [_jsxs("span", { className: "w-36 shrink-0 truncate font-mono", title: item.description, children: [item.name, item.isRequired ? " *" : ""] }), _jsx("input", { "aria-label": `${item.name} HTTP header`, type: item.isSecret ? "password" : "text", className: "h-8 min-w-0 flex-1 rounded-lg border border-line bg-bg px-2 text-[12px] text-text outline-none", value: headers[item.name] ?? "", onChange: (event) => setHeaders((current) => ({ ...current, [item.name]: event.target.value })), placeholder: item.description })] }, item.name))] }) : null, _jsxs("div", { className: "flex items-center justify-between gap-3 border-t border-line pt-3", children: [_jsxs("span", { className: "text-[11px] text-text-3", children: [transport(selectedServer) === "http" ? "HTTP" : `${installAgent === "codex" ? codexKey(selectedServer.name) : selectedServer.name} · ${installScope}`, " "] }), _jsxs("button", { type: "button", className: `inline-flex h-9 items-center gap-2 rounded-lg px-4 text-[12px] font-semibold ${selectedInstalled ? "border border-line bg-transparent text-text-3" : "bg-accent text-on-accent hover:opacity-90"}`, disabled: selectedInstalled || operationLoading === selectedServer.name, onClick: () => install(selectedServer), children: [_jsx(Icon, { name: "download", size: 13 }), " ", operationLoading === selectedServer.name ? "Installing…" : selectedInstalled ? "Installed" : "Install server"] })] })] })) : _jsx(EmptyState, { icon: _jsx(Icon, { name: "server", size: 18 }), title: "Select an MCP server.", children: "Choose a registry result to inspect its transport and installation settings." }) })] }))] }));
+}

package/dist/components/settings/marketplace/SkillMarketplace.d.ts

@@ -0,0 +1,22 @@
+import { type CommunitySkillDetail, type CommunitySkillResult, type RegistryHealthProjection } from "@rightkit/agent-ui-core/lib/daemon/marketplaces";
+export type SkillMarketplaceScope = "user" | "project";
+export interface SkillMarketplaceProps {
+    projectCwd?: string;
+    results: CommunitySkillResult[];
+    popularResults?: CommunitySkillResult[];
+    selectedSkill?: CommunitySkillDetail | null;
+    installedSlugs?: string[] | Set<string>;
+    health?: RegistryHealthProjection | null;
+    searching?: boolean;
+    refreshing?: boolean;
+    detailLoading?: boolean;
+    detailError?: string | null;
+    operationLoading?: string | null;
+    onSearch: (query: string) => void;
+    onRefresh?: () => void;
+    onSelect: (skill: CommunitySkillResult) => void;
+    onClearSelection?: () => void;
+    onInstall: (skill: CommunitySkillResult, scope: SkillMarketplaceScope, cwd?: string) => void | Promise<void>;
+    onScopeChange?: (scope: SkillMarketplaceScope) => void;
+}
+export default function SkillMarketplace({ projectCwd, results, popularResults, selectedSkill, installedSlugs, health, searching, refreshing, detailLoading, detailError, operationLoading, onSearch, onRefresh, onSelect, onClearSelection, onInstall, onScopeChange, }: SkillMarketplaceProps): import("react").JSX.Element;

package/dist/components/settings/marketplace/SkillMarketplace.js

@@ -0,0 +1,51 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { EmptyState } from "@rightkit/react-shell/react";
+import { useEffect, useMemo, useState } from "react";
+import Icon from "@rightkit/agent-ui-core/components/Icon";
+import { toMarketplaceSkillSlug, } from "@rightkit/agent-ui-core/lib/daemon/marketplaces";
+function installCount(value) {
+    if (value < 1_000)
+        return String(value);
+    if (value < 1_000_000)
+        return `${(value / 1_000).toFixed(value >= 10_000 ? 0 : 1)}k`;
+    return `${(value / 1_000_000).toFixed(value >= 10_000_000 ? 0 : 1)}m`;
+}
+function hasInstalledSkill(installedSlugs, skillId) {
+    const slug = toMarketplaceSkillSlug(skillId);
+    if (!slug)
+        return false;
+    return installedSlugs instanceof Set ? installedSlugs.has(slug) : installedSlugs.includes(slug);
+}
+function RegistryStatus({ health, refreshing, onRefresh }) {
+    const tone = health === null || health === undefined ? "bg-text-3/40" : health.available ? "bg-accent-2" : "bg-danger";
+    return (_jsxs("div", { className: "flex shrink-0 items-center gap-1", children: [_jsxs("span", { className: "flex items-center gap-1.5 text-[10px] text-text-3", title: health?.reason ?? "", children: [_jsx("span", { className: `inline-block h-2 w-2 rounded-full ${tone}`, "aria-hidden": "true" }), "skills marketplace"] }), onRefresh ? _jsx("button", { type: "button", className: "rounded p-1 text-text-3 hover:bg-panel hover:text-text disabled:opacity-40", "aria-label": "Refresh skills marketplace", title: "Refresh skills marketplace", disabled: refreshing, onClick: onRefresh, children: _jsx(Icon, { name: "refresh", size: 13 }) }) : null] }));
+}
+export default function SkillMarketplace({ projectCwd = "", results, popularResults = [], selectedSkill = null, installedSlugs = [], health = null, searching = false, refreshing = false, detailLoading = false, detailError = null, operationLoading = null, onSearch, onRefresh, onSelect, onClearSelection, onInstall, onScopeChange, }) {
+    const [query, setQuery] = useState("");
+    const [scope, setScope] = useState("user");
+    const displayResults = query.trim().length >= 2 ? results : popularResults;
+    const selectedResult = selectedSkill
+        ? displayResults.find((skill) => skill.id === selectedSkill.id) ?? results.find((skill) => skill.id === selectedSkill.id)
+        : null;
+    const selectedIsInstalled = selectedResult ? hasInstalledSkill(installedSlugs, selectedResult.skillId) : false;
+    useEffect(() => {
+        const normalized = query.trim();
+        const timer = window.setTimeout(() => onSearch(normalized.length >= 2 ? normalized : ""), normalized.length >= 2 ? 300 : 0);
+        return () => window.clearTimeout(timer);
+    }, [onSearch, query]);
+    const quickFilters = useMemo(() => ["react", "python", "security", "testing", "devops", "best practices"], []);
+    function changeScope(next) {
+        setScope(next);
+        onScopeChange?.(next);
+    }
+    function install(skill) {
+        if (toMarketplaceSkillSlug(skill.skillId))
+            onInstall(skill, scope, projectCwd || undefined);
+    }
+    return (_jsxs("section", { className: "flex min-h-0 flex-col gap-4", children: [_jsxs("div", { className: "flex flex-wrap items-center gap-3", children: [_jsx(RegistryStatus, { health: health, refreshing: refreshing, onRefresh: onRefresh }), _jsxs("label", { className: "flex min-w-[220px] flex-1 items-center gap-2 rounded-lg border border-line bg-panel px-3 text-text-3", children: [_jsx(Icon, { name: "search", size: 13 }), _jsx("input", { type: "search", "aria-label": "Search community skills", className: "h-9 min-w-0 flex-1 border-0 bg-transparent text-[13px] text-text outline-none placeholder:text-text-3", placeholder: "Search community skills", value: query, onChange: (event) => setQuery(event.target.value) })] }), _jsx("div", { className: "inline-flex rounded-lg border border-line bg-panel p-1", children: ["user", "project"].map((nextScope) => (_jsx("button", { type: "button", className: `rounded-md px-3 py-1.5 text-[12px] capitalize ${scope === nextScope ? "bg-panel-2 text-text" : "text-text-3 hover:text-text"}`, disabled: nextScope === "project" && !projectCwd, "aria-pressed": scope === nextScope, onClick: () => changeScope(nextScope), children: nextScope }, nextScope))) })] }), _jsx("div", { className: "flex flex-wrap gap-2", children: quickFilters.map((filter) => _jsx("button", { type: "button", className: `rounded-full border px-3 py-1 text-[11px] ${query === filter ? "border-accent/50 bg-accent/10 text-text" : "border-line text-text-3 hover:border-line-2 hover:text-text"}`, onClick: () => setQuery(filter), children: filter }, filter)) }), searching ? (_jsxs("div", { className: "flex items-center justify-center gap-2 py-10 text-[12px] text-text-3", role: "status", children: [_jsx(Icon, { name: "refresh", size: 14 }), " Searching skills marketplace\u2026"] })) : displayResults.length === 0 ? (_jsx(EmptyState, { icon: _jsx(Icon, { name: "skill", size: 18 }), title: query.trim().length >= 2 ? "No community skills found." : "No popular skills available.", action: onRefresh && query.trim().length < 2 ? _jsx("button", { type: "button", className: "rounded-lg border border-line px-3 py-1.5 text-[12px] text-text-2 hover:bg-panel", onClick: onRefresh, children: "Retry" }) : undefined, children: query.trim().length >= 2 ? "Try a broader search term." : "Refresh the marketplace or search by capability." })) : (_jsxs("div", { className: "flex min-h-[300px] min-w-0 gap-3", children: [_jsxs("div", { className: "w-[280px] shrink-0 space-y-2 overflow-y-auto pr-1", children: [_jsx("div", { className: "px-1 text-[11px] text-text-3", children: query.trim().length >= 2 ? `${results.length} results` : "Popular skills" }), displayResults.map((skill) => {
+                                const installed = hasInstalledSkill(installedSlugs, skill.skillId);
+                                const valid = toMarketplaceSkillSlug(skill.skillId) !== null;
+                                const pending = operationLoading === skill.id;
+                                return (_jsx("article", { className: `rounded-lg border px-3 py-2 ${selectedSkill?.id === skill.id ? "border-accent/50 bg-accent/5" : "border-line bg-panel hover:bg-panel-2"}`, children: _jsxs("div", { className: "flex items-start gap-2", children: [_jsxs("button", { type: "button", className: "min-w-0 flex-1 text-left", onClick: () => onSelect(skill), children: [_jsx("strong", { className: "block truncate text-[13px] font-semibold text-text", children: skill.name }), _jsxs("span", { className: "mt-1 block truncate text-[11px] text-text-3", children: [skill.installs > 0 ? `${installCount(skill.installs)} installs · ` : "", skill.source] })] }), _jsx("button", { type: "button", className: `shrink-0 rounded-md px-2 py-1 text-[11px] font-semibold ${installed ? "bg-accent-2/10 text-accent-2" : "bg-accent text-on-accent"}`, disabled: installed || !valid || pending, title: !valid ? "The marketplace id cannot be converted to a safe local slug." : undefined, onClick: () => install(skill), children: pending ? "…" : installed ? "Installed" : valid ? "Install" : "Unavailable" })] }) }, skill.id));
+                            })] }), _jsx("div", { className: "min-w-0 flex-1 overflow-y-auto", children: detailLoading ? (_jsxs("div", { className: "flex h-full items-center justify-center gap-2 rounded-lg border border-line bg-panel text-[12px] text-text-3", role: "status", children: [_jsx(Icon, { name: "refresh", size: 14 }), " Loading preview\u2026"] })) : detailError ? (_jsxs("div", { className: "flex h-full flex-col items-center justify-center gap-2 rounded-lg border border-danger/40 bg-danger/5 p-6 text-center", children: [_jsx(Icon, { name: "alert", size: 20 }), _jsx("strong", { className: "text-[13px] text-text", children: "Skill preview unavailable." }), _jsx("span", { className: "max-w-sm text-[12px] text-text-3", children: detailError })] })) : selectedSkill ? (_jsxs("div", { className: "space-y-4 rounded-lg border border-line bg-panel p-4", children: [_jsxs("div", { className: "flex items-start gap-3", children: [_jsxs("div", { className: "min-w-0 flex-1", children: [_jsx("h3", { className: "truncate text-[14px] font-semibold text-text", children: selectedSkill.name }), _jsxs("div", { className: "mt-1 flex flex-wrap gap-2 text-[11px] text-text-3", children: [_jsx("span", { children: selectedSkill.source }), selectedSkill.installs > 0 ? _jsxs("span", { children: [installCount(selectedSkill.installs), " installs"] }) : null, selectedSkill.githubUrl ? _jsx("a", { className: "underline hover:text-text", href: selectedSkill.githubUrl, target: "_blank", rel: "noreferrer", children: "GitHub" }) : null, selectedSkill.skillsShUrl ? _jsx("a", { className: "underline hover:text-text", href: selectedSkill.skillsShUrl, target: "_blank", rel: "noreferrer", children: "skills.sh" }) : null] }), _jsx("p", { className: "mt-2 text-[12px] leading-5 text-text-2", children: selectedSkill.description || "No description provided." })] }), _jsx("button", { type: "button", "aria-label": "Close skill preview", className: "text-text-3 hover:text-text", onClick: () => onClearSelection?.(), children: _jsx(Icon, { name: "close", size: 14 }) })] }), _jsxs("div", { className: "border-t border-line pt-3", children: [_jsx("h4", { className: "mb-2 text-[11px] uppercase text-text-3", children: "SKILL.md preview" }), selectedSkill.content ? _jsx("pre", { className: "max-h-[420px] overflow-auto whitespace-pre-wrap break-words rounded-lg bg-bg p-3 font-mono text-[12px] leading-5 text-text-2", children: selectedSkill.content }) : _jsx("p", { className: "text-[12px] italic text-text-3", children: "No content preview supplied." })] }), _jsxs("div", { className: "flex items-center justify-between gap-3 border-t border-line pt-3", children: [_jsxs("span", { className: "text-[11px] text-text-3", children: ["Install scope: ", scope] }), _jsxs("button", { type: "button", className: `inline-flex h-9 items-center gap-2 rounded-lg px-4 text-[12px] font-semibold ${selectedIsInstalled ? "border border-line bg-transparent text-text-3" : "bg-accent text-on-accent hover:opacity-90"}`, disabled: selectedIsInstalled || !selectedResult || toMarketplaceSkillSlug(selectedResult.skillId) === null || operationLoading === selectedResult?.id, onClick: () => selectedResult && install(selectedResult), children: [_jsx(Icon, { name: "download", size: 13 }), operationLoading === selectedResult?.id ? "Installing…" : selectedIsInstalled ? "Installed" : "Install skill"] })] })] })) : _jsx(EmptyState, { icon: _jsx(Icon, { name: "skill", size: 18 }), title: "Select a community skill.", children: "Choose a result to inspect its source, content, and install scope." }) })] }))] }));
+}

package/dist/components/settings/tabs/ApiKeyAccounts.d.ts

@@ -0,0 +1,9 @@
+import type { DaemonConfig } from "@rightkit/agent-ui-core/lib/types";
+/**
+ * API-key accounts (issue #34). The key goes to the daemon once, which stores it
+ * in the OS credential store. It is never read back, so the field is write-only
+ * and clears as soon as the request is sent.
+ */
+export default function ApiKeyAccounts({ config }: {
+    config?: DaemonConfig | null;
+}): import("react").JSX.Element;

package/dist/components/settings/tabs/ApiKeyAccounts.js

@@ -0,0 +1,67 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Select } from "@rightkit/react-shell/react";
+import { useCallback, useEffect, useState } from "react";
+import { addApiKeyAccount, fetchAccounts, removeApiKeyAccount, } from "@rightkit/agent-ui-core/lib/accounts/accounts";
+const PROVIDERS = [
+    { id: "claude", label: "Claude (Anthropic API key)" },
+    { id: "openai", label: "OpenAI" },
+];
+/**
+ * API-key accounts (issue #34). The key goes to the daemon once, which stores it
+ * in the OS credential store. It is never read back, so the field is write-only
+ * and clears as soon as the request is sent.
+ */
+export default function ApiKeyAccounts({ config }) {
+    const [accounts, setAccounts] = useState([]);
+    const [label, setLabel] = useState("");
+    const [provider, setProvider] = useState(PROVIDERS[0].id);
+    const [apiKey, setApiKey] = useState("");
+    const [pending, setPending] = useState(false);
+    const [error, setError] = useState(null);
+    const refresh = useCallback(async () => {
+        if (!config)
+            return;
+        try {
+            setAccounts((await fetchAccounts(config)).filter((a) => a.kind === "api_key"));
+        }
+        catch {
+            setAccounts([]);
+        }
+    }, [config]);
+    useEffect(() => {
+        void refresh();
+    }, [refresh]);
+    const submit = async (event) => {
+        event.preventDefault();
+        if (!config || pending || !label.trim() || !apiKey.trim())
+            return;
+        const key = apiKey;
+        setApiKey("");
+        setPending(true);
+        setError(null);
+        try {
+            await addApiKeyAccount(config, { label: label.trim(), provider, apiKey: key });
+            setLabel("");
+            await refresh();
+        }
+        catch (err) {
+            setError(err instanceof Error ? err.message : "Could not add the API key");
+        }
+        finally {
+            setPending(false);
+        }
+    };
+    const remove = async (account) => {
+        if (!config)
+            return;
+        setError(null);
+        try {
+            await removeApiKeyAccount(config, account.id);
+            await refresh();
+        }
+        catch (err) {
+            setError(err instanceof Error ? err.message : "Could not remove the API key");
+        }
+    };
+    return (_jsxs("section", { className: "rounded-xl border border-line bg-panel p-4", "aria-label": "API key accounts", children: [_jsx("h4", { className: "text-[13px] font-semibold text-text", children: "API key accounts" }), _jsx("p", { className: "mb-3 text-[12px] text-text-3", children: "Keys are stored in the system credential store and are never shown again." }), _jsx("div", { className: "mb-3 flex flex-col gap-2", children: accounts.map((account) => (_jsxs("article", { className: "flex items-center gap-3 rounded-lg border border-line/70 px-3 py-2", children: [_jsxs("div", { className: "min-w-0 flex-1", children: [_jsx("strong", { className: "block truncate text-[12px] text-text", children: account.label }), _jsxs("span", { className: "block truncate text-[11px] text-text-3", children: [account.provider, " \u00B7 ", account.ready ? "key stored" : "key missing"] })] }), _jsx("button", { type: "button", "aria-label": `Remove ${account.label}`, className: "rounded border border-danger/40 px-2 py-1 text-[11px] text-danger", onClick: () => void remove(account), children: "Remove" })] }, account.id))) }), _jsxs("form", { className: "flex flex-wrap items-end gap-2", onSubmit: (e) => void submit(e), children: [_jsxs("label", { className: "flex flex-col gap-1 text-[11px] text-text-3", children: ["Label", _jsx("input", { type: "text", value: label, onChange: (e) => setLabel(e.target.value), autoComplete: "off", className: "rounded border border-line bg-transparent px-2 py-1 text-[12px] text-text" })] }), _jsxs("label", { className: "flex flex-col gap-1 text-[11px] text-text-3", children: ["Provider", _jsx(Select, { value: provider, options: [...PROVIDERS.map((p) => ({ value: p.id, label: p.label }))], onChange: (value) => setProvider(value), label: "Provider", className: "rounded border border-line bg-transparent px-2 py-1 text-[12px] text-text" })] }), _jsxs("label", { className: "flex min-w-[200px] flex-1 flex-col gap-1 text-[11px] text-text-3", children: ["API key", _jsx("input", { type: "password", value: apiKey, onChange: (e) => setApiKey(e.target.value), autoComplete: "off", spellCheck: false, className: "rounded border border-line bg-transparent px-2 py-1 text-[12px] text-text" })] }), _jsx("button", { type: "submit", disabled: pending || !config || !label.trim() || !apiKey.trim(), className: "rounded-lg border border-line px-3 py-1.5 text-[12px] text-text hover:bg-panel-2 disabled:opacity-50", children: "Add API key" })] }), error ? (_jsx("p", { role: "alert", className: "mt-2 text-[11px] text-danger", children: error })) : null] }));
+}

package/dist/components/settings/tabs/AppearanceTab.d.ts

@@ -0,0 +1 @@
+export default function AppearanceTab(): import("react").JSX.Element;

package/dist/components/settings/tabs/AppearanceTab.js

@@ -0,0 +1,29 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Select, useTheme } from "@rightkit/react-shell/react";
+import { PALETTES, useThemeStore } from "@rightkit/agent-ui-core/state/themeStore";
+import AnalyticsConsentCard from "../analytics/AnalyticsConsentCard.js";
+// Dark base names per Right Suite brand.md ("Dark bases (shared): slate
+// (View/Code) · charcoal (Mail) · coffee (Heard/Voice) · espresso (Scrape)").
+// Light bases are all pale off-white/cream ramps across the suite.
+const DARK_BASE_LABEL = {
+    coderight: "graphite",
+    viewright: "slate",
+    heardright: "coffee",
+    scraperight: "espresso",
+    mailright: "charcoal",
+};
+const PALETTE_SWATCHES = [
+    { label: "Background", className: "bg-bg" },
+    { label: "Panel", className: "bg-panel" },
+    { label: "Border", className: "bg-line" },
+    { label: "Text", className: "bg-text" },
+    { label: "Accent", className: "bg-accent" },
+];
+export default function AppearanceTab() {
+    const { resolved } = useTheme();
+    const paletteId = useThemeStore((state) => state.palette);
+    const setPalette = useThemeStore((state) => state.setPalette);
+    const baseLabel = resolved === "dark" ? DARK_BASE_LABEL[paletteId] : "off-white";
+    const activePalette = PALETTES.find((p) => p.id === paletteId);
+    return (_jsxs("section", { className: "flex max-w-[720px] flex-col gap-4 p-6", children: [_jsxs("div", { className: "min-w-0", children: [_jsx("h3", { className: "text-[16px] font-bold text-text", children: "Appearance" }), _jsx("p", { className: "text-[13px] text-text-2", children: "Keep the work surface calm while preserving the Right Suite identities." })] }), _jsxs("div", { className: "grid gap-3 rounded-lg border border-line bg-panel p-4", children: [_jsxs("label", { className: "flex flex-col gap-1 text-[13px] text-text-2", children: ["Palette", _jsx(Select, { value: paletteId, options: [...PALETTES.map((palette) => ({ value: palette.id, label: palette.label }))], onChange: (value) => setPalette(value), label: "Palette", className: "h-9 rounded-lg border border-line bg-bg px-3 text-[13px] text-text outline-none" })] }), _jsxs("div", { className: "min-w-0", children: [_jsx("div", { className: "text-[13px] font-semibold text-text", children: "Base" }), _jsx("div", { className: "text-[12px] text-text-3", children: resolved === "dark" ? `Dark ${baseLabel}` : `Light ${baseLabel}` })] })] }), _jsxs("div", { className: "rounded-lg border border-line bg-panel p-4", children: [_jsx("div", { className: "flex items-center justify-between gap-3", children: _jsxs("div", { className: "min-w-0", children: [_jsx("div", { className: "text-[13px] font-semibold text-text", children: "Palette preview" }), _jsxs("div", { className: "text-[12px] text-text-3", children: [activePalette?.label ?? "Default", " \u00B7 ", resolved === "dark" ? "dark" : "light", " ", "tokens"] })] }) }), _jsx("div", { className: "mt-3 grid grid-cols-5 gap-3", children: PALETTE_SWATCHES.map((swatch) => (_jsxs("div", { className: "flex flex-col items-center gap-1.5 min-w-0", children: [_jsx("span", { className: `h-10 w-10 rounded-lg border border-line ${swatch.className}` }), _jsx("span", { className: "text-[11px] text-text-3 truncate", children: swatch.label })] }, swatch.label))) })] }), _jsx(AnalyticsConsentCard, {}), _jsxs("div", { className: "rounded-lg border border-line bg-panel p-4", children: [_jsx("div", { className: "text-[13px] font-semibold text-text", children: "Typography" }), _jsxs("div", { className: "mt-2 flex flex-col gap-2", children: [_jsxs("div", { className: "flex items-baseline justify-between gap-3", children: [_jsx("span", { className: "font-display text-[15px] text-text", children: "Tanker" }), _jsx("span", { className: "text-[12px] text-text-3", children: "Display \u00B7 panel titles" })] }), _jsxs("div", { className: "flex items-baseline justify-between gap-3", children: [_jsx("span", { className: "text-[15px] text-text", children: "General Sans" }), _jsx("span", { className: "text-[12px] text-text-3", children: "Body \u00B7 UI" })] }), _jsxs("div", { className: "flex items-baseline justify-between gap-3", children: [_jsx("span", { className: "font-mono text-[15px] text-text", children: "JetBrains Mono" }), _jsx("span", { className: "text-[12px] text-text-3", children: "Code \u00B7 paths \u00B7 ids" })] })] })] })] }));
+}

package/dist/components/settings/tabs/AppleSyncPanel.d.ts

@@ -0,0 +1,14 @@
+import { type ProBridgeStatus } from "@rightkit/agent-ui-core/state/proBridge";
+type Tone = "ok" | "warn" | "muted";
+/** One line for users. The keychain and Pro-resolution channels stay separate
+ *  in the status payload; the line reports the worst of them so one failing
+ *  channel never hides behind "On". */
+export declare function summarizeAppleSync(status: ProBridgeStatus): {
+    text: string;
+    tone: Tone;
+};
+/** Consent toggle and status for Apple device Pro continuity. Renders nothing
+ *  where iCloud Keychain does not exist (the native command reports
+ *  `supported: false` off macOS). */
+export default function AppleSyncPanel(): import("react").JSX.Element | null;
+export {};

package/dist/components/settings/tabs/AppleSyncPanel.js

@@ -0,0 +1,65 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect, useState } from "react";
+import { getProBridgeStatus, reasonOf, setProBridgeSyncEnabled, } from "@rightkit/agent-ui-core/state/proBridge";
+/** One line for users. The keychain and Pro-resolution channels stay separate
+ *  in the status payload; the line reports the worst of them so one failing
+ *  channel never hides behind "On". */
+export function summarizeAppleSync(status) {
+    const enabled = status.keychainSyncEnabled || status.proResolutionEnabled;
+    if (!enabled)
+        return { text: "Off", tone: "muted" };
+    if (status.keychainSyncEnabled && !status.keychainReady) {
+        return { text: status.keychainDetail || "Waiting on iCloud Keychain", tone: "warn" };
+    }
+    if (status.proResolutionStatus === "blocked_no_keychain") {
+        return { text: "Waiting on iCloud Keychain", tone: "warn" };
+    }
+    if (status.keychainSyncEnabled && status.proResolutionEnabled)
+        return { text: "On", tone: "ok" };
+    return { text: "Partly on", tone: "warn" };
+}
+const TONE_CLASS = {
+    ok: "text-accent-2",
+    warn: "text-warning",
+    muted: "text-text-3",
+};
+/** Consent toggle and status for Apple device Pro continuity. Renders nothing
+ *  where iCloud Keychain does not exist (the native command reports
+ *  `supported: false` off macOS). */
+export default function AppleSyncPanel() {
+    const [status, setStatus] = useState(null);
+    const [busy, setBusy] = useState(false);
+    const [error, setError] = useState(null);
+    const refresh = useCallback(async () => {
+        try {
+            setStatus(await getProBridgeStatus());
+        }
+        catch {
+            setStatus(null);
+        }
+    }, []);
+    useEffect(() => {
+        void refresh();
+    }, [refresh]);
+    if (!status || !status.supported)
+        return null;
+    const summary = summarizeAppleSync(status);
+    const checked = status.keychainSyncEnabled && status.proResolutionEnabled;
+    async function onToggle(next) {
+        if (busy)
+            return;
+        setBusy(true);
+        setError(null);
+        try {
+            await setProBridgeSyncEnabled(next);
+        }
+        catch (err) {
+            setError(reasonOf(err, "Could not change Apple device sync"));
+        }
+        finally {
+            await refresh();
+            setBusy(false);
+        }
+    }
+    return (_jsxs("div", { className: "rounded-lg border border-line bg-panel p-4", "data-testid": "apple-sync-panel", children: [_jsxs("div", { className: "flex items-center justify-between gap-3 flex-wrap", children: [_jsxs("div", { className: "max-w-xl", children: [_jsx("h3", { className: "text-[14px] font-semibold text-text", children: "Apple devices" }), _jsx("p", { className: "text-[12px] text-text-3", children: "Use Pro on your other Apple devices through your private iCloud Keychain. Only an opaque sign-in token is shared, never your license key. Turning this off stops this device only and never deletes iCloud data." })] }), _jsxs("label", { className: "inline-flex items-center gap-2 text-[13px] text-text-2", children: [_jsx("span", { className: TONE_CLASS[summary.tone], children: summary.text }), _jsx("input", { type: "checkbox", "aria-label": "Sync Pro across Apple devices", checked: checked, disabled: busy, onChange: (event) => void onToggle(event.target.checked) })] })] }), status.consumptionSuppressed ? (_jsx("p", { className: "mt-3 text-[12px] text-text-3", children: "Pro sign-in is paused on this device because the license was removed here. Turning sync back on clears this." })) : null, error ? _jsx("div", { className: "mt-3 text-[12px] text-danger", children: error }) : null] }));
+}

package/dist/components/settings/tabs/ChildProviderPolicy.d.ts

@@ -0,0 +1,9 @@
+import type { CliDelegationPolicy } from "@rightkit/agent-ui-core/lib/types/cliProviders";
+export interface ChildProviderPolicyProps {
+    policy: CliDelegationPolicy;
+    onChange: (policy: CliDelegationPolicy) => void;
+    /** Optional hint to render above the controls when the policy is
+     *  inconsistent (e.g. default child is no longer allowed). */
+    warning?: string | null;
+}
+export default function ChildProviderPolicy({ policy, onChange, warning, }: ChildProviderPolicyProps): import("react").JSX.Element;

package/dist/components/settings/tabs/ChildProviderPolicy.js

@@ -0,0 +1,84 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Per-session child provider policy editor.
+ *
+ * The `CliDelegationPolicy` shape is the model the resolver in
+ * `engine/crates/driver_host/src/cli_runtime/policy.rs` consumes to
+ * decide whether a root may spawn a child, whether a child may spawn
+ * a child, and whether a model-emitted `providerHint` is honored.
+ * This component is the desktop surface — it must mirror the Rust
+ * data model exactly so round-tripping through the daemon keeps the
+ * cap of allowed children, the depth limit, and the default-child
+ * provider in lock-step.
+ *
+ * The policy is per-session rather than global so the user can opt
+ * each session into a different mix of providers. Kiro is intentionally
+ * absent from the toggle list.
+ */
+import { useMemo } from "react";
+import { Checkbox, Select, Slider } from "@rightkit/react-shell/react";
+import Icon from "@rightkit/agent-ui-core/components/Icon";
+import { CLI_PROVIDER_IDS, getProviderDisplay, isLaunchableProvider, } from "@rightkit/agent-ui-core/lib/cliProviders";
+import { hostAppName } from "../../../appName.js";
+const MAX_DEPTH_MIN = 1;
+const MAX_DEPTH_MAX = 4;
+const DEFAULT_MAX_DEPTH = 2;
+export default function ChildProviderPolicy({ policy, onChange, warning, }) {
+    const allowed = useMemo(() => new Set(policy.allowedChildProviders), [policy.allowedChildProviders]);
+    const toggleAllowed = (id) => {
+        if (!isLaunchableProvider(id))
+            return;
+        const next = new Set(allowed);
+        if (next.has(id))
+            next.delete(id);
+        else
+            next.add(id);
+        let defaultChild = policy.defaultChildProvider;
+        if (defaultChild && !next.has(defaultChild))
+            defaultChild = null;
+        onChange({
+            ...policy,
+            allowedChildProviders: Array.from(next),
+            defaultChildProvider: defaultChild,
+        });
+    };
+    const setDefaultChild = (raw) => {
+        if (raw === "") {
+            onChange({ ...policy, defaultChildProvider: null });
+            return;
+        }
+        if (isLaunchableProvider(raw) && allowed.has(raw)) {
+            onChange({ ...policy, defaultChildProvider: raw });
+        }
+    };
+    const setMaxDepth = (parsed) => {
+        const clamped = Math.max(MAX_DEPTH_MIN, Math.min(MAX_DEPTH_MAX, Math.round(parsed)));
+        onChange({ ...policy, maxDepth: clamped });
+    };
+    const setPermitHints = (allowed) => {
+        onChange({ ...policy, permitModelProviderHints: allowed });
+    };
+    const reset = () => {
+        onChange({
+            allowedChildProviders: [],
+            defaultChildProvider: null,
+            permitModelProviderHints: true,
+            maxDepth: DEFAULT_MAX_DEPTH,
+            maxParallelChildren: 4,
+            maxParallelPerProvider: {},
+        });
+    };
+    return (_jsxs("section", { className: "flex flex-col gap-4", children: [_jsxs("header", { className: "flex flex-col gap-1", children: [_jsx("h3", { className: "text-[16px] font-bold text-text", children: "Child provider policy" }), _jsxs("p", { className: "text-[12px] text-text-3", children: ["Per-session rules that decide which authenticated CLIs a root or child agent may delegate to. ", hostAppName(), " stays the authority for tools, approvals, and effects."] })] }), warning ? (_jsx("p", { className: "rounded-md border border-warning/40 bg-warning/10 p-2 text-[12px] text-warning", children: warning })) : null, _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx("span", { className: "text-[12px] font-semibold text-text-2", children: "Max delegation depth" }), _jsxs("div", { className: "flex items-center gap-3", children: [_jsx(Slider, { label: "Max delegation depth", min: MAX_DEPTH_MIN, max: MAX_DEPTH_MAX, step: 1, value: policy.maxDepth, onChange: setMaxDepth, format: (depth) => `depth ${depth}`, className: "w-full max-w-sm" }), _jsx("span", { className: "font-mono text-[12px] tabular-nums text-text-2", "data-testid": "child-policy-max-depth-value", children: policy.maxDepth }), _jsxs("span", { className: "text-[11px] text-text-3", children: ["(", policy.maxDepth === 1
+                                        ? "root only"
+                                        : `root + child${policy.maxDepth > 2 ? " + deeper" : ""}`, ")"] })] }), _jsx("p", { className: "text-[11px] text-text-3", children: "Depth 1 forbids any child from spawning another child. The default of 2 permits one further level of delegation." })] }), _jsxs("fieldset", { className: "flex flex-col gap-2", children: [_jsx("legend", { className: "text-[12px] font-semibold text-text-2", children: "Allowed child providers" }), _jsx("p", { className: "text-[11px] text-text-3", children: "Toggle the providers this session may delegate to. Kiro is not available." }), _jsx("ul", { className: "grid gap-1.5 sm:grid-cols-2", children: CLI_PROVIDER_IDS.map((id) => {
+                            const display = getProviderDisplay(id);
+                            const checked = allowed.has(id);
+                            return (_jsx("li", { children: _jsx(Checkbox, { checked: checked, onChange: () => toggleAllowed(id), className: "rounded-md border border-line bg-panel px-2.5 py-1.5 hover:border-accent", label: _jsxs("span", { className: "flex-1 truncate", children: [_jsx("strong", { className: "text-text", children: display.displayName }), _jsx("span", { className: "ml-2 text-[11px] text-text-3", children: display.shortLabel })] }) }) }, id));
+                        }) })] }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx("span", { className: "text-[12px] font-semibold text-text-2", children: "Default child provider" }), _jsx(Select, { label: "Default child provider", value: policy.defaultChildProvider ?? "", onChange: setDefaultChild, className: "w-full max-w-sm", options: [
+                            { value: "", label: `No default — fall back to ${hostAppName()}-native` },
+                            ...CLI_PROVIDER_IDS.filter((id) => allowed.has(id)).map((id) => ({
+                                value: id,
+                                label: getProviderDisplay(id).displayName,
+                            })),
+                        ] }), _jsx("p", { className: "text-[11px] text-text-3", children: "When the model does not name a child, the root session hands the work to this provider." })] }), _jsx("div", { className: "flex flex-col gap-2", children: _jsx(Checkbox, { checked: policy.permitModelProviderHints, onChange: setPermitHints, label: _jsxs("span", { children: ["Permit model-emitted provider hints", _jsxs("span", { className: "ml-2 text-[11px] text-text-3", children: ["Honors ", _jsx("code", { children: "providerHint" }), " calls only when the hinted provider is in", _jsx("code", { children: " allowed_child_providers" }), "."] })] }) }) }), _jsx("div", { className: "flex items-center justify-end gap-2", children: _jsxs("button", { type: "button", onClick: reset, className: "cr-control-pill inline-flex items-center gap-1.5 rounded-md border border-line bg-panel-2 px-3 py-1.5 text-[12px] font-semibold text-text-2 hover:border-danger/60 hover:text-danger", children: [_jsx(Icon, { name: "refresh", size: 11 }), "Reset to defaults"] }) })] }));
+}

package/dist/components/settings/tabs/ConductorsTab.d.ts

@@ -0,0 +1,6 @@
+import type { DaemonConfig, SessionRow } from "@rightkit/agent-ui-core/lib/types";
+export interface ConductorsTabProps {
+    config: DaemonConfig | null;
+    selectedSession: SessionRow | null;
+}
+export default function ConductorsTab({ config, selectedSession }: ConductorsTabProps): import("react").JSX.Element;