@mcp-b/react-components 0.49.0 → 0.50.0

package/dist/components/agents-sdk/ManagerOffice.js

@@ -1,1147 +1,3 @@
-import { findCatalogMcpServerCard, getMcpServerIconSrc } from "../../utils/mcp-server-catalog.js";
-import { t as cx } from "../../class-names-BiMDVpUo.js";
-import { C as FolderIcon, D as LinkIcon, K as SpinnerIcon, L as PauseIcon, P as MonitorIcon, S as FileIcon, T as InfoIcon, _ as DotIcon, d as CheckIcon, et as WarningIcon, f as ChevronDownIcon, j as MessageSquareIcon, p as ChevronRightIcon, u as CalendarIcon } from "../../icons-cuEtsgj9.js";
-import { Collapsible } from "../foundations/Collapsible.js";
-import { Button } from "../foundations/Button.js";
-import { Tooltip } from "../foundations/Tooltip.js";
-import { EmptyState } from "../foundations/EmptyState.js";
-import { Avatar } from "../foundations/Avatar.js";
-import { AppIcon } from "../foundations/AppIcon.js";
-import { LinkButton } from "../foundations/LinkButton.js";
 import "../foundations/icons.js";
-import { AgentAttention, AgentAttentionActions, AgentAttentionBody, AgentAttentionHeader } from "../ai-sdk/AgentAttention.js";
-import { CorrespondentName, correspondentHandleLabel } from "../ai-sdk/Correspondent.js";
-import { getThinkExecutionRunStatus } from "./ThinkExecutionRun.js";
-import * as React from "react";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { useRender } from "@base-ui/react/use-render";
-import { mergeProps } from "@base-ui/react/merge-props";
-//#region src/components/_internal/chrome-profile-colors.ts
-const PALETTE = [
-	{
-		bg: "#ffab40",
-		fg: "#1f1f1f"
-	},
-	{
-		bg: "#43a047",
-		fg: "#ffffff"
-	},
-	{
-		bg: "#199da9",
-		fg: "#ffffff"
-	},
-	{
-		bg: "#5d93e4",
-		fg: "#ffffff"
-	},
-	{
-		bg: "#ffaebd",
-		fg: "#1f1f1f"
-	},
-	{
-		bg: "#bd165c",
-		fg: "#ffffff"
-	},
-	{
-		bg: "#b71c1c",
-		fg: "#ffffff"
-	},
-	{
-		bg: "#2e7d32",
-		fg: "#ffffff"
-	},
-	{
-		bg: "#006e78",
-		fg: "#ffffff"
-	},
-	{
-		bg: "#1565c0",
-		fg: "#ffffff"
-	},
-	{
-		bg: "#5b3689",
-		fg: "#ffffff"
-	}
-];
-/** FNV-1a, for a stable pick from the same seat across reloads. */
-function hash(seed) {
-	let value = 2166136261;
-	for (let index = 0; index < seed.length; index++) {
-		value ^= seed.charCodeAt(index);
-		value = Math.imul(value, 16777619);
-	}
-	return value >>> 0;
-}
-/**
-* Deterministic Chrome-style profile color for one identity. Pass the set of
-* `bg` values already assigned to the rest of the roster so two profiles only
-* share a color once the palette is exhausted, exactly as Chrome avoids
-* colors in use by other profiles.
-*/
-function chromeProfileColor(seed, taken) {
-	const start = hash(seed) % PALETTE.length;
-	for (let offset = 0; offset < PALETTE.length; offset++) {
-		const candidate = PALETTE[(start + offset) % PALETTE.length];
-		if (!taken?.has(candidate.bg)) return candidate;
-	}
-	return PALETTE[start];
-}
-//#endregion
-//#region src/components/agents-sdk/ManagerOffice.tsx
-const OfficeContext = React.createContext(null);
-const EmployeeContext = React.createContext(null);
-function useOffice() {
-	const value = React.useContext(OfficeContext);
-	if (!value) throw new Error("ManagerOffice parts require ManagerOffice.Root.");
-	return value;
-}
-function useEmployee() {
-	const value = React.useContext(EmployeeContext);
-	if (!value) throw new Error("Employee parts require ManagerOffice.Employee.");
-	return value;
-}
-const statusLabels = {
-	"needs-you": "Waiting on you",
-	working: "Working",
-	idle: "Idle",
-	issue: "Waiting on you",
-	offline: "Offline",
-	connecting: "Connecting…",
-	unavailable: "Unavailable"
-};
-/**
-* Named positively, so a status added to the union later is disconnected until
-* someone says otherwise. The negative form — "not offline, connecting, or
-* unavailable" — silently admits every new status, and the first thing this
-* component does with a connected employee is read `handoffs`, which a
-* disconnected one does not carry.
-*/
-const CONNECTED_STATUSES = {
-	"needs-you": true,
-	working: true,
-	idle: true,
-	issue: true
-};
-function isConnected(employee) {
-	return employee.status in CONNECTED_STATUSES;
-}
-function employeeAttentionCount(employee) {
-	return isConnected(employee) ? employee.handoffs.length : 0;
-}
-/** The roster spells out what its handoff count measures. */
-function employeeStatusText(employee) {
-	const count = employeeAttentionCount(employee);
-	const label = statusLabels[employee.status];
-	return count ? `${label} · ${count} handoff${count === 1 ? "" : "s"}` : label;
-}
-function EmployeePresence({ employee }) {
-	return /* @__PURE__ */ jsx("span", {
-		className: "manager-office__nav-status",
-		"data-status": employee.status,
-		"aria-hidden": "true"
-	});
-}
-/**
-* Each employee is a Chrome profile, so the bubble wears its profile color —
-* the same palette Chrome assigns profiles from. Chrome's pick is per-machine
-* state the host can't read, so the roster re-derives it: a stable hash per
-* seat, skipping colors already worn by earlier roster entries the way Chrome
-* skips colors in use by other profiles.
-*/
-function rosterProfileColors(employees) {
-	const taken = /* @__PURE__ */ new Set();
-	const colors = /* @__PURE__ */ new Map();
-	for (const employee of employees) {
-		const color = chromeProfileColor(employee.id, taken);
-		taken.add(color.bg);
-		colors.set(employee.id, color);
-	}
-	return colors;
-}
-function EmployeeAvatar({ color, employee, index = 0, size = "sm" }) {
-	const variant = index % 4;
-	return /* @__PURE__ */ jsx(Avatar.Root, {
-		size,
-		shape: "rounded",
-		className: "manager-office__employee-character",
-		"aria-hidden": "true",
-		children: /* @__PURE__ */ jsxs(Avatar.Fallback, {
-			className: "manager-office__employee-character-fallback",
-			style: {
-				color: color.fg,
-				backgroundColor: "transparent"
-			},
-			children: [/* @__PURE__ */ jsxs("svg", {
-				viewBox: "0 0 36 36",
-				focusable: "false",
-				role: "presentation",
-				style: { fill: color.bg },
-				children: [
-					/* @__PURE__ */ jsx("rect", {
-						x: "5",
-						y: "6",
-						width: "26",
-						height: "25",
-						rx: "7"
-					}),
-					/* @__PURE__ */ jsx("rect", {
-						x: "8",
-						y: "28",
-						width: "8",
-						height: "5",
-						rx: "2.5",
-						opacity: "0.78"
-					}),
-					/* @__PURE__ */ jsx("rect", {
-						x: "20",
-						y: "28",
-						width: "8",
-						height: "5",
-						rx: "2.5",
-						opacity: "0.78"
-					}),
-					variant === 0 ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("path", { d: "M10 7c.6-3 3.2-5 6.2-5h3.6c3 0 5.6 2 6.2 5Z" }), /* @__PURE__ */ jsx("circle", {
-						cx: "18",
-						cy: "3",
-						r: "1.8"
-					})] }) : variant === 1 ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("rect", {
-						x: "2.5",
-						y: "13",
-						width: "4",
-						height: "10",
-						rx: "2"
-					}), /* @__PURE__ */ jsx("rect", {
-						x: "29.5",
-						y: "13",
-						width: "4",
-						height: "10",
-						rx: "2"
-					})] }) : variant === 2 ? /* @__PURE__ */ jsx("path", {
-						d: "M11 6V3.5h14V6M15 3.5V1.5h6v2",
-						fill: "none",
-						stroke: color.bg,
-						strokeWidth: "2",
-						strokeLinecap: "round",
-						strokeLinejoin: "round"
-					}) : /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("path", { d: "M12 7V3l4 3 4-4 4 5Z" }), /* @__PURE__ */ jsx("circle", {
-						cx: "26.5",
-						cy: "7",
-						r: "2"
-					})] }),
-					/* @__PURE__ */ jsx("g", {
-						className: "manager-office__employee-character-face",
-						fill: color.fg,
-						children: variant === 1 ? /* @__PURE__ */ jsxs(Fragment, { children: [
-							/* @__PURE__ */ jsx("rect", {
-								className: "manager-office__employee-character-visor",
-								x: "10",
-								y: "14",
-								width: "16",
-								height: "8",
-								rx: "4",
-								opacity: "0.94"
-							}),
-							/* @__PURE__ */ jsx("circle", {
-								cx: "14",
-								cy: "18",
-								r: "1.5",
-								fill: color.bg
-							}),
-							/* @__PURE__ */ jsx("circle", {
-								cx: "22",
-								cy: "18",
-								r: "1.5",
-								fill: color.bg
-							})
-						] }) : variant === 3 ? /* @__PURE__ */ jsxs("g", {
-							className: "manager-office__employee-character-glasses",
-							children: [
-								/* @__PURE__ */ jsx("circle", {
-									className: "manager-office__employee-character-lens",
-									cx: "13.5",
-									cy: "17",
-									r: "3"
-								}),
-								/* @__PURE__ */ jsx("circle", {
-									className: "manager-office__employee-character-lens",
-									cx: "22.5",
-									cy: "17",
-									r: "3"
-								}),
-								/* @__PURE__ */ jsx("path", {
-									className: "manager-office__employee-character-bridge",
-									d: "M16.5 17h3"
-								})
-							]
-						}) : /* @__PURE__ */ jsxs(Fragment, { children: [
-							/* @__PURE__ */ jsx("circle", {
-								cx: "13.5",
-								cy: "17",
-								r: "3.2"
-							}),
-							/* @__PURE__ */ jsx("circle", {
-								cx: "22.5",
-								cy: "17",
-								r: "3.2"
-							}),
-							/* @__PURE__ */ jsx("circle", {
-								cx: "14.5",
-								cy: "16",
-								r: "1",
-								fill: color.bg,
-								opacity: "0.72"
-							}),
-							/* @__PURE__ */ jsx("circle", {
-								cx: "23.5",
-								cy: "16",
-								r: "1",
-								fill: color.bg,
-								opacity: "0.72"
-							})
-						] })
-					}),
-					/* @__PURE__ */ jsx("path", {
-						className: "manager-office__employee-character-shine",
-						d: "M9 11c2-2 4.7-3 7.7-3",
-						fill: "none",
-						stroke: color.fg,
-						strokeWidth: "1.5",
-						strokeLinecap: "round"
-					})
-				]
-			}), /* @__PURE__ */ jsx("span", {
-				className: "sigvelo-visually-hidden",
-				children: employee.initials
-			})]
-		})
-	});
-}
-/**
-* One glyph per manager action, not one glyph per backend state. Both an
-* employee asking for a person (`needs-you`) and one blocked by an issue
-* (`issue`) require the same response here, so the roster presents both as
-* "Waiting on you" with the warning glyph. An unreachable employee remains a
-* distinct shape because there is no work for the manager to resume yet.
-*
-* `working` and `connecting` deliberately share the spinner: both mean "in
-* motion, wait", and mistaking one for the other costs the manager nothing.
-*/
-function ThreadStatusIcon({ status }) {
-	return /* @__PURE__ */ jsx("span", {
-		className: "manager-office__thread-status",
-		"data-status": status,
-		"aria-hidden": "true",
-		children: status === "running" ? /* @__PURE__ */ jsx(SpinnerIcon, {}) : status === "error" ? /* @__PURE__ */ jsx(WarningIcon, {}) : status === "interrupted" ? /* @__PURE__ */ jsx(PauseIcon, {}) : /* @__PURE__ */ jsx(DotIcon, {})
-	});
-}
-function threadStatusLabel(status) {
-	if (status === "attention") return "Update ready";
-	if (status === "running") return "Working";
-	if (status === "error") return "Issue";
-	if (status === "interrupted") return "Stopped";
-	return "Updated";
-}
-function relativeTime(timestamp, now) {
-	const elapsed = Math.max(0, now - timestamp);
-	const minute = 6e4;
-	const hour = 60 * minute;
-	const day = 24 * hour;
-	if (elapsed < minute) return "now";
-	if (elapsed < hour) return `${Math.floor(elapsed / minute)}m`;
-	if (elapsed < day) return `${Math.floor(elapsed / hour)}h`;
-	return `${Math.floor(elapsed / day)}d`;
-}
-function Timestamp({ now, timestamp }) {
-	const date = new Date(timestamp);
-	return /* @__PURE__ */ jsx("time", {
-		dateTime: date.toISOString(),
-		title: date.toLocaleString(),
-		children: relativeTime(timestamp, now)
-	});
-}
-/**
-* Deliberately the same three glyphs the employee statuses use: a channel that
-* needs a sign-in is the same kind of event as an employee that needs one, and
-* a manager should not have to learn a second vocabulary for it.
-*/
-function channelStatusIcon(status) {
-	if (status === "connected") return /* @__PURE__ */ jsx(CheckIcon, {});
-	if (status === "needs-auth") return /* @__PURE__ */ jsx(InfoIcon, {});
-	return /* @__PURE__ */ jsx(WarningIcon, {});
-}
-const channelStatusLabels = {
-	connected: "Connected",
-	"needs-auth": "Needs sign-in",
-	error: "Error"
-};
-function ChannelMark({ channel }) {
-	if (channel.icon) return /* @__PURE__ */ jsx("span", {
-		className: "manager-office__channel-mark",
-		children: channel.icon
-	});
-	const card = findCatalogMcpServerCard({
-		id: channel.id,
-		name: channel.name
-	});
-	const src = card ? getMcpServerIconSrc(card) : void 0;
-	if (src) return /* @__PURE__ */ jsx("span", {
-		className: "manager-office__channel-mark",
-		children: /* @__PURE__ */ jsx("img", {
-			alt: "",
-			className: "sigvelo-brand-mark sigvelo-brand-mark--colorful",
-			decoding: "async",
-			referrerPolicy: "no-referrer",
-			src
-		})
-	});
-	return /* @__PURE__ */ jsx(AppIcon.Fallback, { children: channel.name.slice(0, 1) });
-}
-function ChannelRow({ channel }) {
-	return /* @__PURE__ */ jsxs("li", {
-		className: "manager-office__channel",
-		"data-status": channel.status,
-		children: [
-			/* @__PURE__ */ jsx(AppIcon.Root, {
-				size: "sm",
-				"aria-hidden": "true",
-				children: /* @__PURE__ */ jsx(ChannelMark, { channel })
-			}),
-			/* @__PURE__ */ jsxs("span", {
-				className: "manager-office__identity",
-				children: [/* @__PURE__ */ jsx("strong", {
-					className: "sigvelo-truncate",
-					children: channel.name
-				}), /* @__PURE__ */ jsx("small", {
-					className: "sigvelo-truncate",
-					children: channel.detail ?? channelStatusLabels[channel.status]
-				})]
-			}),
-			/* @__PURE__ */ jsxs("span", {
-				className: "manager-office__channel-status",
-				"data-status": channel.status,
-				title: channelStatusLabels[channel.status],
-				children: [channelStatusIcon(channel.status), /* @__PURE__ */ jsx("span", {
-					className: "sigvelo-visually-hidden",
-					children: channelStatusLabels[channel.status]
-				})]
-			})
-		]
-	});
-}
-/**
-* A handoff is the one thing on this surface that is waiting on a person, so
-* it gets the surface built for that — `AgentAttention` in its warning tone —
-* rather than another ghost row indistinguishable from the work beneath it.
-* The action is a link into the owning work, because that is where the single
-* approval surface lives; nothing is approved or dismissed from the roster.
-*/
-function HandoffCard({ employee, handoff, renderLink, now, showEmployee }) {
-	return /* @__PURE__ */ jsxs(AgentAttention, {
-		tone: "attention",
-		className: cx("manager-office__handoff", !handoff.request && "manager-office__handoff--bare"),
-		children: [
-			/* @__PURE__ */ jsx(AgentAttentionHeader, {
-				icon: /* @__PURE__ */ jsx(InfoIcon, {}),
-				title: handoff.reason,
-				description: /* @__PURE__ */ jsxs(Fragment, { children: [
-					showEmployee ? `${employee.name} · ` : null,
-					handoff.workTitle,
-					" · ",
-					/* @__PURE__ */ jsx(Timestamp, {
-						timestamp: handoff.createdAt,
-						now
-					})
-				] })
-			}),
-			handoff.request ? /* @__PURE__ */ jsx(AgentAttentionBody, {
-				className: "manager-office__handoff-ask",
-				children: handoff.request
-			}) : null,
-			/* @__PURE__ */ jsx(AgentAttentionActions, { children: /* @__PURE__ */ jsxs(LinkButton, {
-				render: renderLink({
-					kind: "handoff",
-					employee,
-					handoff
-				}),
-				size: "sm",
-				"aria-label": `Open ${handoff.workTitle} to ${handoff.reason.toLowerCase()}`,
-				children: [/* @__PURE__ */ jsx(MonitorIcon, {}), "Open browser"]
-			}) })
-		]
-	});
-}
-/** Dense nested action for an employee alert already signalled by the roster status. */
-function ManagerOfficeSidebarAlert({ className, detail, title, ...props }) {
-	return /* @__PURE__ */ jsxs(LinkButton, {
-		variant: "ghost",
-		color: "neutral",
-		size: "sm",
-		className: cx("manager-office__sidebar-alert", className),
-		...props,
-		children: [/* @__PURE__ */ jsxs("span", {
-			className: "manager-office__sidebar-alert-copy",
-			children: [/* @__PURE__ */ jsx("strong", { children: title }), /* @__PURE__ */ jsxs("span", {
-				className: "manager-office__sidebar-alert-meta",
-				children: [detail ? /* @__PURE__ */ jsx("small", { children: detail }) : null, /* @__PURE__ */ jsx("span", {
-					className: "manager-office__sidebar-alert-status",
-					children: "Blocked"
-				})]
-			})]
-		}), /* @__PURE__ */ jsx(ChevronRightIcon, {
-			className: "manager-office__sidebar-alert-chevron",
-			"aria-hidden": "true"
-		})]
-	});
-}
-/**
-* Shared Manager Office rail. Stories and host shells may add employee-owned
-* content, but the Workforce header, roster identity, status language, scrolling,
-* and footer placement stay component-owned and therefore cannot drift.
-*/
-function moveRosterFocus(event, layout) {
-	const nextKey = layout === "office" ? "ArrowDown" : "ArrowRight";
-	const prevKey = layout === "office" ? "ArrowUp" : "ArrowLeft";
-	if (event.key !== nextKey && event.key !== prevKey && event.key !== "Home" && event.key !== "End") return;
-	const links = [...event.currentTarget.querySelectorAll("a[href], button")];
-	const index = links.findIndex((link) => link === document.activeElement);
-	if (index < 0) return;
-	event.preventDefault();
-	const last = links.length - 1;
-	links[event.key === "Home" ? 0 : event.key === "End" ? last : event.key === nextKey ? Math.min(last, index + 1) : Math.max(0, index - 1)]?.focus();
-}
-function ManagerOfficeSidebar({ className, closeSidebarOnCompact, content, employees, renderLink, footer, layout = "office", officeActions, selectedEmployeeId, ...props }) {
-	const rosterLabelId = React.useId();
-	const profileColors = rosterProfileColors(employees);
-	const isChat = layout === "chat";
-	return /* @__PURE__ */ jsx(Tooltip.Provider, { children: /* @__PURE__ */ jsxs("nav", {
-		className: cx("manager-office__sidebar", className),
-		"aria-label": "Workforce",
-		"data-layout": layout,
-		...props,
-		children: [
-			/* @__PURE__ */ jsxs("div", {
-				className: "manager-office__sidebar-heading",
-				children: [isChat ? null : /* @__PURE__ */ jsx("strong", { children: "Workforce" }), officeActions ? /* @__PURE__ */ jsx("span", {
-					className: "manager-office__sidebar-actions",
-					children: officeActions
-				}) : null]
-			}),
-			/* @__PURE__ */ jsx("p", {
-				className: "manager-office__nav-label sigvelo-visually-hidden",
-				id: rosterLabelId,
-				children: "Employees"
-			}),
-			/* @__PURE__ */ jsx("ul", {
-				className: "manager-office__employee-nav",
-				role: "list",
-				"aria-labelledby": rosterLabelId,
-				onKeyDown: (event) => moveRosterFocus(event, layout),
-				children: employees.map((employee, index) => {
-					const selected = selectedEmployeeId === employee.id;
-					const status = employeeStatusText(employee);
-					return /* @__PURE__ */ jsx("li", {
-						className: "manager-office__employee-group",
-						children: /* @__PURE__ */ jsxs(LinkButton, {
-							render: renderLink({
-								kind: "employee",
-								employee
-							}),
-							onClick: closeSidebarOnCompact,
-							variant: "ghost",
-							color: "neutral",
-							size: "sm",
-							className: "manager-office__employee-link",
-							"aria-current": selected ? "page" : void 0,
-							"aria-label": `Open ${employee.name} · ${status}`,
-							title: isChat ? `${employee.name} · ${status}` : void 0,
-							children: [/* @__PURE__ */ jsxs("span", {
-								className: "manager-office__employee-avatar",
-								children: [/* @__PURE__ */ jsx(EmployeeAvatar, {
-									employee,
-									color: profileColors.get(employee.id),
-									index,
-									size: isChat ? "sm" : "md"
-								}), /* @__PURE__ */ jsx(EmployeePresence, { employee })]
-							}), isChat ? null : /* @__PURE__ */ jsxs("span", {
-								className: "manager-office__identity",
-								children: [/* @__PURE__ */ jsx("strong", {
-									className: "sigvelo-truncate",
-									children: employee.name
-								}), /* @__PURE__ */ jsx("small", {
-									className: "sigvelo-truncate",
-									children: statusLabels[employee.status]
-								})]
-							})]
-						})
-					}, employee.id);
-				})
-			}),
-			content ? /* @__PURE__ */ jsx("div", {
-				className: "manager-office__sidebar-content",
-				children: content
-			}) : null,
-			footer ? /* @__PURE__ */ jsx("div", {
-				className: "manager-office__sidebar-footer",
-				children: footer
-			}) : null
-		]
-	}) });
-}
-function isReviewWork(work) {
-	return work.status === "attention" || work.status === "error";
-}
-/** Finished or failed work the manager should open in chat — not a live-tab wait. */
-function reviewWorkFor(employee) {
-	const waiting = new Set(employee.handoffs.map((handoff) => handoff.workId));
-	return employee.work.filter((work) => isReviewWork(work) && !waiting.has(work.id));
-}
-function workingSetOf(work) {
-	return work.workingSet ?? [];
-}
-function workingSetKey(item) {
-	if (item.kind === "file" || item.kind === "folder") return `${item.kind}:${item.path}`;
-	if (item.kind === "link") return `link:${item.href}`;
-	return `correspondent:${correspondentHandleLabel(item.correspondent.handle)}`;
-}
-function safeHttpUrl(url) {
-	try {
-		const parsed = new URL(url);
-		if (parsed.protocol !== "https:" && parsed.protocol !== "http:") return void 0;
-		return parsed.href;
-	} catch {
-		return;
-	}
-}
-function providerCardForHref(href) {
-	let parsed;
-	try {
-		parsed = new URL(href);
-	} catch {
-		return;
-	}
-	const host = parsed.hostname.toLowerCase();
-	if (host === "docs.google.com" || host.endsWith(".docs.google.com")) {
-		if (parsed.pathname.includes("/spreadsheets/")) return findCatalogMcpServerCard({ id: "google-sheets" });
-		if (parsed.pathname.includes("/document/")) return findCatalogMcpServerCard({ id: "google-docs" });
-		if (parsed.pathname.includes("/presentation/")) return findCatalogMcpServerCard({ id: "google-slides" });
-	}
-	if (host === "drive.google.com" || host.endsWith(".drive.google.com")) return findCatalogMcpServerCard({ id: "google-drive" });
-}
-function workingSetLinkDetail(item) {
-	const card = providerCardForHref(item.href);
-	if (card) return card.name;
-	try {
-		return new URL(item.href).hostname.replace(/^www\./u, "");
-	} catch {
-		return item.href;
-	}
-}
-function WorkingSetMark({ item }) {
-	if (item.kind === "file") return /* @__PURE__ */ jsx(FileIcon, {});
-	if (item.kind === "folder") return /* @__PURE__ */ jsx(FolderIcon, {});
-	const card = providerCardForHref(item.href);
-	const src = card ? getMcpServerIconSrc(card) : void 0;
-	if (src) return /* @__PURE__ */ jsxs(AppIcon.Root, {
-		size: "xs",
-		variant: "artwork",
-		"aria-hidden": "true",
-		children: [/* @__PURE__ */ jsx(AppIcon.Image, {
-			src,
-			alt: ""
-		}), /* @__PURE__ */ jsx(AppIcon.Fallback, { children: (card?.name ?? item.title).slice(0, 1) })]
-	});
-	return /* @__PURE__ */ jsx(LinkIcon, {});
-}
-function routineDetail(routine) {
-	const schedule = routine.enabled ? routine.task.schedule : `Paused · ${routine.task.schedule}`;
-	const finishedRuns = routine.runs.filter((run) => run.completedAt != null);
-	if (!finishedRuns.length) return schedule;
-	return `${schedule} · ${finishedRuns.filter((run) => {
-		const status = getThinkExecutionRunStatus(run);
-		return status === "completed" || status === "complete";
-	}).length} of ${finishedRuns.length} recent runs completed`;
-}
-/**
-* Where a work link sits decides whether it draws its own surface: a row in a
-* work list is a bounded row, while a lane heading sits inside the lane card,
-* which already draws one.
-*/
-const workLinkClassNames = {
-	row: "manager-office__work-link",
-	lane: "manager-office__lane-title"
-};
-/** The link onto a work thread, shared by standalone rows and lane headings. */
-function WorkLink({ employee, placement, renderLink, now, showEmployee, work }) {
-	return /* @__PURE__ */ jsxs(LinkButton, {
-		render: renderLink({
-			kind: "work",
-			employee,
-			work
-		}),
-		variant: "ghost",
-		color: "neutral",
-		size: "sm",
-		className: workLinkClassNames[placement],
-		"aria-label": `Open ${work.title} to ${threadStatusLabel(work.status).toLowerCase()}`,
-		children: [
-			/* @__PURE__ */ jsx(ThreadStatusIcon, { status: work.status }),
-			/* @__PURE__ */ jsxs("span", {
-				className: "manager-office__identity",
-				children: [/* @__PURE__ */ jsxs("strong", {
-					className: "sigvelo-truncate",
-					children: [work.title, work.status === "attention" ? /* @__PURE__ */ jsx("span", {
-						className: "manager-office__unread-dot",
-						"aria-hidden": "true"
-					}) : null]
-				}), /* @__PURE__ */ jsxs("small", {
-					className: "sigvelo-truncate",
-					children: [
-						showEmployee ? `${employee.name} · ` : null,
-						threadStatusLabel(work.status),
-						" · ",
-						/* @__PURE__ */ jsx(Timestamp, {
-							timestamp: work.updatedAt,
-							now
-						})
-					]
-				})]
-			}),
-			/* @__PURE__ */ jsx(ChevronRightIcon, { className: "manager-office__row-chevron" })
-		]
-	});
-}
-function workingSetItemCaption(item) {
-	if (item.kind === "link") return workingSetLinkDetail(item);
-	return item.kind === "folder" ? "Workspace folder" : "Workspace file";
-}
-function WorkingSetAttachment(props) {
-	const { caption, label, mark, title } = props;
-	const contents = /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("span", {
-		className: "manager-office__working-set-mark",
-		"aria-hidden": "true",
-		children: mark
-	}), /* @__PURE__ */ jsx("strong", {
-		className: "sigvelo-truncate",
-		children: title
-	})] });
-	const link = "href" in props ? /* @__PURE__ */ jsx(LinkButton, {
-		href: props.href,
-		target: "_blank",
-		rel: "noreferrer",
-		variant: "ghost",
-		color: "neutral",
-		size: "sm",
-		className: "manager-office__working-set-link",
-		"aria-label": label,
-		children: contents
-	}) : /* @__PURE__ */ jsx(LinkButton, {
-		render: props.render,
-		variant: "ghost",
-		color: "neutral",
-		size: "sm",
-		className: "manager-office__working-set-link",
-		"aria-label": label,
-		children: contents
-	});
-	return /* @__PURE__ */ jsxs(Tooltip.Root, { children: [/* @__PURE__ */ jsx(Tooltip.Trigger, { render: link }), /* @__PURE__ */ jsx(Tooltip.Portal, { children: /* @__PURE__ */ jsx(Tooltip.Positioner, {
-		side: "bottom",
-		sideOffset: 6,
-		children: /* @__PURE__ */ jsx(Tooltip.Popup, { children: caption })
-	}) })] });
-}
-function WorkingSetItemRow({ employee, item, renderLink, work }) {
-	if (item.kind === "correspondent") return /* @__PURE__ */ jsx("li", {
-		className: "manager-office__working-set-item",
-		children: /* @__PURE__ */ jsx(CorrespondentName, { correspondent: item.correspondent })
-	});
-	const caption = workingSetItemCaption(item);
-	const mark = /* @__PURE__ */ jsx(WorkingSetMark, { item });
-	if (item.kind === "link") {
-		const href = safeHttpUrl(item.href);
-		if (!href) return null;
-		return /* @__PURE__ */ jsx("li", {
-			className: "manager-office__working-set-item",
-			children: /* @__PURE__ */ jsx(WorkingSetAttachment, {
-				caption,
-				label: `${item.title} (${caption}, opens in a new tab)`,
-				href,
-				mark,
-				title: item.title
-			})
-		});
-	}
-	const location = item.kind === "folder" ? "folder" : "file";
-	return /* @__PURE__ */ jsx("li", {
-		className: "manager-office__working-set-item",
-		children: /* @__PURE__ */ jsx(WorkingSetAttachment, {
-			caption,
-			label: `Open ${item.title} ${location} in workspace`,
-			render: renderLink({
-				kind: "workspace",
-				employee,
-				work,
-				path: item.path
-			}),
-			mark,
-			title: item.title
-		})
-	});
-}
-function WorkLane({ employee, now, renderLink, work }) {
-	const titleId = React.useId();
-	const workingSet = workingSetOf(work);
-	return /* @__PURE__ */ jsxs("article", {
-		className: "manager-office__lane",
-		"aria-labelledby": titleId,
-		children: [
-			/* @__PURE__ */ jsx("h3", {
-				id: titleId,
-				className: "manager-office__lane-heading",
-				children: /* @__PURE__ */ jsx(WorkLink, {
-					employee,
-					now,
-					placement: "lane",
-					renderLink,
-					showEmployee: false,
-					work
-				})
-			}),
-			work.summary ? /* @__PURE__ */ jsx("p", {
-				className: "manager-office__lane-summary",
-				children: work.summary
-			}) : null,
-			workingSet.length ? /* @__PURE__ */ jsx("ul", {
-				className: "manager-office__working-set",
-				role: "list",
-				"aria-label": "Working set",
-				children: workingSet.map((item) => /* @__PURE__ */ jsx(WorkingSetItemRow, {
-					employee,
-					item,
-					renderLink,
-					work
-				}, workingSetKey(item)))
-			}) : null
-		]
-	});
-}
-function ManagerOfficeAttention({ className, ...props }) {
-	const { employees, renderLink, now } = useOffice();
-	const waits = employees.flatMap((employee) => isConnected(employee) ? employee.handoffs.map((handoff) => ({
-		employee,
-		handoff
-	})) : []);
-	const reviews = employees.flatMap((employee) => isConnected(employee) ? reviewWorkFor(employee).map((work) => ({
-		employee,
-		work
-	})) : []);
-	if (!waits.length && !reviews.length) return /* @__PURE__ */ jsx("div", {
-		...props,
-		className: cx("manager-office__attention", className),
-		"data-recipe": "page",
-		children: /* @__PURE__ */ jsx(EmptyState, {
-			icon: /* @__PURE__ */ jsx(CheckIcon, {}),
-			title: "Nothing needs you",
-			description: "Employee connection state remains visible in the roster."
-		})
-	});
-	const both = waits.length > 0 && reviews.length > 0;
-	return /* @__PURE__ */ jsxs("div", {
-		...props,
-		className: cx("manager-office__attention", className),
-		"data-recipe": "page",
-		children: [waits.length ? /* @__PURE__ */ jsxs("div", {
-			className: "manager-office__attention-group",
-			children: [both ? /* @__PURE__ */ jsx("h2", {
-				className: "manager-office__section-title",
-				children: "Needs you in the browser"
-			}) : null, /* @__PURE__ */ jsx("ul", {
-				className: "manager-office__attention-list sigvelo-stack-list",
-				"aria-label": "Waiting on you",
-				children: waits.map(({ employee, handoff }) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(HandoffCard, {
-					employee,
-					handoff,
-					renderLink,
-					now,
-					showEmployee: true
-				}) }, `${employee.id}:${handoff.id}`))
-			})]
-		}) : null, reviews.length ? /* @__PURE__ */ jsxs("div", {
-			className: "manager-office__attention-group",
-			children: [/* @__PURE__ */ jsx("h2", {
-				className: "manager-office__section-title",
-				children: "Ready for you"
-			}), /* @__PURE__ */ jsx("ul", {
-				className: "manager-office__work-list sigvelo-stack-list",
-				"aria-label": "Ready for you",
-				children: reviews.map(({ employee, work }) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(WorkLink, {
-					employee,
-					work,
-					placement: "row",
-					renderLink,
-					now,
-					showEmployee: true
-				}) }, `${employee.id}:${work.id}`))
-			})]
-		}) : null]
-	});
-}
-const employeeDefaults = {
-	className: "manager-office__employee-detail",
-	"data-recipe": "page"
-};
-/** Scope the selected employee without imposing dossier content or column order. */
-function ManagerOfficeEmployeeRoot({ employee, render, ref, ...props }) {
-	const element = useRender({
-		defaultTagName: "div",
-		render,
-		ref,
-		props: mergeProps(employeeDefaults, props)
-	});
-	return /* @__PURE__ */ jsx(EmployeeContext.Provider, {
-		value: employee,
-		children: element
-	});
-}
-function ManagerOfficeEmployeeHeader({ className, ...props }) {
-	const employee = useEmployee();
-	const { profileColors } = useOffice();
-	const profileColor = profileColors.get(employee.id) ?? chromeProfileColor(employee.id);
-	return /* @__PURE__ */ jsxs("header", {
-		...props,
-		className: cx("manager-office__employee-header", className),
-		children: [/* @__PURE__ */ jsx(EmployeeAvatar, {
-			employee,
-			color: profileColor,
-			size: "lg"
-		}), /* @__PURE__ */ jsxs("div", {
-			className: "manager-office__briefing",
-			children: [
-				/* @__PURE__ */ jsx("strong", {
-					className: "sigvelo-truncate",
-					children: employee.name
-				}),
-				/* @__PURE__ */ jsx("small", {
-					className: "sigvelo-truncate",
-					children: employee.email
-				}),
-				/* @__PURE__ */ jsx("p", {
-					className: "manager-office__role",
-					children: employee.role
-				})
-			]
-		})]
-	});
-}
-function ManagerOfficeHandoffs({ className, ...props }) {
-	const employee = useEmployee();
-	const { renderLink, now } = useOffice();
-	return employee.handoffs.length ? /* @__PURE__ */ jsx("section", {
-		...props,
-		className: cx("manager-office__employee-handoffs", className),
-		"aria-label": "Waiting on you",
-		children: employee.handoffs.map((handoff) => /* @__PURE__ */ jsx(HandoffCard, {
-			employee,
-			handoff,
-			renderLink,
-			now,
-			showEmployee: false
-		}, handoff.id))
-	}) : null;
-}
-function ManagerOfficeWorkSection({ className, ...props }) {
-	const employee = useEmployee();
-	const { renderLink, now } = useOffice();
-	return /* @__PURE__ */ jsxs("section", {
-		...props,
-		className: cx("manager-office__section", className),
-		children: [/* @__PURE__ */ jsx("header", {
-			className: "manager-office__section-header",
-			children: /* @__PURE__ */ jsxs("h2", {
-				className: "manager-office__section-title",
-				children: [/* @__PURE__ */ jsx(MessageSquareIcon, {}), "Work"]
-			})
-		}), /* @__PURE__ */ jsx("div", {
-			className: "manager-office__section-content",
-			children: employee.work.length ? /* @__PURE__ */ jsx("ul", {
-				className: "manager-office__work-list sigvelo-stack-list",
-				children: employee.work.map((work) => /* @__PURE__ */ jsx("li", { children: workingSetOf(work).length ? /* @__PURE__ */ jsx(WorkLane, {
-					employee,
-					now,
-					renderLink,
-					work
-				}) : /* @__PURE__ */ jsx(WorkLink, {
-					employee,
-					now,
-					placement: "row",
-					renderLink,
-					showEmployee: false,
-					work
-				}) }, work.id))
-			}) : /* @__PURE__ */ jsx("p", {
-				className: "manager-office__section-empty",
-				children: "No work yet."
-			})
-		})]
-	});
-}
-function ManagerOfficeRoutines({ className, ...props }) {
-	const employee = useEmployee();
-	const { renderLink } = useOffice();
-	return /* @__PURE__ */ jsx("section", {
-		...props,
-		className: cx("manager-office__section", className),
-		"aria-label": "Routines",
-		children: /* @__PURE__ */ jsxs(Collapsible.Root, {
-			defaultOpen: true,
-			children: [/* @__PURE__ */ jsxs(Button, {
-				render: /* @__PURE__ */ jsx(Collapsible.Trigger, { unstyled: true }),
-				type: "button",
-				variant: "ghost",
-				color: "neutral",
-				size: "sm",
-				className: "manager-office__routine-trigger",
-				children: [/* @__PURE__ */ jsxs("span", {
-					className: "manager-office__identity",
-					children: [/* @__PURE__ */ jsx(CalendarIcon, {}), /* @__PURE__ */ jsx("strong", { children: "Routines" })]
-				}), /* @__PURE__ */ jsx(ChevronDownIcon, { className: "sigvelo-disclosure-chevron" })]
-			}), /* @__PURE__ */ jsx(Collapsible.Panel, {
-				unstyled: true,
-				children: employee.routines.length ? /* @__PURE__ */ jsx("ul", {
-					className: "manager-office__routine-list sigvelo-stack-list",
-					children: employee.routines.map((routine) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs(LinkButton, {
-						render: renderLink({
-							kind: "routine",
-							employee,
-							routine
-						}),
-						variant: "ghost",
-						color: "neutral",
-						size: "sm",
-						className: "manager-office__routine-link",
-						children: [
-							routine.enabled ? /* @__PURE__ */ jsx(CalendarIcon, {}) : /* @__PURE__ */ jsx(PauseIcon, {}),
-							/* @__PURE__ */ jsxs("span", {
-								className: "manager-office__identity",
-								children: [/* @__PURE__ */ jsx("strong", {
-									className: "sigvelo-truncate",
-									children: routine.name
-								}), /* @__PURE__ */ jsx("small", {
-									className: "sigvelo-truncate",
-									children: routineDetail(routine)
-								})]
-							}),
-							/* @__PURE__ */ jsx(ChevronRightIcon, { className: "manager-office__row-chevron" })
-						]
-					}) }, routine.id))
-				}) : /* @__PURE__ */ jsx("p", {
-					className: "manager-office__section-empty",
-					children: "No routines yet."
-				})
-			})]
-		})
-	});
-}
-function ManagerOfficeChannels({ className, ...props }) {
-	const employee = useEmployee();
-	return /* @__PURE__ */ jsxs("section", {
-		...props,
-		className: cx("manager-office__section", className),
-		children: [/* @__PURE__ */ jsx("header", {
-			className: "manager-office__section-header",
-			children: /* @__PURE__ */ jsxs("h2", {
-				className: "manager-office__section-title",
-				children: [/* @__PURE__ */ jsx(LinkIcon, {}), "Channels"]
-			})
-		}), /* @__PURE__ */ jsx("div", {
-			className: "manager-office__section-content",
-			children: employee.channels.length ? /* @__PURE__ */ jsx("ul", {
-				className: "manager-office__channel-list sigvelo-stack-list",
-				children: employee.channels.map((channel) => /* @__PURE__ */ jsx(ChannelRow, { channel }, channel.id))
-			}) : /* @__PURE__ */ jsx("p", {
-				className: "manager-office__section-empty",
-				children: "Nothing connected yet."
-			})
-		})]
-	});
-}
-function ManagerOfficeMain({ render, ref, ...props }) {
-	return useRender({
-		defaultTagName: "main",
-		render,
-		ref,
-		props: mergeProps({ className: "manager-office__main" }, props)
-	});
-}
-function ManagerOfficeColumns({ render, ref, ...props }) {
-	return useRender({
-		defaultTagName: "div",
-		render,
-		ref,
-		props: mergeProps({ className: "manager-office__employee-columns" }, props)
-	});
-}
-function ManagerOfficeAside({ render, ref, ...props }) {
-	return useRender({
-		defaultTagName: "aside",
-		render,
-		ref,
-		props: mergeProps({ className: "manager-office__employee-aside" }, props)
-	});
-}
-/** Honest disconnected state; the host chooses when and where to display it. */
-function ManagerOfficeConnectionState({ employee }) {
-	return /* @__PURE__ */ jsx("div", {
-		"data-recipe": "page",
-		children: /* @__PURE__ */ jsx(EmptyState, {
-			icon: employee.status === "connecting" ? /* @__PURE__ */ jsx(SpinnerIcon, {}) : /* @__PURE__ */ jsx(MonitorIcon, {}),
-			title: `${employee.name} is ${statusLabels[employee.status].toLowerCase()}`,
-			description: employee.statusDescription
-		})
-	});
-}
-/** Office data and relative-time boundary; hosts compose their shell and routed content. */
-function ManagerOfficeRoot({ employees, renderLink, render, ref, ...props }) {
-	const [now, setNow] = React.useState(Date.now);
-	React.useEffect(() => {
-		const interval = window.setInterval(() => setNow(Date.now()), 6e4);
-		return () => window.clearInterval(interval);
-	}, []);
-	const profileColors = React.useMemo(() => rosterProfileColors(employees), [employees]);
-	const value = React.useMemo(() => ({
-		employees,
-		renderLink,
-		now,
-		profileColors
-	}), [
-		employees,
-		renderLink,
-		now,
-		profileColors
-	]);
-	const element = useRender({
-		defaultTagName: "div",
-		render,
-		ref,
-		props: mergeProps({ className: "manager-office" }, props)
-	});
-	return /* @__PURE__ */ jsx(OfficeContext.Provider, {
-		value,
-		children: /* @__PURE__ */ jsx(Tooltip.Provider, { children: element })
-	});
-}
-const ManagerOffice = {
-	Root: ManagerOfficeRoot,
-	Main: ManagerOfficeMain,
-	Attention: ManagerOfficeAttention,
-	Employee: ManagerOfficeEmployeeRoot,
-	EmployeeHeader: ManagerOfficeEmployeeHeader,
-	Handoffs: ManagerOfficeHandoffs,
-	Columns: ManagerOfficeColumns,
-	Aside: ManagerOfficeAside,
-	Work: ManagerOfficeWorkSection,
-	Routines: ManagerOfficeRoutines,
-	Channels: ManagerOfficeChannels,
-	ConnectionState: ManagerOfficeConnectionState
-};
-//#endregion
+import { n as ManagerOfficeSidebar, r as ManagerOfficeSidebarAlert, t as ManagerOffice } from "../../ManagerOffice-5pEFpoV3.js";
 export { ManagerOffice, ManagerOfficeSidebar, ManagerOfficeSidebarAlert };