@agimon-ai/po-web-dashboard 0.0.0-alpha.0

package/dist/web/features/activity/ContextPanel.mjs

@@ -0,0 +1,248 @@
+import { HOST_SLOTS } from "../../lib/pluginRegistry.mjs";
+import { contextGroups, inactiveTotal, ownerLabel, ownersOf, projectedGroups, totalTokens } from "../../lib/contextComposition.mjs";
+import { useActiveSessionMeta } from "../../stores/sessionsStore.mjs";
+import { useActiveSession } from "../../stores/sessionStore.mjs";
+import { PluginSurface } from "../../components/PluginSurface.mjs";
+import { ContextItemDialog } from "./ContextItemDialog.mjs";
+import { useState } from "react";
+import { CONTEXT_TOOL_WARNINGS_STATUS_KEY, parseContextToolWarnings } from "@agimon-ai/po-core/contextApi";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Button, EmptyState } from "@agimon-ai/po-web-components";
+//#region src/web/features/activity/ContextPanel.tsx
+/** Short enough to sit in a fixed column without wrapping the tool's own name. */
+const SOURCE_LABEL = {
+	extension: "ext",
+	mcp: "mcp",
+	plugin: "plug",
+	core: "core"
+};
+/** The tilde is the whole caveat in one character: this is arithmetic, not a bill. */
+function tokens(value) {
+	return value === null ? "-" : `~${value.toLocaleString()}`;
+}
+/**
+* What the session is carrying.
+*
+* Every tool and skill in here is spending context before the first message,
+* so the surface is built around the one question worth asking of it: what is
+* this costing, and what do I switch off to stop paying it. Modes head the
+* groups because a mode is what you switch; packages head the rows inside them
+* because a package is what you add or remove. It reads only; switching stays
+* with the composer chips that already own it.
+*/
+function withoutMcpInventory(groups) {
+	return groups.map((group) => {
+		const mcp = group.items.filter((item) => item.source === "mcp");
+		const activeMcpTokens = mcp.reduce((sum, item) => sum + (item.active ? item.tokens ?? 0 : 0), 0);
+		const inactiveMcpTokens = mcp.reduce((sum, item) => sum + (item.active ? 0 : item.tokens ?? 0), 0);
+		return {
+			...group,
+			items: group.items.filter((item) => item.source !== "mcp"),
+			tokens: group.tokens === null ? null : Math.max(0, group.tokens - activeMcpTokens),
+			inactiveTokens: Math.max(0, group.inactiveTokens - inactiveMcpTokens)
+		};
+	});
+}
+function ContextPanel() {
+	const statuses = useActiveSession((state) => state.statuses);
+	const widgets = useActiveSession((state) => state.widgets);
+	const projection = useActiveSession((state) => state.minorModes);
+	const context = useActiveSession((state) => state.context);
+	const sessionId = useActiveSessionMeta()?.summary.id ?? null;
+	const [target, setTarget] = useState(null);
+	const [targetSession, setTargetSession] = useState(sessionId);
+	if (targetSession !== sessionId) {
+		setTargetSession(sessionId);
+		setTarget(null);
+	}
+	const warnings = parseContextToolWarnings(statuses[CONTEXT_TOOL_WARNINGS_STATUS_KEY]);
+	const groups = context ? projectedGroups(context) : contextGroups(statuses, widgets, projection);
+	const total = totalTokens(groups);
+	const idle = inactiveTotal(groups);
+	const visibleGroups = withoutMcpInventory(groups);
+	return /* @__PURE__ */ jsxs("div", {
+		"data-testid": "context-panel",
+		className: "flex min-h-0 min-w-0 flex-1 flex-col",
+		children: [
+			/* @__PURE__ */ jsxs("div", {
+				"data-testid": "context-scroll",
+				className: "min-h-0 flex-1 overflow-y-auto",
+				children: [/* @__PURE__ */ jsx(PluginSurface, {
+					slot: HOST_SLOTS.context,
+					sessionId
+				}), groups.length === 0 ? /* @__PURE__ */ jsx(EmptyState, {
+					"data-testid": "context-empty",
+					className: "px-4 py-5",
+					title: "no composition yet",
+					description: "the session reports its major mode, minor modes, and domains once it has started."
+				}) : /* @__PURE__ */ jsx("div", {
+					className: "flex flex-col",
+					children: visibleGroups.map((group) => /* @__PURE__ */ jsx(ContextGroupView, {
+						group,
+						warnings,
+						onSelect: setTarget
+					}, `${group.kind}:${group.id}`))
+				})]
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "shrink-0 border-t border-doom-border px-4 py-3",
+				children: [
+					context?.systemPrompt ? /* @__PURE__ */ jsxs(Button, {
+						variant: "ghost",
+						size: "card",
+						"data-testid": "context-system-prompt",
+						title: "read the system prompt this session is running under",
+						onClick: () => setTarget({
+							itemKind: "prompt",
+							name: "system",
+							owner: "session"
+						}),
+						className: "flex-row items-center justify-between gap-2 rounded-none px-0 py-px",
+						children: [/* @__PURE__ */ jsx("span", {
+							className: "text-sm text-doom-dim",
+							children: context.systemPrompt.stage === "base" ? "system prompt (base)" : "system prompt"
+						}), /* @__PURE__ */ jsx("span", {
+							className: "text-sm text-doom-dim",
+							children: tokens(context.systemPrompt.tokens)
+						})]
+					}) : null,
+					/* @__PURE__ */ jsxs("div", {
+						className: "flex items-center justify-between",
+						children: [/* @__PURE__ */ jsx("span", {
+							className: "text-sm font-semibold text-doom-text",
+							children: "active"
+						}), /* @__PURE__ */ jsx("span", {
+							"data-testid": "context-total",
+							className: "text-sm font-semibold text-doom-text",
+							children: tokens(total)
+						})]
+					}),
+					idle > 0 ? /* @__PURE__ */ jsxs("div", {
+						className: "flex items-center justify-between",
+						children: [/* @__PURE__ */ jsx("span", {
+							className: "text-sm text-doom-dim",
+							children: "inactive"
+						}), /* @__PURE__ */ jsx("span", {
+							"data-testid": "context-inactive",
+							className: "text-sm text-doom-dim",
+							children: `+${tokens(idle)}`
+						})]
+					}) : null,
+					/* @__PURE__ */ jsx("span", {
+						className: "text-sm leading-relaxed text-doom-dim",
+						children: `estimated · ${context?.estimator ?? "gpt-tokenizer"} BPE · not a billed total`
+					})
+				]
+			}),
+			/* @__PURE__ */ jsx(ContextItemDialog, {
+				sessionId,
+				target,
+				warnings: target?.itemKind === "tool" && Object.hasOwn(warnings, target.name) ? warnings[target.name] : void 0,
+				onClose: () => setTarget(null)
+			})
+		]
+	});
+}
+/** Active carries the bright ink, inactive the faint one, so what the model sees reads at a glance. */
+function ink(active) {
+	return active ? "text-doom-hi" : "text-doom-dim";
+}
+function ContextGroupView({ group, warnings, onSelect }) {
+	const groupActive = group.items.length === 0 || group.items.some((item) => item.active);
+	return /* @__PURE__ */ jsxs("div", {
+		"data-testid": `context-group-${group.id}`,
+		"data-kind": group.kind,
+		"data-active": groupActive,
+		className: "flex flex-col gap-1 border-b border-doom-border-soft px-3 py-3",
+		children: [/* @__PURE__ */ jsxs("div", {
+			className: "flex items-center gap-2 px-1",
+			children: [
+				/* @__PURE__ */ jsx("span", {
+					"aria-hidden": true,
+					className: "text-sm font-semibold text-doom-faint",
+					children: "#"
+				}),
+				/* @__PURE__ */ jsx("span", {
+					className: `min-w-0 flex-1 truncate text-lg font-semibold text-doom-hi`,
+					children: group.label
+				}),
+				/* @__PURE__ */ jsx("span", {
+					className: "inline-block text-sm text-doom-dim first-letter:uppercase",
+					children: group.kind
+				}),
+				/* @__PURE__ */ jsx("span", {
+					"data-testid": `context-subtotal-${group.id}`,
+					className: "w-14 text-right text-sm text-doom-dim",
+					children: tokens(group.tokens)
+				})
+			]
+		}), group.items.length === 0 ? /* @__PURE__ */ jsx("p", {
+			"data-testid": `context-pending-${group.id}`,
+			className: "px-1 text-sm text-doom-dim",
+			children: group.detail || "no tools or skills reported"
+		}) : ownersOf(group).map((owner) => {
+			const ownerActive = owner.items.some((item) => item.active);
+			return /* @__PURE__ */ jsxs("div", {
+				className: "flex flex-col",
+				children: [/* @__PURE__ */ jsxs("div", {
+					"data-testid": `context-owner-${owner.owner}`,
+					"data-active": ownerActive,
+					title: owner.owner,
+					className: "flex items-center gap-2 px-1 pt-1",
+					children: [
+						/* @__PURE__ */ jsx("span", {
+							className: `min-w-0 flex-1 truncate text-base font-semibold text-doom-hi`,
+							children: ownerLabel(owner.owner)
+						}),
+						/* @__PURE__ */ jsx("span", {
+							className: "text-sm text-doom-dim",
+							children: SOURCE_LABEL[owner.source]
+						}),
+						/* @__PURE__ */ jsx("span", {
+							className: "w-14 text-right text-sm text-doom-dim",
+							children: tokens(owner.tokens)
+						})
+					]
+				}), owner.items.map((item) => /* @__PURE__ */ jsxs(Button, {
+					variant: "ghost",
+					size: "card",
+					"data-testid": `context-row-${item.name}`,
+					"data-active": item.active,
+					onClick: () => onSelect({
+						itemKind: item.itemKind,
+						name: item.name,
+						owner: item.owner
+					}),
+					className: "flex-row items-center gap-2 rounded-none py-px pr-1 pl-4",
+					children: [
+						/* @__PURE__ */ jsx("abbr", {
+							title: item.itemKind,
+							className: `w-4 shrink-0 text-center text-2xs font-semibold no-underline ${item.active ? "text-doom-violet" : "text-doom-faint"}`,
+							children: item.itemKind === "skill" ? "S" : "T"
+						}),
+						/* @__PURE__ */ jsx("span", {
+							className: `min-w-0 flex-1 truncate text-base font-medium ${ink(item.active)}`,
+							children: item.name
+						}),
+						item.itemKind === "tool" && Object.hasOwn(warnings, item.name) && (warnings[item.name]?.length ?? 0) > 0 ? /* @__PURE__ */ jsx("abbr", {
+							"data-testid": `context-warning-${item.name}`,
+							"aria-label": `${item.name} has warnings`,
+							title: "warnings: open tool details for origins",
+							className: "shrink-0 text-xs font-semibold text-doom-yellow no-underline",
+							children: "!"
+						}) : null,
+						/* @__PURE__ */ jsx("span", {
+							title: item.active ? void 0 : "not sent to the model; costs nothing until switched on",
+							className: `w-14 text-right text-sm ${item.active ? "text-doom-text" : "text-doom-dim"}`,
+							children: item.active ? tokens(item.tokens) : `(${tokens(item.tokens)})`
+						})
+					]
+				}, `${item.itemKind}:${item.name}`))]
+			}, owner.owner);
+		})]
+	});
+}
+//#endregion
+export { ContextPanel };
+
+//# sourceMappingURL=ContextPanel.mjs.map

package/dist/web/features/activity/ContextPanel.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ContextPanel.mjs","names":[],"sources":["../../../../src/web/features/activity/ContextPanel.tsx"],"sourcesContent":["import {\n  CONTEXT_TOOL_WARNINGS_STATUS_KEY,\n  parseContextToolWarnings,\n  type ContextToolWarning,\n  type ContextItemKind,\n} from '@agimon-ai/po-core/contextApi';\nimport { Button, EmptyState } from '@agimon-ai/po-web-components';\nimport { useState } from 'react';\n\nimport { PluginSurface } from '../../components/PluginSurface';\nimport {\n  type ContextGroup,\n  type ContextItemSource,\n  contextGroups,\n  inactiveTotal,\n  ownerLabel,\n  ownersOf,\n  projectedGroups,\n  totalTokens,\n} from '../../lib/contextComposition';\nimport { HOST_SLOTS } from '../../lib/pluginRegistry';\nimport { useActiveSessionMeta } from '../../stores/sessionsStore';\nimport { useActiveSession } from '../../stores/sessionStore';\nimport { ContextItemDialog } from './ContextItemDialog';\n\n/** The row a reader clicked, which is all the detail request is made of. */\ninterface ItemTarget {\n  itemKind: ContextItemKind;\n  name: string;\n  owner: string;\n}\n\n/** Short enough to sit in a fixed column without wrapping the tool's own name. */\nconst SOURCE_LABEL: Record<ContextItemSource, string> = {\n  extension: 'ext',\n  mcp: 'mcp',\n  plugin: 'plug',\n  core: 'core',\n};\n\n/** The tilde is the whole caveat in one character: this is arithmetic, not a bill. */\nfunction tokens(value: number | null): string {\n  return value === null ? '-' : `~${value.toLocaleString()}`;\n}\n\n/**\n * What the session is carrying.\n *\n * Every tool and skill in here is spending context before the first message,\n * so the surface is built around the one question worth asking of it: what is\n * this costing, and what do I switch off to stop paying it. Modes head the\n * groups because a mode is what you switch; packages head the rows inside them\n * because a package is what you add or remove. It reads only; switching stays\n * with the composer chips that already own it.\n */\nfunction withoutMcpInventory(groups: readonly ContextGroup[]): ContextGroup[] {\n  return groups.map((group) => {\n    const mcp = group.items.filter((item) => item.source === 'mcp');\n    const activeMcpTokens = mcp.reduce((sum, item) => sum + (item.active ? (item.tokens ?? 0) : 0), 0);\n    const inactiveMcpTokens = mcp.reduce((sum, item) => sum + (item.active ? 0 : (item.tokens ?? 0)), 0);\n    return {\n      ...group,\n      items: group.items.filter((item) => item.source !== 'mcp'),\n      tokens: group.tokens === null ? null : Math.max(0, group.tokens - activeMcpTokens),\n      inactiveTokens: Math.max(0, group.inactiveTokens - inactiveMcpTokens),\n    };\n  });\n}\n\nexport function ContextPanel() {\n  const statuses = useActiveSession((state) => state.statuses);\n  const widgets = useActiveSession((state) => state.widgets);\n  const projection = useActiveSession((state) => state.minorModes);\n  const context = useActiveSession((state) => state.context);\n  const sessionId = useActiveSessionMeta()?.summary.id ?? null;\n  const [target, setTarget] = useState<ItemTarget | null>(null);\n  const [targetSession, setTargetSession] = useState(sessionId);\n  if (targetSession !== sessionId) {\n    setTargetSession(sessionId);\n    setTarget(null);\n  }\n  const warnings = parseContextToolWarnings(statuses[CONTEXT_TOOL_WARNINGS_STATUS_KEY]);\n  // The runtime's grouping wins once it arrives; the status line only has to\n  // carry the surface until the session has reported its inventory.\n  const groups = context ? projectedGroups(context) : contextGroups(statuses, widgets, projection);\n  const total = totalTokens(groups);\n  const idle = inactiveTotal(groups);\n  const visibleGroups = withoutMcpInventory(groups);\n  return (\n    <div data-testid=\"context-panel\" className=\"flex min-h-0 min-w-0 flex-1 flex-col\">\n      <div data-testid=\"context-scroll\" className=\"min-h-0 flex-1 overflow-y-auto\">\n        <PluginSurface slot={HOST_SLOTS.context} sessionId={sessionId} />\n        {groups.length === 0 ? (\n          <EmptyState\n            data-testid=\"context-empty\"\n            className=\"px-4 py-5\"\n            title=\"no composition yet\"\n            description=\"the session reports its major mode, minor modes, and domains once it has started.\"\n          />\n        ) : (\n          <div className=\"flex flex-col\">\n            {visibleGroups.map((group) => (\n              <ContextGroupView\n                key={`${group.kind}:${group.id}`}\n                group={group}\n                warnings={warnings}\n                onSelect={setTarget}\n              />\n            ))}\n          </div>\n        )}\n      </div>\n\n      <div className=\"shrink-0 border-t border-doom-border px-4 py-3\">\n        {/* Above the totals rather than inside them. The prompt carries every\n            tool's prose and every skill's listing, which the group subtotals\n            have already counted, so the two figures overlap and adding them\n            would bill the same text twice. */}\n        {context?.systemPrompt ? (\n          <Button\n            variant=\"ghost\"\n            size=\"card\"\n            data-testid=\"context-system-prompt\"\n            title=\"read the system prompt this session is running under\"\n            onClick={() => setTarget({ itemKind: 'prompt', name: 'system', owner: 'session' })}\n            className=\"flex-row items-center justify-between gap-2 rounded-none px-0 py-px\"\n          >\n            <span className=\"text-sm text-doom-dim\">\n              {context.systemPrompt.stage === 'base' ? 'system prompt (base)' : 'system prompt'}\n            </span>\n            <span className=\"text-sm text-doom-dim\">{tokens(context.systemPrompt.tokens)}</span>\n          </Button>\n        ) : null}\n        <div className=\"flex items-center justify-between\">\n          <span className=\"text-sm font-semibold text-doom-text\">active</span>\n          <span data-testid=\"context-total\" className=\"text-sm font-semibold text-doom-text\">\n            {tokens(total)}\n          </span>\n        </div>\n        {idle > 0 ? (\n          <div className=\"flex items-center justify-between\">\n            <span className=\"text-sm text-doom-dim\">inactive</span>\n            <span data-testid=\"context-inactive\" className=\"text-sm text-doom-dim\">\n              {`+${tokens(idle)}`}\n            </span>\n          </div>\n        ) : null}\n        <span className=\"text-sm leading-relaxed text-doom-dim\">\n          {`estimated · ${context?.estimator ?? 'gpt-tokenizer'} BPE · not a billed total`}\n        </span>\n      </div>\n\n      <ContextItemDialog\n        sessionId={sessionId}\n        target={target}\n        warnings={\n          target?.itemKind === 'tool' && Object.hasOwn(warnings, target.name) ? warnings[target.name] : undefined\n        }\n        onClose={() => setTarget(null)}\n      />\n    </div>\n  );\n}\n\n/** Active carries the bright ink, inactive the faint one, so what the model sees reads at a glance. */\nfunction ink(active: boolean): string {\n  return active ? 'text-doom-hi' : 'text-doom-dim';\n}\n\nfunction ContextGroupView({\n  group,\n  warnings,\n  onSelect,\n}: {\n  group: ContextGroup;\n  warnings: Readonly<Record<string, readonly ContextToolWarning[]>>;\n  onSelect: (target: ItemTarget) => void;\n}) {\n  // A group that reported rows is active when any of them is; one still pending keeps the normal head.\n  const groupActive = group.items.length === 0 || group.items.some((item) => item.active);\n  return (\n    <div\n      data-testid={`context-group-${group.id}`}\n      data-kind={group.kind}\n      data-active={groupActive}\n      className=\"flex flex-col gap-1 border-b border-doom-border-soft px-3 py-3\"\n    >\n      {/* The same head the activity dock uses, for the same reason: the glyph\n          says \"section\", so a mode never reads as one more row among the tools\n          it brought with it. */}\n      <div className=\"flex items-center gap-2 px-1\">\n        <span aria-hidden className=\"text-sm font-semibold text-doom-faint\">\n          #\n        </span>\n        <span className={`min-w-0 flex-1 truncate text-lg font-semibold text-doom-hi`}>{group.label}</span>\n        <span className=\"inline-block text-sm text-doom-dim first-letter:uppercase\">{group.kind}</span>\n        <span data-testid={`context-subtotal-${group.id}`} className=\"w-14 text-right text-sm text-doom-dim\">\n          {tokens(group.tokens)}\n        </span>\n      </div>\n\n      {group.items.length === 0 ? (\n        <p data-testid={`context-pending-${group.id}`} className=\"px-1 text-sm text-doom-dim\">\n          {group.detail || 'no tools or skills reported'}\n        </p>\n      ) : (\n        ownersOf(group).map((owner) => {\n          const ownerActive = owner.items.some((item) => item.active);\n          return (\n            <div key={owner.owner} className=\"flex flex-col\">\n              {/* The package heads its own rows, so the source tag sits here\n                rather than repeating on every tool that shares it. */}\n              <div\n                data-testid={`context-owner-${owner.owner}`}\n                data-active={ownerActive}\n                title={owner.owner}\n                className=\"flex items-center gap-2 px-1 pt-1\"\n              >\n                <span className={`min-w-0 flex-1 truncate text-base font-semibold text-doom-hi`}>\n                  {ownerLabel(owner.owner)}\n                </span>\n                <span className=\"text-sm text-doom-dim\">{SOURCE_LABEL[owner.source]}</span>\n                <span className=\"w-14 text-right text-sm text-doom-dim\">{tokens(owner.tokens)}</span>\n              </div>\n              {owner.items.map((item) => (\n                // A row is a question as much as a figure: what am I paying for.\n                // The answer is too large to have travelled with the panel, so\n                // the row asks for it rather than carrying it.\n                <Button\n                  variant=\"ghost\"\n                  size=\"card\"\n                  key={`${item.itemKind}:${item.name}`}\n                  data-testid={`context-row-${item.name}`}\n                  data-active={item.active}\n                  onClick={() => onSelect({ itemKind: item.itemKind, name: item.name, owner: item.owner })}\n                  className=\"flex-row items-center gap-2 rounded-none py-px pr-1 pl-4\"\n                >\n                  <abbr\n                    title={item.itemKind}\n                    className={`w-4 shrink-0 text-center text-2xs font-semibold no-underline ${item.active ? 'text-doom-violet' : 'text-doom-faint'}`}\n                  >\n                    {item.itemKind === 'skill' ? 'S' : 'T'}\n                  </abbr>\n                  <span className={`min-w-0 flex-1 truncate text-base font-medium ${ink(item.active)}`}>\n                    {item.name}\n                  </span>\n                  {item.itemKind === 'tool' &&\n                  Object.hasOwn(warnings, item.name) &&\n                  (warnings[item.name]?.length ?? 0) > 0 ? (\n                    <abbr\n                      data-testid={`context-warning-${item.name}`}\n                      aria-label={`${item.name} has warnings`}\n                      title=\"warnings: open tool details for origins\"\n                      className=\"shrink-0 text-xs font-semibold text-doom-yellow no-underline\"\n                    >\n                      !\n                    </abbr>\n                  ) : null}\n                  <span\n                    title={item.active ? undefined : 'not sent to the model; costs nothing until switched on'}\n                    className={`w-14 text-right text-sm ${item.active ? 'text-doom-text' : 'text-doom-dim'}`}\n                  >\n                    {item.active ? tokens(item.tokens) : `(${tokens(item.tokens)})`}\n                  </span>\n                </Button>\n              ))}\n            </div>\n          );\n        })\n      )}\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/web/features/activity/DockTabs.cjs

@@ -0,0 +1,47 @@
+const require_uiStore = require("../../stores/uiStore.cjs");
+let _tanstack_react_store = require("@tanstack/react-store");
+let react_jsx_runtime = require("react/jsx-runtime");
+let _agimon_ai_po_web_components = require("@agimon-ai/po-web-components");
+//#region src/web/features/activity/DockTabs.tsx
+const HOST_TABS = [{
+	id: "activity",
+	label: "Activity"
+}, {
+	id: "context",
+	label: "Context"
+}];
+/** Host faces followed by the active session's plugin-contributed faces. */
+function DockTabs({ contributed = [], mcpEnabled = false }) {
+	const active = (0, _tanstack_react_store.useStore)(require_uiStore.uiStore, (state) => state.dockTab);
+	const tabs = [
+		...HOST_TABS,
+		...mcpEnabled ? [{
+			id: "mcp",
+			label: "MCP"
+		}] : [],
+		...contributed.map(({ id, label }) => ({
+			id,
+			label
+		}))
+	];
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: "flex items-end gap-6",
+		role: "tablist",
+		"aria-label": "Dock view",
+		children: tabs.map((tab) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_agimon_ai_po_web_components.Button, {
+			variant: "ghost",
+			size: "xs",
+			role: "tab",
+			"aria-selected": tab.id === active,
+			"data-testid": `dock-tab-${tab.id}`,
+			"data-active": tab.id === active,
+			onClick: () => require_uiStore.setDockTab(tab.id),
+			className: `h-auto rounded-none border-b-2 px-0 pb-3 text-base hover:bg-transparent ${tab.id === active ? "border-doom-green font-semibold text-doom-hi" : "border-transparent font-medium text-doom-text hover:text-doom-text"}`,
+			children: tab.label
+		}, tab.id))
+	});
+}
+//#endregion
+exports.DockTabs = DockTabs;
+
+//# sourceMappingURL=DockTabs.cjs.map

package/dist/web/features/activity/DockTabs.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"DockTabs.cjs","names":["useStore","uiStore","Button","setDockTab"],"sources":["../../../../src/web/features/activity/DockTabs.tsx"],"sourcesContent":["import type { DockFaceContribution } from '@agimon-ai/po-core/web';\nimport { Button } from '@agimon-ai/po-web-components';\nimport { useStore } from '@tanstack/react-store';\n\nimport { type DockTab, setDockTab, uiStore } from '../../stores/uiStore';\n\nconst HOST_TABS: readonly { id: DockTab; label: string }[] = [\n  { id: 'activity', label: 'Activity' },\n  { id: 'context', label: 'Context' },\n];\n\n/** Host faces followed by the active session's plugin-contributed faces. */\nexport function DockTabs({\n  contributed = [],\n  mcpEnabled = false,\n}: {\n  contributed?: readonly DockFaceContribution[];\n  mcpEnabled?: boolean;\n}) {\n  const active = useStore(uiStore, (state) => state.dockTab);\n  const tabs = [\n    ...HOST_TABS,\n    ...(mcpEnabled ? [{ id: 'mcp', label: 'MCP' }] : []),\n    ...contributed.map(({ id, label }) => ({ id, label })),\n  ];\n\n  return (\n    <div className=\"flex items-end gap-6\" role=\"tablist\" aria-label=\"Dock view\">\n      {tabs.map((tab) => (\n        <Button\n          key={tab.id}\n          variant=\"ghost\"\n          size=\"xs\"\n          role=\"tab\"\n          aria-selected={tab.id === active}\n          data-testid={`dock-tab-${tab.id}`}\n          data-active={tab.id === active}\n          onClick={() => setDockTab(tab.id)}\n          className={`h-auto rounded-none border-b-2 px-0 pb-3 text-base hover:bg-transparent ${\n            tab.id === active\n              ? 'border-doom-green font-semibold text-doom-hi'\n              : 'border-transparent font-medium text-doom-text hover:text-doom-text'\n          }`}\n        >\n          {tab.label}\n        </Button>\n      ))}\n    </div>\n  );\n}\n"],"mappings":";;;;;AAMA,MAAM,YAAuD,CAC3D;CAAE,IAAI;CAAY,OAAO;AAAW,GACpC;CAAE,IAAI;CAAW,OAAO;AAAU,CACpC;;AAGA,SAAgB,SAAS,EACvB,cAAc,CAAC,GACf,aAAa,SAIZ;CACD,MAAM,UAAA,GAASA,sBAAAA,SAAAA,CAASC,gBAAAA,UAAU,UAAU,MAAM,OAAO;CACzD,MAAM,OAAO;EACX,GAAG;EACH,GAAI,aAAa,CAAC;GAAE,IAAI;GAAO,OAAO;EAAM,CAAC,IAAI,CAAC;EAClD,GAAG,YAAY,KAAK,EAAE,IAAI,aAAa;GAAE;GAAI;EAAM,EAAE;CACvD;CAEA,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;EAAK,WAAU;EAAuB,MAAK;EAAU,cAAW;EAC7D,UAAA,KAAK,KAAK,QACT,iBAAA,GAAA,kBAAA,IAAA,CAACC,6BAAAA,QAAD;GAEE,SAAQ;GACR,MAAK;GACL,MAAK;GACL,iBAAe,IAAI,OAAO;GAC1B,eAAa,YAAY,IAAI;GAC7B,eAAa,IAAI,OAAO;GACxB,eAAeC,gBAAAA,WAAW,IAAI,EAAE;GAChC,WAAW,2EACT,IAAI,OAAO,SACP,iDACA;GAGL,UAAA,IAAI;EACC,GAfD,IAAI,EAeH,CACT;CACE,CAAA;AAET"}

package/dist/web/features/activity/DockTabs.d.mts

@@ -0,0 +1,9 @@
+import { DockFaceContribution } from "@agimon-ai/po-core/web";
+//#region src/web/features/activity/DockTabs.d.ts
+/** Host faces followed by the active session's plugin-contributed faces. */
+export declare function DockTabs({ contributed, mcpEnabled }: {
+  contributed?: readonly DockFaceContribution[];
+  mcpEnabled?: boolean;
+}): import("react").JSX.Element;
+//#endregion
+//# sourceMappingURL=DockTabs.d.mts.map

package/dist/web/features/activity/DockTabs.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DockTabs.d.mts","names":[],"sources":["../../../../src/web/features/activity/DockTabs.tsx"],"mappings":";;;wBAYgB,WACd,aACA;EAEA,uBAAuB;EACvB;oBACD,IAAA"}

package/dist/web/features/activity/DockTabs.mjs

@@ -0,0 +1,47 @@
+import { setDockTab, uiStore } from "../../stores/uiStore.mjs";
+import { useStore } from "@tanstack/react-store";
+import { jsx } from "react/jsx-runtime";
+import { Button } from "@agimon-ai/po-web-components";
+//#region src/web/features/activity/DockTabs.tsx
+const HOST_TABS = [{
+	id: "activity",
+	label: "Activity"
+}, {
+	id: "context",
+	label: "Context"
+}];
+/** Host faces followed by the active session's plugin-contributed faces. */
+function DockTabs({ contributed = [], mcpEnabled = false }) {
+	const active = useStore(uiStore, (state) => state.dockTab);
+	const tabs = [
+		...HOST_TABS,
+		...mcpEnabled ? [{
+			id: "mcp",
+			label: "MCP"
+		}] : [],
+		...contributed.map(({ id, label }) => ({
+			id,
+			label
+		}))
+	];
+	return /* @__PURE__ */ jsx("div", {
+		className: "flex items-end gap-6",
+		role: "tablist",
+		"aria-label": "Dock view",
+		children: tabs.map((tab) => /* @__PURE__ */ jsx(Button, {
+			variant: "ghost",
+			size: "xs",
+			role: "tab",
+			"aria-selected": tab.id === active,
+			"data-testid": `dock-tab-${tab.id}`,
+			"data-active": tab.id === active,
+			onClick: () => setDockTab(tab.id),
+			className: `h-auto rounded-none border-b-2 px-0 pb-3 text-base hover:bg-transparent ${tab.id === active ? "border-doom-green font-semibold text-doom-hi" : "border-transparent font-medium text-doom-text hover:text-doom-text"}`,
+			children: tab.label
+		}, tab.id))
+	});
+}
+//#endregion
+export { DockTabs };
+
+//# sourceMappingURL=DockTabs.mjs.map

package/dist/web/features/activity/DockTabs.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"DockTabs.mjs","names":[],"sources":["../../../../src/web/features/activity/DockTabs.tsx"],"sourcesContent":["import type { DockFaceContribution } from '@agimon-ai/po-core/web';\nimport { Button } from '@agimon-ai/po-web-components';\nimport { useStore } from '@tanstack/react-store';\n\nimport { type DockTab, setDockTab, uiStore } from '../../stores/uiStore';\n\nconst HOST_TABS: readonly { id: DockTab; label: string }[] = [\n  { id: 'activity', label: 'Activity' },\n  { id: 'context', label: 'Context' },\n];\n\n/** Host faces followed by the active session's plugin-contributed faces. */\nexport function DockTabs({\n  contributed = [],\n  mcpEnabled = false,\n}: {\n  contributed?: readonly DockFaceContribution[];\n  mcpEnabled?: boolean;\n}) {\n  const active = useStore(uiStore, (state) => state.dockTab);\n  const tabs = [\n    ...HOST_TABS,\n    ...(mcpEnabled ? [{ id: 'mcp', label: 'MCP' }] : []),\n    ...contributed.map(({ id, label }) => ({ id, label })),\n  ];\n\n  return (\n    <div className=\"flex items-end gap-6\" role=\"tablist\" aria-label=\"Dock view\">\n      {tabs.map((tab) => (\n        <Button\n          key={tab.id}\n          variant=\"ghost\"\n          size=\"xs\"\n          role=\"tab\"\n          aria-selected={tab.id === active}\n          data-testid={`dock-tab-${tab.id}`}\n          data-active={tab.id === active}\n          onClick={() => setDockTab(tab.id)}\n          className={`h-auto rounded-none border-b-2 px-0 pb-3 text-base hover:bg-transparent ${\n            tab.id === active\n              ? 'border-doom-green font-semibold text-doom-hi'\n              : 'border-transparent font-medium text-doom-text hover:text-doom-text'\n          }`}\n        >\n          {tab.label}\n        </Button>\n      ))}\n    </div>\n  );\n}\n"],"mappings":";;;;;AAMA,MAAM,YAAuD,CAC3D;CAAE,IAAI;CAAY,OAAO;AAAW,GACpC;CAAE,IAAI;CAAW,OAAO;AAAU,CACpC;;AAGA,SAAgB,SAAS,EACvB,cAAc,CAAC,GACf,aAAa,SAIZ;CACD,MAAM,SAAS,SAAS,UAAU,UAAU,MAAM,OAAO;CACzD,MAAM,OAAO;EACX,GAAG;EACH,GAAI,aAAa,CAAC;GAAE,IAAI;GAAO,OAAO;EAAM,CAAC,IAAI,CAAC;EAClD,GAAG,YAAY,KAAK,EAAE,IAAI,aAAa;GAAE;GAAI;EAAM,EAAE;CACvD;CAEA,OACE,oBAAC,OAAD;EAAK,WAAU;EAAuB,MAAK;EAAU,cAAW;EAC7D,UAAA,KAAK,KAAK,QACT,oBAAC,QAAD;GAEE,SAAQ;GACR,MAAK;GACL,MAAK;GACL,iBAAe,IAAI,OAAO;GAC1B,eAAa,YAAY,IAAI;GAC7B,eAAa,IAAI,OAAO;GACxB,eAAe,WAAW,IAAI,EAAE;GAChC,WAAW,2EACT,IAAI,OAAO,SACP,iDACA;GAGL,UAAA,IAAI;EACC,GAfD,IAAI,EAeH,CACT;CACE,CAAA;AAET"}

package/dist/web/features/connection/RefusedCard.cjs

@@ -0,0 +1,76 @@
+const require_sessionSummary = require("../../lib/sessionSummary.cjs");
+const require_sessionsStore = require("../../stores/sessionsStore.cjs");
+let react_jsx_runtime = require("react/jsx-runtime");
+let _agimon_ai_po_web_components = require("@agimon-ai/po-web-components");
+//#region src/web/features/connection/RefusedCard.tsx
+function Detail({ label, value }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "flex items-center justify-between gap-3",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: "shrink-0 text-sm text-doom-dim",
+			children: label
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: "truncate text-sm text-doom-text",
+			children: value
+		})]
+	});
+}
+/** Shown when the focused session refuses this browser connection. */
+function RefusedCard() {
+	const meta = require_sessionsStore.useActiveSessionMeta();
+	if (meta === null || meta.attach !== "refused") return null;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_agimon_ai_po_web_components.Dialog, {
+		open: true,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_agimon_ai_po_web_components.DialogContent, {
+			width: "lg",
+			"data-testid": "refused-card",
+			"aria-describedby": void 0,
+			className: "w-[520px] border-doom-red/50",
+			onEscapeKeyDown: (event) => event.preventDefault(),
+			onPointerDownOutside: (event) => event.preventDefault(),
+			onInteractOutside: (event) => event.preventDefault(),
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_agimon_ai_po_web_components.DialogHeader, {
+				className: "border-doom-red/40 bg-doom-red/10",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_agimon_ai_po_web_components.DialogTitle, {
+					"data-testid": "refused-title",
+					className: "text-doom-red",
+					children: "session already attached"
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_agimon_ai_po_web_components.Spinner, { className: "text-doom-red/70" })]
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "flex flex-col gap-3 px-4 py-4",
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+						className: "text-sm leading-relaxed text-doom-text",
+						children: "This session is already controlled by another browser connection. Po keeps retrying in the background."
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: "flex flex-col gap-1.5 rounded border border-doom-border bg-doom-deep px-3 py-2.5",
+						children: [
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Detail, {
+								label: "reason",
+								value: meta.reason || "attach_error"
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Detail, {
+								label: "cwd",
+								value: require_sessionSummary.abbreviateCwd(meta.summary.cwd)
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Detail, {
+								label: "retry",
+								value: "automatic, with backoff"
+							})
+						]
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+						"data-testid": "refused-hint",
+						className: "text-sm text-doom-dim",
+						children: "close the other browser connection and this one takes over on the next attempt."
+					})
+				]
+			})]
+		})
+	});
+}
+//#endregion
+exports.RefusedCard = RefusedCard;
+
+//# sourceMappingURL=RefusedCard.cjs.map

package/dist/web/features/connection/RefusedCard.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RefusedCard.cjs","names":["useActiveSessionMeta","Dialog","DialogContent","DialogHeader","DialogTitle","Spinner","abbreviateCwd"],"sources":["../../../../src/web/features/connection/RefusedCard.tsx"],"sourcesContent":["import { Dialog, DialogContent, DialogHeader, DialogTitle, Spinner } from '@agimon-ai/po-web-components';\n\nimport { abbreviateCwd } from '../../lib/sessionSummary';\nimport { useActiveSessionMeta } from '../../stores/sessionsStore';\n\nfunction Detail({ label, value }: { label: string; value: string }) {\n  return (\n    <div className=\"flex items-center justify-between gap-3\">\n      <span className=\"shrink-0 text-sm text-doom-dim\">{label}</span>\n      <span className=\"truncate text-sm text-doom-text\">{value}</span>\n    </div>\n  );\n}\n\n/** Shown when the focused session refuses this browser connection. */\nexport function RefusedCard() {\n  const meta = useActiveSessionMeta();\n  if (meta === null || meta.attach !== 'refused') return null;\n\n  return (\n    <Dialog open>\n      <DialogContent\n        width=\"lg\"\n        data-testid=\"refused-card\"\n        aria-describedby={undefined}\n        className=\"w-[520px] border-doom-red/50\"\n        onEscapeKeyDown={(event) => event.preventDefault()}\n        onPointerDownOutside={(event) => event.preventDefault()}\n        onInteractOutside={(event) => event.preventDefault()}\n      >\n        <DialogHeader className=\"border-doom-red/40 bg-doom-red/10\">\n          <DialogTitle data-testid=\"refused-title\" className=\"text-doom-red\">\n            session already attached\n          </DialogTitle>\n          <Spinner className=\"text-doom-red/70\" />\n        </DialogHeader>\n        <div className=\"flex flex-col gap-3 px-4 py-4\">\n          <p className=\"text-sm leading-relaxed text-doom-text\">\n            This session is already controlled by another browser connection. Po keeps retrying in the background.\n          </p>\n          <div className=\"flex flex-col gap-1.5 rounded border border-doom-border bg-doom-deep px-3 py-2.5\">\n            <Detail label=\"reason\" value={meta.reason || 'attach_error'} />\n            <Detail label=\"cwd\" value={abbreviateCwd(meta.summary.cwd)} />\n            <Detail label=\"retry\" value=\"automatic, with backoff\" />\n          </div>\n          <p data-testid=\"refused-hint\" className=\"text-sm text-doom-dim\">\n            close the other browser connection and this one takes over on the next attempt.\n          </p>\n        </div>\n      </DialogContent>\n    </Dialog>\n  );\n}\n"],"mappings":";;;;;AAKA,SAAS,OAAO,EAAE,OAAO,SAA2C;CAClE,OACE,iBAAA,GAAA,kBAAA,KAAA,CAAC,OAAD;EAAK,WAAU;EAAf,UAAA,CACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;GAAM,WAAU;GAAkC,UAAA;EAAY,CAAA,GAC9D,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;GAAM,WAAU;GAAmC,UAAA;EAAY,CAAA,CAC5D;;AAET;;AAGA,SAAgB,cAAc;CAC5B,MAAM,OAAOA,sBAAAA,qBAAqB;CAClC,IAAI,SAAS,QAAQ,KAAK,WAAW,WAAW,OAAO;CAEvD,OACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,6BAAAA,QAAD;EAAQ,MAAA;EACN,UAAA,iBAAA,GAAA,kBAAA,KAAA,CAACC,6BAAAA,eAAD;GACE,OAAM;GACN,eAAY;GACZ,oBAAkB,KAAA;GAClB,WAAU;GACV,kBAAkB,UAAU,MAAM,eAAe;GACjD,uBAAuB,UAAU,MAAM,eAAe;GACtD,oBAAoB,UAAU,MAAM,eAAe;GAPrD,UAAA,CASE,iBAAA,GAAA,kBAAA,KAAA,CAACC,6BAAAA,cAAD;IAAc,WAAU;IAAxB,UAAA,CACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,6BAAAA,aAAD;KAAa,eAAY;KAAgB,WAAU;KAAgB,UAAA;IAEtD,CAAA,GACb,iBAAA,GAAA,kBAAA,IAAA,CAACC,6BAAAA,SAAD,EAAS,WAAU,mBAAoB,CAAA,CAC3B;GACd,CAAA,GAAA,iBAAA,GAAA,kBAAA,KAAA,CAAC,OAAD;IAAK,WAAU;IAAf,UAAA;KACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,KAAD;MAAG,WAAU;MAAyC,UAAA;KAEnD,CAAA;KACH,iBAAA,GAAA,kBAAA,KAAA,CAAC,OAAD;MAAK,WAAU;MAAf,UAAA;OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;QAAQ,OAAM;QAAS,OAAO,KAAK,UAAU;OAAiB,CAAA;OAC9D,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;QAAQ,OAAM;QAAM,OAAOC,uBAAAA,cAAc,KAAK,QAAQ,GAAG;OAAI,CAAA;OAC7D,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;QAAQ,OAAM;QAAQ,OAAM;OAA2B,CAAA;MACpD;;KACL,iBAAA,GAAA,kBAAA,IAAA,CAAC,KAAD;MAAG,eAAY;MAAe,WAAU;MAAwB,UAAA;KAE7D,CAAA;IACA;GACQ,CAAA,CAAA;;CACT,CAAA;AAEZ"}

package/dist/web/features/connection/RefusedCard.d.mts

@@ -0,0 +1,5 @@
+//#region src/web/features/connection/RefusedCard.d.ts
+/** Shown when the focused session refuses this browser connection. */
+export declare function RefusedCard(): import("react").JSX.Element | null;
+//#endregion
+//# sourceMappingURL=RefusedCard.d.mts.map

package/dist/web/features/connection/RefusedCard.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RefusedCard.d.mts","names":[],"sources":["../../../../src/web/features/connection/RefusedCard.tsx"],"mappings":";;wBAegB,+BAAW,IAAA"}

package/dist/web/features/connection/RefusedCard.mjs

@@ -0,0 +1,76 @@
+import { abbreviateCwd } from "../../lib/sessionSummary.mjs";
+import { useActiveSessionMeta } from "../../stores/sessionsStore.mjs";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Dialog, DialogContent, DialogHeader, DialogTitle, Spinner } from "@agimon-ai/po-web-components";
+//#region src/web/features/connection/RefusedCard.tsx
+function Detail({ label, value }) {
+	return /* @__PURE__ */ jsxs("div", {
+		className: "flex items-center justify-between gap-3",
+		children: [/* @__PURE__ */ jsx("span", {
+			className: "shrink-0 text-sm text-doom-dim",
+			children: label
+		}), /* @__PURE__ */ jsx("span", {
+			className: "truncate text-sm text-doom-text",
+			children: value
+		})]
+	});
+}
+/** Shown when the focused session refuses this browser connection. */
+function RefusedCard() {
+	const meta = useActiveSessionMeta();
+	if (meta === null || meta.attach !== "refused") return null;
+	return /* @__PURE__ */ jsx(Dialog, {
+		open: true,
+		children: /* @__PURE__ */ jsxs(DialogContent, {
+			width: "lg",
+			"data-testid": "refused-card",
+			"aria-describedby": void 0,
+			className: "w-[520px] border-doom-red/50",
+			onEscapeKeyDown: (event) => event.preventDefault(),
+			onPointerDownOutside: (event) => event.preventDefault(),
+			onInteractOutside: (event) => event.preventDefault(),
+			children: [/* @__PURE__ */ jsxs(DialogHeader, {
+				className: "border-doom-red/40 bg-doom-red/10",
+				children: [/* @__PURE__ */ jsx(DialogTitle, {
+					"data-testid": "refused-title",
+					className: "text-doom-red",
+					children: "session already attached"
+				}), /* @__PURE__ */ jsx(Spinner, { className: "text-doom-red/70" })]
+			}), /* @__PURE__ */ jsxs("div", {
+				className: "flex flex-col gap-3 px-4 py-4",
+				children: [
+					/* @__PURE__ */ jsx("p", {
+						className: "text-sm leading-relaxed text-doom-text",
+						children: "This session is already controlled by another browser connection. Po keeps retrying in the background."
+					}),
+					/* @__PURE__ */ jsxs("div", {
+						className: "flex flex-col gap-1.5 rounded border border-doom-border bg-doom-deep px-3 py-2.5",
+						children: [
+							/* @__PURE__ */ jsx(Detail, {
+								label: "reason",
+								value: meta.reason || "attach_error"
+							}),
+							/* @__PURE__ */ jsx(Detail, {
+								label: "cwd",
+								value: abbreviateCwd(meta.summary.cwd)
+							}),
+							/* @__PURE__ */ jsx(Detail, {
+								label: "retry",
+								value: "automatic, with backoff"
+							})
+						]
+					}),
+					/* @__PURE__ */ jsx("p", {
+						"data-testid": "refused-hint",
+						className: "text-sm text-doom-dim",
+						children: "close the other browser connection and this one takes over on the next attempt."
+					})
+				]
+			})]
+		})
+	});
+}
+//#endregion
+export { RefusedCard };
+
+//# sourceMappingURL=RefusedCard.mjs.map

package/dist/web/features/connection/RefusedCard.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RefusedCard.mjs","names":[],"sources":["../../../../src/web/features/connection/RefusedCard.tsx"],"sourcesContent":["import { Dialog, DialogContent, DialogHeader, DialogTitle, Spinner } from '@agimon-ai/po-web-components';\n\nimport { abbreviateCwd } from '../../lib/sessionSummary';\nimport { useActiveSessionMeta } from '../../stores/sessionsStore';\n\nfunction Detail({ label, value }: { label: string; value: string }) {\n  return (\n    <div className=\"flex items-center justify-between gap-3\">\n      <span className=\"shrink-0 text-sm text-doom-dim\">{label}</span>\n      <span className=\"truncate text-sm text-doom-text\">{value}</span>\n    </div>\n  );\n}\n\n/** Shown when the focused session refuses this browser connection. */\nexport function RefusedCard() {\n  const meta = useActiveSessionMeta();\n  if (meta === null || meta.attach !== 'refused') return null;\n\n  return (\n    <Dialog open>\n      <DialogContent\n        width=\"lg\"\n        data-testid=\"refused-card\"\n        aria-describedby={undefined}\n        className=\"w-[520px] border-doom-red/50\"\n        onEscapeKeyDown={(event) => event.preventDefault()}\n        onPointerDownOutside={(event) => event.preventDefault()}\n        onInteractOutside={(event) => event.preventDefault()}\n      >\n        <DialogHeader className=\"border-doom-red/40 bg-doom-red/10\">\n          <DialogTitle data-testid=\"refused-title\" className=\"text-doom-red\">\n            session already attached\n          </DialogTitle>\n          <Spinner className=\"text-doom-red/70\" />\n        </DialogHeader>\n        <div className=\"flex flex-col gap-3 px-4 py-4\">\n          <p className=\"text-sm leading-relaxed text-doom-text\">\n            This session is already controlled by another browser connection. Po keeps retrying in the background.\n          </p>\n          <div className=\"flex flex-col gap-1.5 rounded border border-doom-border bg-doom-deep px-3 py-2.5\">\n            <Detail label=\"reason\" value={meta.reason || 'attach_error'} />\n            <Detail label=\"cwd\" value={abbreviateCwd(meta.summary.cwd)} />\n            <Detail label=\"retry\" value=\"automatic, with backoff\" />\n          </div>\n          <p data-testid=\"refused-hint\" className=\"text-sm text-doom-dim\">\n            close the other browser connection and this one takes over on the next attempt.\n          </p>\n        </div>\n      </DialogContent>\n    </Dialog>\n  );\n}\n"],"mappings":";;;;;AAKA,SAAS,OAAO,EAAE,OAAO,SAA2C;CAClE,OACE,qBAAC,OAAD;EAAK,WAAU;EAAf,UAAA,CACE,oBAAC,QAAD;GAAM,WAAU;GAAkC,UAAA;EAAY,CAAA,GAC9D,oBAAC,QAAD;GAAM,WAAU;GAAmC,UAAA;EAAY,CAAA,CAC5D;;AAET;;AAGA,SAAgB,cAAc;CAC5B,MAAM,OAAO,qBAAqB;CAClC,IAAI,SAAS,QAAQ,KAAK,WAAW,WAAW,OAAO;CAEvD,OACE,oBAAC,QAAD;EAAQ,MAAA;EACN,UAAA,qBAAC,eAAD;GACE,OAAM;GACN,eAAY;GACZ,oBAAkB,KAAA;GAClB,WAAU;GACV,kBAAkB,UAAU,MAAM,eAAe;GACjD,uBAAuB,UAAU,MAAM,eAAe;GACtD,oBAAoB,UAAU,MAAM,eAAe;GAPrD,UAAA,CASE,qBAAC,cAAD;IAAc,WAAU;IAAxB,UAAA,CACE,oBAAC,aAAD;KAAa,eAAY;KAAgB,WAAU;KAAgB,UAAA;IAEtD,CAAA,GACb,oBAAC,SAAD,EAAS,WAAU,mBAAoB,CAAA,CAC3B;GACd,CAAA,GAAA,qBAAC,OAAD;IAAK,WAAU;IAAf,UAAA;KACE,oBAAC,KAAD;MAAG,WAAU;MAAyC,UAAA;KAEnD,CAAA;KACH,qBAAC,OAAD;MAAK,WAAU;MAAf,UAAA;OACE,oBAAC,QAAD;QAAQ,OAAM;QAAS,OAAO,KAAK,UAAU;OAAiB,CAAA;OAC9D,oBAAC,QAAD;QAAQ,OAAM;QAAM,OAAO,cAAc,KAAK,QAAQ,GAAG;OAAI,CAAA;OAC7D,oBAAC,QAAD;QAAQ,OAAM;QAAQ,OAAM;OAA2B,CAAA;MACpD;;KACL,oBAAC,KAAD;MAAG,eAAY;MAAe,WAAU;MAAwB,UAAA;KAE7D,CAAA;IACA;GACQ,CAAA,CAAA;;CACT,CAAA;AAEZ"}