@mcp-b/react-components 0.52.0 → 0.53.0

package/dist/{CodeBlock-Bl-q7wMc.js → CodeBlock-Dw1z6jc8.js}

@@ -1,5 +1,5 @@
 import { t as cx } from "./class-names-BiMDVpUo.js";
-import { t as CopyButton } from "./copy-button-CSDuDfdP.js";
+import { t as CopyButton } from "./copy-button-Dk2vRe9j.js";
 import { Select } from "./components/foundations/Select.js";
 import * as React from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";

package/dist/{EmployeeChrome-C8eTGJWn.d.ts → EmployeeChrome-B605rpVz.d.ts}

@@ -100,6 +100,8 @@ type EmployeeAgentRun = {
 interface EmployeeWorkbenchItem {
   id: string;
   label: string;
+  /** Explains the destination on hover and keyboard focus. */
+  description: string;
   icon: React.ReactNode;
 }
 interface EmployeeMenuProps {

package/dist/{FileTree-DruTQ-oa.js → FileTree-okaLnS5j.js}

@@ -1,5 +1,5 @@
 import { t as cx } from "./class-names-BiMDVpUo.js";
-import { C as FolderIcon, S as FileIcon, p as ChevronRightIcon, w as FolderOpenIcon } from "./icons-cuEtsgj9.js";
+import { C as FolderIcon, S as FileIcon, p as ChevronRightIcon, w as FolderOpenIcon } from "./icons-CeGfXO21.js";
 import { t as NavigationLink } from "./navigation-link-kqMa81v5.js";
 import * as React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";

package/dist/{ManagerOffice-CMJ7laGe.js → ManagerOffice-CJwBAEMv.js}

@@ -1,17 +1,17 @@
 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, nt as XIcon, p as ChevronRightIcon, u as CalendarIcon } from "./icons-cuEtsgj9.js";
 import { Collapsible } from "./components/foundations/Collapsible.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, nt as XIcon, p as ChevronRightIcon, u as CalendarIcon } from "./icons-CeGfXO21.js";
 import { Button } from "./components/foundations/Button.js";
+import { AgentAttention, AgentAttentionActions, AgentAttentionBody, AgentAttentionHeader } from "./components/ai-sdk/AgentAttention.js";
 import { Tooltip } from "./components/foundations/Tooltip.js";
+import { Avatar } from "./components/foundations/Avatar.js";
+import { CorrespondentName, correspondentHandleLabel } from "./components/ai-sdk/Correspondent.js";
 import { EmptyState } from "./components/foundations/EmptyState.js";
 import { AppTopBar } from "./components/general-purpose/AppTopBar.js";
-import { Avatar } from "./components/foundations/Avatar.js";
 import { AppIcon } from "./components/foundations/AppIcon.js";
 import { LinkButton } from "./components/foundations/LinkButton.js";
 import { getThinkExecutionRunStatus } from "./components/agents-sdk/ThinkExecutionRun.js";
-import { AgentAttention, AgentAttentionActions, AgentAttentionBody, AgentAttentionHeader } from "./components/ai-sdk/AgentAttention.js";
-import { CorrespondentName, correspondentHandleLabel } from "./components/ai-sdk/Correspondent.js";
 import * as React from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { useRender } from "@base-ui/react/use-render";

package/dist/{SetupChecklist-BiWQkKEq.js → SetupChecklist-DWyifWWg.js}

@@ -1,7 +1,7 @@
 import { n as mergeBaseClassName } from "./class-names-BiMDVpUo.js";
-import { B as PlusIcon, d as CheckIcon, et as WarningIcon, f as ChevronDownIcon } from "./icons-cuEtsgj9.js";
-import { IconButton } from "./components/foundations/IconButton.js";
+import { B as PlusIcon, d as CheckIcon, et as WarningIcon, f as ChevronDownIcon } from "./icons-CeGfXO21.js";
 import { Menu } from "./components/foundations/Menu.js";
+import { IconButton } from "./components/foundations/IconButton.js";
 import * as React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/_internal/menu-disclosure-group.tsx

package/dist/{WorkspaceFileView-DXgTljKV.js → WorkspaceFileView-DQDWUpAH.js}

@@ -1,7 +1,7 @@
-import { b as EyeIcon, d as CheckIcon, et as WarningIcon, k as MaximizeIcon, m as CodeIcon, r as ArrowLeftIcon, v as DownloadIcon } from "./icons-cuEtsgj9.js";
+import { b as EyeIcon, d as CheckIcon, et as WarningIcon, k as MaximizeIcon, m as CodeIcon, r as ArrowLeftIcon, v as DownloadIcon } from "./icons-CeGfXO21.js";
 import { i as formatClock } from "./format-COCyV98Z.js";
+import { a as CodeBlockCopyButton, i as CodeBlockContent, r as CodeBlockContainer, t as CodeBlock } from "./CodeBlock-Dw1z6jc8.js";
 import { AppTopBar } from "./components/general-purpose/AppTopBar.js";
-import { a as CodeBlockCopyButton, i as CodeBlockContent, r as CodeBlockContainer, t as CodeBlock } from "./CodeBlock-Bl-q7wMc.js";
 import { inferWorkspaceLanguage, inferWorkspaceMedia, isWorkspaceMarkdownPath, isWorkspaceSkillPath, parseWorkspaceSkill } from "./components/agents-sdk/WorkspaceFile.js";
 import { i as useWorkspaceNavigationContext } from "./WorkspaceLink-BYZG-V_I.js";
 import { useWorkspaceNavigationRestoration } from "./components/agents-sdk/WorkspaceNavigationRestoration.js";

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

@@ -1,5 +1,5 @@
 import { canRequestFavicon, inferFaviconUrl } from "../../utils/favicon.js";
-import { D as LinkIcon, P as MonitorIcon, R as PencilIcon, S as FileIcon, T as InfoIcon, U as SearchIcon, Z as TerminalIcon, et as WarningIcon, tt as WrenchIcon } from "../../icons-cuEtsgj9.js";
+import { D as LinkIcon, P as MonitorIcon, R as PencilIcon, S as FileIcon, T as InfoIcon, U as SearchIcon, Z as TerminalIcon, et as WarningIcon, tt as WrenchIcon } from "../../icons-CeGfXO21.js";
 import * as React from "react";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/agents-sdk/AgentActivity.tsx

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

@@ -1,24 +1,23 @@
 import { t as cx } from "../../class-names-BiMDVpUo.js";
-import { H as RefreshIcon, K as SpinnerIcon, Q as TrashIcon, R as PencilIcon, t as ArchiveIcon } from "../../icons-cuEtsgj9.js";
 import { ExpansionStateProvider } from "../ai-sdk/ExpansionState.js";
+import { H as RefreshIcon, K as SpinnerIcon, Q as TrashIcon, R as PencilIcon, t as ArchiveIcon } from "../../icons-CeGfXO21.js";
+import { AgentChatMessageEditor } from "../ai-sdk/AgentChatMessageEditor.js";
+import { PromptInput, PromptInputSubmit, PromptInputTray, composerLinksToReferences, usePromptInputController } from "../ai-sdk/PromptInput.js";
 import { Message, MessageAction, MessageActions, MessageCopyAction, MessageMeta, MessageTimestamp } from "../ai-sdk/Message.js";
-import { AgentEventRow, getAgentEvent } from "./AgentEvent.js";
-import { AgentChatQueueProvider, useOptionalAgentChatQueue } from "./AgentChatQueue.js";
 import { AgentMessageParts } from "../ai-sdk/AgentMessageParts.js";
-import { AgentChatMessageEditor } from "../ai-sdk/AgentChatMessageEditor.js";
+import { Marker, MarkerContent } from "../foundations/Marker.js";
 import { VirtualMessageScroller } from "../ai-sdk/MessageScrollerVirtual.js";
-import { PromptInput, PromptInputSubmit, PromptInputTray, composerLinksToReferences, usePromptInputController } from "../ai-sdk/PromptInput.js";
 import { Queue, QueueItem, QueueItemAction, QueueItemActions, QueueItemContent, QueueItemIndicator, QueueList } from "../ai-sdk/Queue.js";
+import { AgentEventRow, getAgentEvent } from "./AgentEvent.js";
+import { AgentChatQueueProvider, useOptionalAgentChatQueue } from "./AgentChatQueue.js";
 import { PromptInputApproval, getApprovalStateKey, getPendingToolApprovals } from "./PromptInputApproval.js";
 import { BrandLoading } from "../general-purpose/BrandLoading.js";
-import { Marker, MarkerContent } from "../foundations/Marker.js";
-import { TransitionSurface } from "../foundations/TransitionSurface.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";
-import { isCompactionMessage } from "agents/experimental/memory/utils";
 import { isTextUIPart } from "ai";
+import { isCompactionMessage } from "agents/experimental/memory/utils";
 //#region src/components/agents-sdk/AgentChat.tsx
 function observeAgentChatDock(element) {
 	if (!element || typeof ResizeObserver === "undefined") return;
@@ -114,9 +113,8 @@ function AgentChatRuntimeRoot({ messages, status = "ready", onRegenerate, onEdit
 	]);
 	return /* @__PURE__ */ jsx(AgentChatContext.Provider, {
 		value,
-		children: /* @__PURE__ */ jsxs(TransitionSurface, {
+		children: /* @__PURE__ */ jsxs("div", {
 			ref,
-			variant: "fade",
 			className: cx("agent-chat", className),
 			"data-recipe": "fill-host",
 			...props,

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

@@ -1,4 +1,4 @@
-import { E as KeyboardIcon, H as RefreshIcon, r as ArrowLeftIcon } from "../../icons-cuEtsgj9.js";
+import { E as KeyboardIcon, H as RefreshIcon, r as ArrowLeftIcon } from "../../icons-CeGfXO21.js";
 import { Button } from "../foundations/Button.js";
 import { WebPreviewNavigationButton } from "../general-purpose/WebPreview.js";
 import { BrowserLiveView } from "./BrowserLiveView.js";

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

@@ -1,5 +1,5 @@
 import { t as cx } from "../../class-names-BiMDVpUo.js";
-import { K as SpinnerIcon, _ as DotIcon, k as MaximizeIcon } from "../../icons-cuEtsgj9.js";
+import { K as SpinnerIcon, _ as DotIcon, k as MaximizeIcon } from "../../icons-CeGfXO21.js";
 import { Button } from "../foundations/Button.js";
 import { Dialog } from "../foundations/Dialog.js";
 import { TransitionSurface } from "../foundations/TransitionSurface.js";

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

@@ -1,5 +1,5 @@
 import { t as cx } from "../../class-names-BiMDVpUo.js";
-import { L as PauseIcon, z as PlayIcon } from "../../icons-cuEtsgj9.js";
+import { L as PauseIcon, z as PlayIcon } from "../../icons-CeGfXO21.js";
 import { IconButton } from "../foundations/IconButton.js";
 import { i as formatClock } from "../../format-COCyV98Z.js";
 import { EmptyState } from "../foundations/EmptyState.js";

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

@@ -1,5 +1,5 @@
 import { t as cx } from "../../class-names-BiMDVpUo.js";
-import { K as SpinnerIcon, nt as XIcon } from "../../icons-cuEtsgj9.js";
+import { K as SpinnerIcon, nt as XIcon } from "../../icons-CeGfXO21.js";
 import { Tabs } from "../foundations/Tabs.js";
 import { WebPreview, WebPreviewEmpty, WebPreviewNavigation, WebPreviewNavigationButton, WebPreviewUrl, WebPreviewViewport } from "../general-purpose/WebPreview.js";
 import { BrowserLiveView } from "./BrowserLiveView.js";

package/dist/components/agents-sdk/EmployeeApp.d.ts

@@ -1,5 +1,5 @@
 import { l as WorkspaceNavigationAdapter } from "../../WorkspaceLink-Bh9-Jo1r.js";
-import { f as EmployeeShellProps, l as EmployeeModelSetup, n as EmployeeBrand, p as EmployeeStatus, t as EmployeeAgentRun } from "../../EmployeeChrome-C8eTGJWn.js";
+import { f as EmployeeShellProps, l as EmployeeModelSetup, n as EmployeeBrand, p as EmployeeStatus, t as EmployeeAgentRun } from "../../EmployeeChrome-B605rpVz.js";
 import * as React from "react";
 
 //#region src/components/agents-sdk/EmployeeApp.d.ts

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

@@ -1,4 +1,4 @@
-import { et as WarningIcon } from "../../icons-cuEtsgj9.js";
+import { et as WarningIcon } from "../../icons-CeGfXO21.js";
 import { WorkbenchBack } from "./WorkbenchBack.js";
 import { StatusScreen } from "../general-purpose/StatusScreen.js";
 import { EmployeeChrome } from "./EmployeeChrome.js";

package/dist/components/agents-sdk/EmployeeChat.d.ts

@@ -1,4 +1,4 @@
-import { E as PromptInputCommandComposerProps, F as PromptInputDictationProps, M as PromptInputContextSelectorProps } from "../../PromptInput-DGPrCTPl.js";
+import { E as PromptInputCommandComposerProps, M as PromptInputContextSelectorProps } from "../../PromptInput-DGPrCTPl.js";
 import { AgentChatTranscriptProps } from "./AgentChat.js";
 import { ConversationTabPickerProps } from "../extension/ConversationTabPicker.js";
 import { SetupChecklistGroupProps } from "../general-purpose/SetupChecklist.js";
@@ -24,7 +24,8 @@ interface EmployeeComposerProps<Id extends string = string> {
   contextSelector?: PromptInputContextSelectorProps;
   tabs?: ConversationTabPickerProps;
   model?: CodexModelSelectorProps;
-  dictation?: PromptInputDictationProps;
+  /** Dictation control; mount live meter subscriptions inside this slot. */
+  dictation?: React.ReactNode;
   context?: ContextProps;
 }
 /** One composer anatomy for the app and its examples; capabilities remain explicit. */

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

@@ -1,11 +1,11 @@
-import { PromptInputActionAddAttachments, PromptInputActionMenu, PromptInputActionMenuContent, PromptInputActionMenuTrigger, PromptInputAttachments, PromptInputBody, PromptInputCommandComposer, PromptInputContextSelector, PromptInputDictation, PromptInputFooter, PromptInputFooterEnd, PromptInputTools } from "../ai-sdk/PromptInput.js";
-import { AgentChat, useAgentChatCompaction } from "./AgentChat.js";
+import { PromptInputActionAddAttachments, PromptInputActionMenu, PromptInputActionMenuContent, PromptInputActionMenuTrigger, PromptInputAttachments, PromptInputBody, PromptInputCommandComposer, PromptInputContextSelector, PromptInputFooter, PromptInputFooterEnd, PromptInputTools } from "../ai-sdk/PromptInput.js";
+import { Context, ContextContent, ContextContentBody, ContextContentHeader, ContextTrigger } from "../ai-sdk/Context.js";
+import { CodexModelSelector } from "../extension/CodexModelSelector.js";
 import { ConversationTabPicker } from "../extension/ConversationTabPicker.js";
-import { n as SetupChecklistGroup } from "../../SetupChecklist-BiWQkKEq.js";
+import { AgentChat, useAgentChatCompaction } from "./AgentChat.js";
+import { n as SetupChecklistGroup } from "../../SetupChecklist-DWyifWWg.js";
 import { McpServerPickerItems } from "./McpServerPicker.js";
 import { EmployeeStartScreen } from "./EmployeeStartScreen.js";
-import { Context, ContextContent, ContextContentBody, ContextContentHeader, ContextTrigger } from "../ai-sdk/Context.js";
-import { CodexModelSelector } from "../extension/CodexModelSelector.js";
 import { ThinkChat } from "./ThinkChat.js";
 import "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
@@ -55,7 +55,7 @@ function EmployeeComposer({ personalization, connections, tools, contextSelector
 			] }), /* @__PURE__ */ jsxs(PromptInputFooterEnd, { children: [
 				tabs ? /* @__PURE__ */ jsx(ConversationTabPicker, { ...tabs }) : null,
 				model ? /* @__PURE__ */ jsx(CodexModelSelector, { ...model }) : null,
-				dictation ? /* @__PURE__ */ jsx(PromptInputDictation, { ...dictation }) : null,
+				dictation,
 				context ? /* @__PURE__ */ jsxs(Context, {
 					...context,
 					children: [/* @__PURE__ */ jsx(ContextTrigger, {}), /* @__PURE__ */ jsxs(ContextContent, { children: [/* @__PURE__ */ jsx(ContextContentHeader, {}), /* @__PURE__ */ jsx(ContextContentBody, {})] })]

package/dist/components/agents-sdk/EmployeeChrome.d.ts

@@ -1,2 +1,2 @@
-import { a as EmployeeDestination, c as EmployeeMenuProps, d as EmployeeRenderLink, f as EmployeeShellProps, h as EmployeeWorkbenchItem, i as EmployeeCompanion, l as EmployeeModelSetup, m as EmployeeView, n as EmployeeBrand, o as EmployeeFollow, p as EmployeeStatus, r as EmployeeChrome, s as EmployeeIdentity, t as EmployeeAgentRun, u as EmployeePasskeyVault } from "../../EmployeeChrome-C8eTGJWn.js";
+import { a as EmployeeDestination, c as EmployeeMenuProps, d as EmployeeRenderLink, f as EmployeeShellProps, h as EmployeeWorkbenchItem, i as EmployeeCompanion, l as EmployeeModelSetup, m as EmployeeView, n as EmployeeBrand, o as EmployeeFollow, p as EmployeeStatus, r as EmployeeChrome, s as EmployeeIdentity, t as EmployeeAgentRun, u as EmployeePasskeyVault } from "../../EmployeeChrome-B605rpVz.js";
 export { EmployeeAgentRun, EmployeeBrand, EmployeeChrome, EmployeeCompanion, EmployeeDestination, EmployeeFollow, EmployeeIdentity, EmployeeMenuProps, EmployeeModelSetup, EmployeePasskeyVault, EmployeeRenderLink, EmployeeShellProps, EmployeeStatus, EmployeeView, EmployeeWorkbenchItem };

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

@@ -1,22 +1,21 @@
 import { findCatalogMcpServerCard } from "../../utils/mcp-server-catalog.js";
-import { A as McpIcon, C as FolderIcon, F as MoonIcon, K as SpinnerIcon, P as MonitorIcon, R as PencilIcon, S as FileIcon, T as InfoIcon, V as QueueIcon, W as SidebarIcon, Y as SunIcon, Z as TerminalIcon, b as EyeIcon, c as BoxIcon, et as WarningIcon, o as ArrowUpRightIcon, q as SquareIcon, r as ArrowLeftIcon, y as EllipsisIcon } from "../../icons-cuEtsgj9.js";
+import { A as McpIcon, C as FolderIcon, F as MoonIcon, K as SpinnerIcon, P as MonitorIcon, R as PencilIcon, S as FileIcon, T as InfoIcon, V as QueueIcon, W as SidebarIcon, Y as SunIcon, Z as TerminalIcon, b as EyeIcon, c as BoxIcon, et as WarningIcon, o as ArrowUpRightIcon, q as SquareIcon, r as ArrowLeftIcon, y as EllipsisIcon } from "../../icons-CeGfXO21.js";
 import { Button } from "../foundations/Button.js";
+import { Menu } from "../foundations/Menu.js";
 import { Tooltip } from "../foundations/Tooltip.js";
 import { IconButton } from "../foundations/IconButton.js";
 import { Dialog } from "../foundations/Dialog.js";
 import { a as formatErrorMessage } from "../../format-COCyV98Z.js";
+import { AgentChatStartScreen, AgentChatStartScreenComposer, AgentChatStartScreenPrimary, AgentChatStartScreenSuggestions, AgentChatStartScreenTray, AgentChatStarterList } from "../ai-sdk/AgentChatStartScreen.js";
+import { n as isPlainPrimaryLinkActivation } from "../../navigation-link-kqMa81v5.js";
+import { DescriptionList } from "../foundations/DescriptionList.js";
+import { Avatar } from "../foundations/Avatar.js";
+import { ChatGptSignInScreen } from "../extension/ChatGptSignInScreen.js";
 import { SubagentRunLabel, getSubagentRunName } from "./SubagentRunIndicator.js";
-import { Menu } from "../foundations/Menu.js";
 import { BrandLoading } from "../general-purpose/BrandLoading.js";
 import { AgentChat } from "./AgentChat.js";
 import { EmptyState } from "../foundations/EmptyState.js";
 import { AppTopBar } from "../general-purpose/AppTopBar.js";
-import { n as isPlainPrimaryLinkActivation } from "../../navigation-link-kqMa81v5.js";
-import { AgentChatStartScreen, AgentChatStartScreenComposer, AgentChatStartScreenPrimary, AgentChatStartScreenSuggestions, AgentChatStartScreenTray, AgentChatStarterList } from "../ai-sdk/AgentChatStartScreen.js";
-import { ChatGptSignInScreen } from "../extension/ChatGptSignInScreen.js";
-import { Avatar } from "../foundations/Avatar.js";
-import { DescriptionList } from "../foundations/DescriptionList.js";
-import { Switch } from "../foundations/Switch.js";
 import { useTheme } from "../foundations/ThemeProvider.js";
 import { ActionGuide, ActionGuideAction, ActionGuideList, ActionGuideSection } from "../general-purpose/ActionGuide.js";
 import { ResponsiveSidebarShell, useResponsiveSidebarShell } from "../general-purpose/ResponsiveSidebarShell.js";
@@ -28,28 +27,43 @@ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 const WORKBENCH_NAVIGATION = [{
 	id: "files",
 	label: "Files",
+	description: "Browse files in this employee’s workspace.",
 	icon: /* @__PURE__ */ jsx(FileIcon, {})
 }, {
 	id: "plugins",
 	label: "Plugins",
+	description: "Connect apps and manage the tools this employee can use.",
 	icon: /* @__PURE__ */ jsx(BoxIcon, {})
 }];
+function MenuHint({ hint, children }) {
+	const descriptionId = React.useId();
+	return /* @__PURE__ */ jsxs(Tooltip.Root, { children: [React.cloneElement(children, { "aria-describedby": descriptionId }), /* @__PURE__ */ jsx(Tooltip.Portal, { children: /* @__PURE__ */ jsx(Tooltip.Positioner, {
+		side: "left",
+		align: "center",
+		sideOffset: 8,
+		children: /* @__PURE__ */ jsx(Tooltip.Popup, {
+			id: descriptionId,
+			children: hint
+		})
+	}) })] });
+}
 function MenuSwitchItem({ label, hint, checked, onCheckedChange }) {
-	return /* @__PURE__ */ jsxs(Tooltip.Root, { children: [/* @__PURE__ */ jsxs(Tooltip.Trigger, {
-		render: /* @__PURE__ */ jsx(Menu.CheckboxItem, {
+	return /* @__PURE__ */ jsx(MenuHint, {
+		hint,
+		children: /* @__PURE__ */ jsxs(Menu.CheckboxItem, {
 			className: "employee-menu__switch",
 			checked,
-			onCheckedChange
-		}),
-		children: [label, /* @__PURE__ */ jsx(Switch.Root, {
-			"aria-hidden": true,
-			tabIndex: -1,
-			readOnly: true,
-			size: "sm",
-			checked,
-			children: /* @__PURE__ */ jsx(Switch.Thumb, {})
-		})]
-	}), /* @__PURE__ */ jsx(Tooltip.Portal, { children: /* @__PURE__ */ jsx(Tooltip.Positioner, { children: /* @__PURE__ */ jsx(Tooltip.Popup, { children: hint }) }) })] });
+			onCheckedChange,
+			closeOnClick: false,
+			render: /* @__PURE__ */ jsx(Tooltip.Trigger, { render: /* @__PURE__ */ jsx("div", {}) }),
+			children: [/* @__PURE__ */ jsx("span", { children: label }), /* @__PURE__ */ jsx("span", {
+				className: "switch switch--sm",
+				"aria-hidden": "true",
+				"data-checked": checked ? "" : void 0,
+				children: /* @__PURE__ */ jsx("span", { className: "switch__thumb" })
+			})]
+		})
+	});
 }
 /** Employee settings are host-owned state; the menu stores only dialog visibility. */
 function EmployeeMenu({ renderLink, view = "chat", identity, onModel, onSignOut, companion, passkeys, follow, workbenchNavigation = [], navigation }) {
@@ -68,109 +82,152 @@ function EmployeeMenu({ renderLink, view = "chat", identity, onModel, onSignOut,
 		side: "bottom",
 		align: "end",
 		sideOffset: 4,
-		children: /* @__PURE__ */ jsxs(Menu.Popup, { children: [
-			compact ? (navigation ?? [...WORKBENCH_NAVIGATION, ...workbenchNavigation]).map((item) => /* @__PURE__ */ jsxs(Menu.Item, {
-				render: renderLink({
-					kind: "view",
-					view: view === item.id ? "chat" : item.id
-				}),
-				children: [item.icon, item.label]
-			}, item.id)) : null,
-			/* @__PURE__ */ jsxs(Menu.Item, {
-				render: renderLink({
-					kind: "view",
-					view: "schedules"
+		children: /* @__PURE__ */ jsxs(Menu.Popup, {
+			className: "employee-menu",
+			children: [
+				compact ? (navigation ?? [...WORKBENCH_NAVIGATION, ...workbenchNavigation]).map((item) => /* @__PURE__ */ jsx(MenuHint, {
+					hint: item.description,
+					children: /* @__PURE__ */ jsxs(Menu.Item, {
+						render: /* @__PURE__ */ jsx(Tooltip.Trigger, { render: renderLink({
+							kind: "view",
+							view: view === item.id ? "chat" : item.id
+						}) }),
+						children: [item.icon, /* @__PURE__ */ jsx("span", {
+							className: "sigvelo-truncate",
+							children: item.label
+						})]
+					})
+				}, item.id)) : null,
+				/* @__PURE__ */ jsx(MenuHint, {
+					hint: "Create and manage recurring tasks and review their runs.",
+					children: /* @__PURE__ */ jsxs(Menu.Item, {
+						render: /* @__PURE__ */ jsx(Tooltip.Trigger, { render: renderLink({
+							kind: "view",
+							view: "schedules"
+						}) }),
+						children: [/* @__PURE__ */ jsx(QueueIcon, {}), "Routines"]
+					})
 				}),
-				children: [/* @__PURE__ */ jsx(QueueIcon, {}), "Routines"]
-			}),
-			follow ? /* @__PURE__ */ jsxs(Menu.CheckboxItem, {
-				checked: follow.followed,
-				onCheckedChange: follow.onCheckedChange,
-				children: [/* @__PURE__ */ jsx(EyeIcon, {}), "Follow this conversation"]
-			}) : null,
-			identity ? /* @__PURE__ */ jsxs(Menu.Item, {
-				onClick: () => setIdentityOpen(true),
-				children: [/* @__PURE__ */ jsx(InfoIcon, {}), "Identity"]
-			}) : null,
-			onModel ? /* @__PURE__ */ jsxs(Menu.Item, {
-				onClick: onModel,
-				children: [/* @__PURE__ */ jsx(TerminalIcon, {}), "Model"]
-			}) : null,
-			companion ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Menu.Separator, {}), /* @__PURE__ */ jsxs(Menu.Group, { children: [
-				/* @__PURE__ */ jsx(Menu.GroupLabel, { children: "Companion app" }),
-				/* @__PURE__ */ jsx(MenuSwitchItem, {
-					label: "Connect this browser",
-					hint: "Connecting lets this employee chat with the browser and watch it work from anywhere.",
-					checked: companion.enabled,
-					onCheckedChange: companion.setEnabled
-				}),
-				/* @__PURE__ */ jsxs(Menu.Item, {
-					render: /* @__PURE__ */ jsx("a", {
-						href: companion.origin,
-						target: "_blank",
-						rel: "noreferrer",
-						"aria-label": companion.origin.replace(/^https?:\/\//, "")
+				follow ? /* @__PURE__ */ jsx(MenuHint, {
+					hint: "Follow the browser tabs this employee uses for this conversation.",
+					children: /* @__PURE__ */ jsxs(Menu.CheckboxItem, {
+						checked: follow.followed,
+						onCheckedChange: follow.onCheckedChange,
+						render: /* @__PURE__ */ jsx(Tooltip.Trigger, { render: /* @__PURE__ */ jsx("div", {}) }),
+						children: [/* @__PURE__ */ jsx(EyeIcon, {}), "Follow this conversation"]
+					})
+				}) : null,
+				identity ? /* @__PURE__ */ jsx(MenuHint, {
+					hint: "Review the browser profile and account assigned to this employee.",
+					children: /* @__PURE__ */ jsxs(Menu.Item, {
+						onClick: () => setIdentityOpen(true),
+						render: /* @__PURE__ */ jsx(Tooltip.Trigger, { render: /* @__PURE__ */ jsx("div", {}) }),
+						children: [/* @__PURE__ */ jsx(InfoIcon, {}), "Identity"]
+					})
+				}) : null,
+				onModel ? /* @__PURE__ */ jsx(MenuHint, {
+					hint: "Choose the model this employee uses for conversations.",
+					children: /* @__PURE__ */ jsxs(Menu.Item, {
+						onClick: onModel,
+						render: /* @__PURE__ */ jsx(Tooltip.Trigger, { render: /* @__PURE__ */ jsx("div", {}) }),
+						children: [/* @__PURE__ */ jsx(TerminalIcon, {}), "Model"]
+					})
+				}) : null,
+				companion ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Menu.Separator, {}), /* @__PURE__ */ jsxs(Menu.Group, { children: [
+					/* @__PURE__ */ jsx(Menu.GroupLabel, { children: "Companion app" }),
+					/* @__PURE__ */ jsx(MenuSwitchItem, {
+						label: "Connect this browser",
+						hint: "Connect this browser so you can chat with this employee and watch it work from the companion app.",
+						checked: companion.enabled,
+						onCheckedChange: companion.setEnabled
 					}),
-					children: [/* @__PURE__ */ jsx(ArrowUpRightIcon, {}), companion.origin.replace(/^https?:\/\//, "")]
-				})
-			] })] }) : null,
-			passkeys ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Menu.Separator, {}), /* @__PURE__ */ jsxs(Menu.Group, { children: [/* @__PURE__ */ jsx(Menu.GroupLabel, { children: "Passkeys" }), /* @__PURE__ */ jsx(MenuSwitchItem, {
-				label: "Use its own passkeys",
-				hint: "The employee saves and uses its own passkeys instead of the browser's.",
-				checked: passkeys.enabled,
-				onCheckedChange: passkeys.setEnabled
-			})] })] }) : null,
-			/* @__PURE__ */ jsx(Menu.Separator, {}),
-			/* @__PURE__ */ jsxs(Menu.Group, {
-				className: "employee-menu__appearance",
-				children: [/* @__PURE__ */ jsx(Menu.GroupLabel, { children: "Appearance" }), /* @__PURE__ */ jsxs(Menu.RadioGroup, {
-					className: "employee-menu__theme-options",
-					value: preference,
-					onValueChange: (value) => {
-						if (value === "light" || value === "dark" || value === "system") setPreference(value);
-					},
-					children: [
-						/* @__PURE__ */ jsxs(Menu.RadioItem, {
-							value: "light",
-							className: "employee-menu__theme-option",
-							"aria-label": "Light",
-							title: "Light",
-							closeOnClick: false,
-							children: [/* @__PURE__ */ jsx(SunIcon, { "aria-hidden": "true" }), /* @__PURE__ */ jsx("span", {
-								className: "sigvelo-visually-hidden",
-								children: "Light"
-							})]
-						}),
-						/* @__PURE__ */ jsxs(Menu.RadioItem, {
-							value: "dark",
-							className: "employee-menu__theme-option",
-							"aria-label": "Dark",
-							title: "Dark",
-							closeOnClick: false,
-							children: [/* @__PURE__ */ jsx(MoonIcon, { "aria-hidden": "true" }), /* @__PURE__ */ jsx("span", {
-								className: "sigvelo-visually-hidden",
-								children: "Dark"
-							})]
-						}),
-						/* @__PURE__ */ jsxs(Menu.RadioItem, {
-							value: "system",
-							className: "employee-menu__theme-option",
-							"aria-label": "System",
-							title: "System",
-							closeOnClick: false,
-							children: [/* @__PURE__ */ jsx(MonitorIcon, { "aria-hidden": "true" }), /* @__PURE__ */ jsx("span", {
-								className: "sigvelo-visually-hidden",
-								children: "System"
+					/* @__PURE__ */ jsx(MenuHint, {
+						hint: "Open the companion app in a new tab to chat with this employee remotely.",
+						children: /* @__PURE__ */ jsxs(Menu.Item, {
+							render: /* @__PURE__ */ jsx(Tooltip.Trigger, { render: /* @__PURE__ */ jsx("a", {
+								href: companion.origin,
+								target: "_blank",
+								rel: "noreferrer",
+								"aria-label": companion.origin.replace(/^https?:\/\//, "")
+							}) }),
+							children: [/* @__PURE__ */ jsx(ArrowUpRightIcon, {}), /* @__PURE__ */ jsx("span", {
+								className: "sigvelo-truncate",
+								children: companion.origin.replace(/^https?:\/\//, "")
 							})]
 						})
-					]
-				})]
-			}),
-			onSignOut ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Menu.Separator, {}), /* @__PURE__ */ jsxs(Menu.Item, {
-				onClick: onSignOut,
-				children: [/* @__PURE__ */ jsx(ArrowUpRightIcon, {}), "Sign out"]
-			})] }) : null
-		] })
+					})
+				] })] }) : null,
+				passkeys ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Menu.Separator, {}), /* @__PURE__ */ jsxs(Menu.Group, { children: [/* @__PURE__ */ jsx(Menu.GroupLabel, { children: "Passkeys" }), /* @__PURE__ */ jsx(MenuSwitchItem, {
+					label: "Use its own passkeys",
+					hint: "The employee saves and uses its own passkeys instead of the browser's.",
+					checked: passkeys.enabled,
+					onCheckedChange: passkeys.setEnabled
+				})] })] }) : null,
+				/* @__PURE__ */ jsx(Menu.Separator, {}),
+				/* @__PURE__ */ jsxs(Menu.Group, {
+					className: "employee-menu__appearance",
+					children: [/* @__PURE__ */ jsx(Menu.GroupLabel, { children: "Appearance" }), /* @__PURE__ */ jsxs(Menu.RadioGroup, {
+						className: "employee-menu__theme-options",
+						value: preference,
+						onValueChange: (value) => {
+							if (value === "light" || value === "dark" || value === "system") setPreference(value);
+						},
+						children: [
+							/* @__PURE__ */ jsx(MenuHint, {
+								hint: "Use a light appearance.",
+								children: /* @__PURE__ */ jsxs(Menu.RadioItem, {
+									value: "light",
+									className: "employee-menu__theme-option",
+									"aria-label": "Light",
+									render: /* @__PURE__ */ jsx(Tooltip.Trigger, { render: /* @__PURE__ */ jsx("div", {}) }),
+									closeOnClick: false,
+									children: [/* @__PURE__ */ jsx(SunIcon, { "aria-hidden": "true" }), /* @__PURE__ */ jsx("span", {
+										className: "sigvelo-visually-hidden",
+										children: "Light"
+									})]
+								})
+							}),
+							/* @__PURE__ */ jsx(MenuHint, {
+								hint: "Use a dark appearance.",
+								children: /* @__PURE__ */ jsxs(Menu.RadioItem, {
+									value: "dark",
+									className: "employee-menu__theme-option",
+									"aria-label": "Dark",
+									render: /* @__PURE__ */ jsx(Tooltip.Trigger, { render: /* @__PURE__ */ jsx("div", {}) }),
+									closeOnClick: false,
+									children: [/* @__PURE__ */ jsx(MoonIcon, { "aria-hidden": "true" }), /* @__PURE__ */ jsx("span", {
+										className: "sigvelo-visually-hidden",
+										children: "Dark"
+									})]
+								})
+							}),
+							/* @__PURE__ */ jsx(MenuHint, {
+								hint: "Match your device’s light or dark appearance automatically.",
+								children: /* @__PURE__ */ jsxs(Menu.RadioItem, {
+									value: "system",
+									className: "employee-menu__theme-option",
+									"aria-label": "System",
+									render: /* @__PURE__ */ jsx(Tooltip.Trigger, { render: /* @__PURE__ */ jsx("div", {}) }),
+									closeOnClick: false,
+									children: [/* @__PURE__ */ jsx(MonitorIcon, { "aria-hidden": "true" }), /* @__PURE__ */ jsx("span", {
+										className: "sigvelo-visually-hidden",
+										children: "System"
+									})]
+								})
+							})
+						]
+					})]
+				}),
+				onSignOut ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Menu.Separator, {}), /* @__PURE__ */ jsx(MenuHint, {
+					hint: "Sign out of your account on this device.",
+					children: /* @__PURE__ */ jsxs(Menu.Item, {
+						onClick: onSignOut,
+						render: /* @__PURE__ */ jsx(Tooltip.Trigger, { render: /* @__PURE__ */ jsx("div", {}) }),
+						children: [/* @__PURE__ */ jsx(ArrowUpRightIcon, {}), "Sign out"]
+					})
+				})] }) : null
+			]
+		})
 	}) })] }), identity ? /* @__PURE__ */ jsx(IdentityDialog, {
 		identity,
 		open: identityOpen,
@@ -231,6 +288,7 @@ function EmployeeWorkbenchLinks({ view, renderLink, workbenchNavigation = [], na
 	if (compact) return null;
 	return /* @__PURE__ */ jsx(Fragment, { children: (navigation ?? [...WORKBENCH_NAVIGATION, ...workbenchNavigation]).map((item) => /* @__PURE__ */ jsx(AppTopBar.Link, {
 		label: item.label,
+		tooltip: item.description,
 		"aria-current": view === item.id ? "page" : void 0,
 		"data-pressed": view === item.id ? "" : void 0,
 		render: renderLink({

package/dist/components/agents-sdk/EmployeeSchedules.d.ts

@@ -1,4 +1,4 @@
-import { c as EmployeeMenuProps } from "../../EmployeeChrome-C8eTGJWn.js";
+import { c as EmployeeMenuProps } from "../../EmployeeChrome-B605rpVz.js";
 import { t as ThinkRoutine } from "../../ThinkRoutine-Cb1DdaHa.js";
 import { ThinkRoutineActionsRootProps } from "./ThinkRoutineActions.js";
 import * as React from "react";

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

@@ -1,4 +1,4 @@
-import { R as PencilIcon, r as ArrowLeftIcon } from "../../icons-cuEtsgj9.js";
+import { R as PencilIcon, r as ArrowLeftIcon } from "../../icons-CeGfXO21.js";
 import { AppTopBar } from "../general-purpose/AppTopBar.js";
 import { StatusScreen } from "../general-purpose/StatusScreen.js";
 import { ResponsiveSidebarShell } from "../general-purpose/ResponsiveSidebarShell.js";

package/dist/components/agents-sdk/EmployeeStartScreen.d.ts

@@ -1,5 +1,5 @@
 import { J as PromptInputMessage } from "../../PromptInput-DGPrCTPl.js";
-import { a as EmployeeDestination, n as EmployeeBrand } from "../../EmployeeChrome-C8eTGJWn.js";
+import { a as EmployeeDestination, n as EmployeeBrand } from "../../EmployeeChrome-B605rpVz.js";
 import { SetupChecklistGroupProps } from "../general-purpose/SetupChecklist.js";
 import { n as McpPluginCatalogProps } from "../../McpPluginCatalog-DNeHDrts.js";
 import { r as WorkspaceMountManagerProps } from "../../WorkspaceMountManager-CkLI1B-G.js";

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

@@ -1,10 +1,10 @@
-import { C as FolderIcon, G as SlackIcon, I as PaperclipIcon, c as BoxIcon, g as DiscordIcon } from "../../icons-cuEtsgj9.js";
-import { IconButton } from "../foundations/IconButton.js";
+import { C as FolderIcon, G as SlackIcon, I as PaperclipIcon, c as BoxIcon, g as DiscordIcon } from "../../icons-CeGfXO21.js";
 import { Menu } from "../foundations/Menu.js";
+import { IconButton } from "../foundations/IconButton.js";
 import { ActionGuideAction } from "../general-purpose/ActionGuide.js";
 import { AppIcon } from "../foundations/AppIcon.js";
 import { EmployeeChrome } from "./EmployeeChrome.js";
-import { t as SetupChecklistAction } from "../../SetupChecklist-BiWQkKEq.js";
+import { t as SetupChecklistAction } from "../../SetupChecklist-DWyifWWg.js";
 import { McpServerPickerAction, McpServerPickerItems } from "./McpServerPicker.js";
 import { WorkspaceMountManager } from "./WorkspaceMountManager.js";
 import * as React from "react";