@mcp-b/react-components 0.49.0 → 0.50.0

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

@@ -0,0 +1,57 @@
+import { K as SpinnerIcon, et as WarningIcon } from "../../icons-CeGfXO21.js";
+import "../foundations/icons.js";
+import { StatusScreen } from "../general-purpose/StatusScreen.js";
+import { EmployeeChrome } from "./EmployeeChrome.js";
+import { ThinkFullApp } from "./ThinkFullApp.js";
+import "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/agents-sdk/EmployeeApp.tsx
+/**
+* Canonical employee screen. Hosts keep chat providers mounted above it and
+* supply live content; this component owns admission, navigation and layout.
+*/
+function EmployeeApp({ status, brand, modelSetup, connectingLabel, conversationLoading, conversationRun, workbench, live, schedules, report, shell, ref, children, ...chrome }) {
+	if (status !== "ready") return /* @__PURE__ */ jsx("div", {
+		className: "employee-app",
+		"data-view": chrome.view,
+		ref,
+		children: /* @__PURE__ */ jsx(EmployeeChrome.Gate, {
+			status,
+			brand,
+			identity: chrome.identity,
+			modelSetup,
+			connectingLabel
+		})
+	});
+	const run = conversationRun;
+	const content = chrome.view === "live" ? live : /* @__PURE__ */ jsxs(ThinkFullApp.Root, {
+		workbenchOpen: Boolean(workbench),
+		children: [
+			/* @__PURE__ */ jsxs(ThinkFullApp.Conversation, {
+				"data-workspace-restoration-scope": "chat",
+				children: [report, run?.state === "unavailable" || run?.state === "error" ? /* @__PURE__ */ jsx(StatusScreen, {
+					role: "alert",
+					icon: /* @__PURE__ */ jsx(WarningIcon, {}),
+					title: run.state === "unavailable" ? "Delegated run unavailable" : "Could not open this run",
+					description: run.state === "error" ? run.error : "This run is no longer available. The parent conversation keeps its history and controls."
+				}) : conversationLoading ? /* @__PURE__ */ jsx(StatusScreen, {
+					icon: /* @__PURE__ */ jsx(SpinnerIcon, {}),
+					description: conversationLoading
+				}) : children]
+			}),
+			/* @__PURE__ */ jsx(ThinkFullApp.ResizeHandle, {}),
+			/* @__PURE__ */ jsx(ThinkFullApp.Workbench, { children: workbench })
+		]
+	});
+	return /* @__PURE__ */ jsx("div", {
+		className: "employee-app",
+		"data-view": chrome.view,
+		ref,
+		children: chrome.view === "schedules" ? schedules : shell({
+			...chrome,
+			children: content
+		})
+	});
+}
+//#endregion
+export { EmployeeApp };

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

@@ -0,0 +1,63 @@
+import { E as PromptInputCommandComposerProps, F as PromptInputDictationProps, M as PromptInputContextSelectorProps } from "../../PromptInput-DGPrCTPl.js";
+import { AgentChatTranscriptProps } from "./AgentChat.js";
+import { ContextProps } from "../ai-sdk/Context.js";
+import { CodexModelSelectorProps } from "../extension/CodexModelSelector.js";
+import { ThinkChatMessageContentProps } from "./ThinkChat.js";
+import * as React from "react";
+
+//#region src/components/agents-sdk/EmployeeChat.d.ts
+interface EmployeeComposerProps {
+  commands: PromptInputCommandComposerProps["commands"];
+  mentionCommands?: PromptInputCommandComposerProps["mentionCommands"];
+  onCompact?: () => Promise<{
+    compacted: boolean;
+  }>;
+  placeholder?: string;
+  disabled?: boolean;
+  /** Additional connection/personalization menu entries, using shared menu components. */
+  menu?: React.ReactNode;
+  tools?: React.ReactNode;
+  contextSelector?: PromptInputContextSelectorProps;
+  tabs?: React.ReactNode;
+  model?: CodexModelSelectorProps;
+  dictation?: PromptInputDictationProps;
+  context?: ContextProps;
+}
+/** One composer anatomy for the app and its examples; capabilities remain explicit. */
+declare function EmployeeComposer({
+  menu,
+  tools,
+  contextSelector,
+  tabs,
+  model,
+  dictation,
+  context,
+  onCompact,
+  placeholder,
+  disabled,
+  ...input
+}: EmployeeComposerProps): React.JSX.Element;
+interface EmployeeTranscriptProps extends Omit<ThinkChatMessageContentProps, "message"> {
+  readOnly?: boolean;
+  scrollAnchor?: AgentChatTranscriptProps["scrollAnchor"];
+}
+/** Shared message content and actions, including the same read-only run behavior. */
+declare function EmployeeTranscript({
+  readOnly,
+  scrollAnchor,
+  ...content
+}: EmployeeTranscriptProps): React.JSX.Element;
+/** Common dock ordering. Hosts supply the runtime-backed notices and composer. */
+declare function EmployeeChatDock({
+  recovery,
+  notices,
+  readOnly,
+  children
+}: {
+  recovery?: React.ReactNode;
+  notices?: React.ReactNode;
+  readOnly?: boolean;
+  children?: React.ReactNode;
+}): React.JSX.Element;
+//#endregion
+export { EmployeeChatDock, EmployeeComposer, EmployeeComposerProps, EmployeeTranscript, EmployeeTranscriptProps };

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

@@ -0,0 +1,84 @@
+import { PromptInputActionAddAttachments, PromptInputActionMenu, PromptInputActionMenuContent, PromptInputActionMenuTrigger, PromptInputAttachments, PromptInputBody, PromptInputCommandComposer, PromptInputContextSelector, PromptInputDictation, 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 { AgentChat, useAgentChatCompaction } from "./AgentChat.js";
+import { ThinkChat } from "./ThinkChat.js";
+import "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/agents-sdk/EmployeeChat.tsx
+function CommandInput(props) {
+	return /* @__PURE__ */ jsx(PromptInputBody, { children: /* @__PURE__ */ jsx(PromptInputCommandComposer, {
+		"aria-label": "Message",
+		...props
+	}) });
+}
+function CompactingInput({ onCompact, ...props }) {
+	const compaction = useAgentChatCompaction(onCompact);
+	return /* @__PURE__ */ jsxs(Fragment, { children: [compaction.notice ? /* @__PURE__ */ jsx(AgentChat.Notice, { children: compaction.notice }) : null, /* @__PURE__ */ jsx(CommandInput, {
+		...props,
+		commands: compaction.command ? [compaction.command, ...props.commands] : props.commands,
+		onCommandSelect: (command) => {
+			if (command.id === compaction.command?.id) compaction.run();
+		}
+	})] });
+}
+/** One composer anatomy for the app and its examples; capabilities remain explicit. */
+function EmployeeComposer({ menu, tools, contextSelector, tabs, model, dictation, context, onCompact, placeholder = "How can I help you today?", disabled, ...input }) {
+	const inputProps = {
+		...input,
+		placeholder,
+		disabled
+	};
+	return /* @__PURE__ */ jsxs(AgentChat.Composer, {
+		disabled,
+		children: [
+			/* @__PURE__ */ jsx(PromptInputAttachments, {}),
+			onCompact ? /* @__PURE__ */ jsx(CompactingInput, {
+				...inputProps,
+				onCompact
+			}) : /* @__PURE__ */ jsx(CommandInput, { ...inputProps }),
+			/* @__PURE__ */ jsxs(PromptInputFooter, { children: [/* @__PURE__ */ jsxs(PromptInputTools, { children: [
+				/* @__PURE__ */ jsxs(PromptInputActionMenu, { children: [/* @__PURE__ */ jsx(PromptInputActionMenuTrigger, { disabled }), /* @__PURE__ */ jsxs(PromptInputActionMenuContent, { children: [/* @__PURE__ */ jsx(PromptInputActionAddAttachments, {}), menu] })] }),
+				contextSelector ? /* @__PURE__ */ jsx(PromptInputContextSelector, { ...contextSelector }) : null,
+				tools
+			] }), /* @__PURE__ */ jsxs(PromptInputFooterEnd, { children: [
+				tabs,
+				model ? /* @__PURE__ */ jsx(CodexModelSelector, { ...model }) : null,
+				dictation ? /* @__PURE__ */ jsx(PromptInputDictation, { ...dictation }) : null,
+				context ? /* @__PURE__ */ jsxs(Context, {
+					...context,
+					children: [/* @__PURE__ */ jsx(ContextTrigger, {}), /* @__PURE__ */ jsxs(ContextContent, { children: [/* @__PURE__ */ jsx(ContextContentHeader, {}), /* @__PURE__ */ jsx(ContextContentBody, {})] })]
+				}) : null,
+				/* @__PURE__ */ jsx(AgentChat.Submit, {})
+			] })] })
+		]
+	});
+}
+/** Shared message content and actions, including the same read-only run behavior. */
+function EmployeeTranscript({ readOnly, scrollAnchor, ...content }) {
+	return /* @__PURE__ */ jsx(AgentChat.Transcript, {
+		scrollAnchor,
+		children: ({ message, messageIndex }) => /* @__PURE__ */ jsxs(AgentChat.Message, {
+			message,
+			messageIndex,
+			children: [/* @__PURE__ */ jsx(ThinkChat.MessageContent, {
+				...content,
+				message
+			}), /* @__PURE__ */ jsxs(AgentChat.Actions, { children: [
+				/* @__PURE__ */ jsx(AgentChat.CopyAction, {}),
+				readOnly ? null : /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(AgentChat.RetryAction, {}), /* @__PURE__ */ jsx(AgentChat.EditAction, {})] }),
+				/* @__PURE__ */ jsx(AgentChat.Timestamp, {})
+			] })]
+		})
+	});
+}
+/** Common dock ordering. Hosts supply the runtime-backed notices and composer. */
+function EmployeeChatDock({ recovery, notices, readOnly, children }) {
+	return /* @__PURE__ */ jsxs(AgentChat.Dock, { children: [recovery, readOnly ? null : /* @__PURE__ */ jsxs(Fragment, { children: [
+		notices,
+		/* @__PURE__ */ jsx(AgentChat.Queue, {}),
+		children
+	] })] });
+}
+//#endregion
+export { EmployeeChatDock, EmployeeComposer, EmployeeTranscript };

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

@@ -1,6 +1,7 @@
-import { J as PromptInputMessage } from "../../PromptInput-C4Mofitz.js";
+import { J as PromptInputMessage } from "../../PromptInput-DGPrCTPl.js";
 import { n as AgentToolRunValue } from "../../AgentToolRunsContext-GMe_hSnD.js";
-import { ThinkThreadItem } from "./ThinkThreadPicker.js";
+import { n as ResponsiveSidebarShell } from "../../ResponsiveSidebarShell-CAmmtQTR.js";
+import { t as ThinkThreadItem } from "../../ThinkThreadPicker-yetGX_s5.js";
 import * as React from "react";
 
 //#region src/components/agents-sdk/EmployeeChrome.d.ts
@@ -149,6 +150,10 @@ interface EmployeeShellProps<Thread extends ThinkThreadItem = ThinkThreadItem> e
   appBarLeading?: React.ReactNode;
   /** Passed the whole history item after the thread picker confirms removal. */
   onDeleteThread?: (thread: Thread) => void | Promise<void>;
+  /** Shared manager shell supplies workforce navigation in place of thread-only navigation. */
+  sidebar?: React.ComponentProps<typeof ResponsiveSidebarShell>["sidebar"];
+  sidebarLabel?: string;
+  navigation?: readonly EmployeeWorkbenchItem[];
   children: React.ReactNode;
 }
 declare function EmployeeShell<Thread extends ThinkThreadItem = ThinkThreadItem>({
@@ -159,6 +164,9 @@ declare function EmployeeShell<Thread extends ThinkThreadItem = ThinkThreadItem>
   renderLink,
   appBarLeading,
   onDeleteThread,
+  sidebar,
+  sidebarLabel,
+  navigation,
   children,
   ...menu
 }: EmployeeShellProps<Thread>): React.JSX.Element;

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

@@ -1,25 +1,25 @@
 import { findCatalogMcpServerCard } from "../../utils/mcp-server-catalog.js";
-import { A as McpIcon, C as FolderIcon, K as SpinnerIcon, R as PencilIcon, S as FileIcon, T as InfoIcon, V as QueueIcon, 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, K as SpinnerIcon, R as PencilIcon, S as FileIcon, T as InfoIcon, V as QueueIcon, 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 { Dialog } from "../foundations/Dialog.js";
 import { a as formatErrorMessage } from "../../format-COCyV98Z.js";
-import { SubagentRunLabel, getSubagentRunName } from "./SubagentRunIndicator.js";
-import { Menu } from "../foundations/Menu.js";
-import { EmptyState } from "../foundations/EmptyState.js";
-import { AgentChat } from "./AgentChat.js";
-import { Avatar } from "../foundations/Avatar.js";
-import { McpServerIcon } from "./McpServerIcon.js";
-import { ThinkThreadPicker } from "./ThinkThreadPicker.js";
 import { AgentChatStartScreen, AgentChatStartScreenComposer, AgentChatStartScreenPrimary, AgentChatStartScreenSuggestions, AgentChatStartScreenTray, AgentChatStarterList } from "../ai-sdk/AgentChatStartScreen.js";
-import { ChatGptSignInScreen } from "../extension/ChatGptSignInScreen.js";
 import { DescriptionList } from "../foundations/DescriptionList.js";
+import { Avatar } from "../foundations/Avatar.js";
+import { ChatGptSignInScreen } from "../extension/ChatGptSignInScreen.js";
+import { EmptyState } from "../foundations/EmptyState.js";
 import { Switch } from "../foundations/Switch.js";
 import { useTheme } from "../foundations/ThemeProvider.js";
 import "../foundations/icons.js";
 import { ActionGuide, ActionGuideAction, ActionGuideList, ActionGuideSection } from "../general-purpose/ActionGuide.js";
 import { AppTopBar } from "../general-purpose/AppTopBar.js";
 import { ResponsiveSidebarShell, useResponsiveSidebarShell } from "../general-purpose/ResponsiveSidebarShell.js";
+import { SubagentRunLabel, getSubagentRunName } from "./SubagentRunIndicator.js";
+import { AgentChat } from "./AgentChat.js";
+import { McpServerIcon } from "./McpServerIcon.js";
+import { ThinkThreadPicker } from "./ThinkThreadPicker.js";
 import * as React from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/agents-sdk/EmployeeChrome.tsx
@@ -265,7 +265,16 @@ function employeeShellLeading({ agentRun, view, hasThread, appBarLeading, back,
 	if (!navigation && !appBarLeading) return null;
 	return /* @__PURE__ */ jsxs(Fragment, { children: [navigation, appBarLeading] });
 }
-function employeeShellActions({ agentRun, view, renderLink, workbenchNavigation, focusedStop }) {
+function employeeShellActions({ agentRun, view, renderLink, workbenchNavigation, focusedStop, navigation }) {
+	if (!agentRun && navigation) return /* @__PURE__ */ jsx(Fragment, { children: navigation.map((item) => /* @__PURE__ */ jsx(AppTopBar.Link, {
+		label: item.label,
+		"aria-current": view === item.id ? "page" : void 0,
+		render: renderLink({
+			kind: "view",
+			view: item.id
+		}),
+		children: item.icon
+	}, item.id)) });
 	if (!agentRun) return /* @__PURE__ */ jsx(EmployeeWorkbenchLinks, {
 		view,
 		renderLink,
@@ -285,7 +294,7 @@ function employeeShellActions({ agentRun, view, renderLink, workbenchNavigation,
 		children: /* @__PURE__ */ jsx(SquareIcon, {})
 	});
 }
-function EmployeeShell({ view, threads, threadId, agentRun, renderLink, appBarLeading, onDeleteThread, children, ...menu }) {
+function EmployeeShell({ view, threads, threadId, agentRun, renderLink, appBarLeading, onDeleteThread, sidebar, sidebarLabel = "threads", navigation, children, ...menu }) {
 	const history = threads ?? EMPTY_THREADS;
 	const thread = history.find((candidate) => candidate.id === threadId);
 	const { backRef, focusedStop } = useEmployeeRunStopFocus();
@@ -301,7 +310,7 @@ function EmployeeShell({ view, threads, threadId, agentRun, renderLink, appBarLe
 		}),
 		children: /* @__PURE__ */ jsx(ArrowLeftIcon, {})
 	});
-	if (view === "live") return /* @__PURE__ */ jsx("div", {
+	if (view === "live" && !sidebar) return /* @__PURE__ */ jsx("div", {
 		className: "employee-shell",
 		"data-view": view,
 		children: /* @__PURE__ */ jsx(ResponsiveSidebarShell, {
@@ -317,7 +326,7 @@ function EmployeeShell({ view, threads, threadId, agentRun, renderLink, appBarLe
 		className: "employee-shell",
 		"data-view": view,
 		children: /* @__PURE__ */ jsx(ResponsiveSidebarShell, {
-			sidebarLabel: "threads",
+			sidebarLabel,
 			sidebarTogglePlacement: "sidebar",
 			showMainLabel: "Show selected thread",
 			bar: {
@@ -340,7 +349,8 @@ function EmployeeShell({ view, threads, threadId, agentRun, renderLink, appBarLe
 					view,
 					renderLink,
 					workbenchNavigation: menu.workbenchNavigation,
-					focusedStop
+					focusedStop,
+					navigation
 				}),
 				primary: /* @__PURE__ */ jsx(EmployeeMenu, {
 					...menu,
@@ -348,7 +358,7 @@ function EmployeeShell({ view, threads, threadId, agentRun, renderLink, appBarLe
 					follow: agentRun ? void 0 : menu.follow
 				})
 			},
-			sidebar: agentRun ? void 0 : ({ closeSidebarOnCompact }) => /* @__PURE__ */ jsx(ThinkThreadPicker, {
+			sidebar: sidebar ?? (agentRun ? void 0 : ({ closeSidebarOnCompact }) => /* @__PURE__ */ jsx(ThinkThreadPicker, {
 				threads: history,
 				renderThreadLink: (item) => renderLink({
 					kind: "thread",
@@ -357,7 +367,7 @@ function EmployeeShell({ view, threads, threadId, agentRun, renderLink, appBarLe
 				createThreadLink: renderLink({ kind: "new-thread" }),
 				onSelect: closeSidebarOnCompact,
 				onDelete: onDeleteThread
-			}),
+			})),
 			children
 		})
 	});

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

@@ -0,0 +1,24 @@
+import { EmployeeMenuProps } from "./EmployeeChrome.js";
+import { t as ThinkRoutine } from "../../ThinkRoutine-Cb1DdaHa.js";
+import { ThinkRoutineActionsRootProps } from "./ThinkRoutineActions.js";
+import * as React from "react";
+
+//#region src/components/agents-sdk/EmployeeSchedules.d.ts
+interface EmployeeSchedulesProps<Routine extends ThinkRoutine = ThinkRoutine> extends EmployeeMenuProps, Pick<ThinkRoutineActionsRootProps<Routine>, "sourceKey" | "onRun" | "onEnabledChange" | "onDelete"> {
+  routines: readonly Routine[];
+  selectedRoutineId: string | null;
+  error?: React.ReactNode;
+}
+/** Schedule navigation, selection, empty states and controls shared by every host. */
+declare function EmployeeSchedules<Routine extends ThinkRoutine>({
+  routines,
+  selectedRoutineId,
+  error,
+  sourceKey,
+  onRun,
+  onEnabledChange,
+  onDelete,
+  ...menu
+}: EmployeeSchedulesProps<Routine>): React.JSX.Element;
+//#endregion
+export { EmployeeSchedules, EmployeeSchedulesProps };

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

@@ -0,0 +1,105 @@
+import { R as PencilIcon, r as ArrowLeftIcon } from "../../icons-CeGfXO21.js";
+import { LinkButton } from "../foundations/LinkButton.js";
+import "../foundations/icons.js";
+import { AppTopBar } from "../general-purpose/AppTopBar.js";
+import { ResponsiveSidebarShell } from "../general-purpose/ResponsiveSidebarShell.js";
+import { StatusScreen } from "../general-purpose/StatusScreen.js";
+import { EmployeeChrome } from "./EmployeeChrome.js";
+import { getThinkExecutionRunId } from "./ThinkExecutionRun.js";
+import { ThinkRoutineActions, useThinkRoutineActions } from "./ThinkRoutineActions.js";
+import { ThinkRoutineBrowser } from "./ThinkRoutineBrowser.js";
+import { ThinkRoutineDetail } from "./ThinkRoutineDetail.js";
+import "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/agents-sdk/EmployeeSchedules.tsx
+function SelectedRoutine({ routine, renderLink }) {
+	return /* @__PURE__ */ jsx(ThinkRoutineDetail, {
+		routine,
+		showOwner: false,
+		...useThinkRoutineActions(),
+		renderRunLink: (run) => renderLink({
+			kind: "routine-run",
+			routineId: routine.id,
+			runId: getThinkExecutionRunId(run)
+		})
+	});
+}
+/** Schedule navigation, selection, empty states and controls shared by every host. */
+function EmployeeSchedules({ routines, selectedRoutineId, error, sourceKey, onRun, onEnabledChange, onDelete, ...menu }) {
+	const selected = routines.find((routine) => routine.id === selectedRoutineId);
+	const { renderLink } = menu;
+	const content = /* @__PURE__ */ jsx(ResponsiveSidebarShell, {
+		sidebarLabel: "schedules",
+		showMainLabel: "Show selected schedule",
+		error,
+		bar: {
+			label: "Schedule controls",
+			title: selected?.name ?? "Schedules",
+			compactTitleTrigger: routines.length ? /* @__PURE__ */ jsx("span", { children: selected?.name ?? "Schedules" }) : void 0,
+			leading: /* @__PURE__ */ jsx(AppTopBar.Link, {
+				label: "Back to chat",
+				render: renderLink({
+					kind: "view",
+					view: "chat"
+				}),
+				children: /* @__PURE__ */ jsx(ArrowLeftIcon, {})
+			}),
+			primary: /* @__PURE__ */ jsx(EmployeeChrome.Menu, { ...menu }),
+			actions: /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(EmployeeChrome.WorkbenchLinks, {
+				view: "schedules",
+				renderLink,
+				workbenchNavigation: menu.workbenchNavigation
+			}), selected ? /* @__PURE__ */ jsxs(Fragment, { children: [
+				/* @__PURE__ */ jsx(ThinkRoutineActions.Run, {}),
+				/* @__PURE__ */ jsx(AppTopBar.Link, {
+					label: "Edit schedule",
+					render: renderLink({
+						kind: "edit-routine",
+						routineId: selected.id
+					}),
+					children: /* @__PURE__ */ jsx(PencilIcon, {})
+				}),
+				/* @__PURE__ */ jsx(ThinkRoutineActions.Delete, {})
+			] }) : null] })
+		},
+		sidebar: ({ closeSidebarOnCompact }) => /* @__PURE__ */ jsx(ThinkRoutineBrowser, {
+			routines,
+			selectedRoutineId,
+			showOwner: false,
+			renderRoutineLink: (routine) => renderLink({
+				kind: "routine",
+				routineId: routine.id
+			}),
+			createRoutineLink: renderLink({ kind: "create-routine" }),
+			onRoutineLinkClick: closeSidebarOnCompact
+		}),
+		children: /* @__PURE__ */ jsx("main", {
+			className: "think-routine__main",
+			children: selected ? /* @__PURE__ */ jsxs(Fragment, { children: [
+				/* @__PURE__ */ jsx(ThinkRoutineActions.Error, {}),
+				/* @__PURE__ */ jsx(SelectedRoutine, {
+					routine: selected,
+					renderLink
+				}),
+				/* @__PURE__ */ jsx(ThinkRoutineActions.Status, {})
+			] }) : /* @__PURE__ */ jsx(StatusScreen, {
+				title: selectedRoutineId ? "Schedule unavailable" : routines.length ? "Select a schedule" : "No schedules yet",
+				description: selectedRoutineId ? "Choose another schedule or create a new one." : "Create a schedule to run work automatically.",
+				children: /* @__PURE__ */ jsx(LinkButton, {
+					render: renderLink({ kind: "create-routine" }),
+					children: "Create schedule"
+				})
+			})
+		})
+	});
+	return selected ? /* @__PURE__ */ jsx(ThinkRoutineActions.Root, {
+		routine: selected,
+		sourceKey,
+		onRun,
+		onEnabledChange,
+		onDelete,
+		children: content
+	}) : content;
+}
+//#endregion
+export { EmployeeSchedules };

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

@@ -0,0 +1,43 @@
+import { J as PromptInputMessage } from "../../PromptInput-DGPrCTPl.js";
+import { EmployeeBrand, EmployeeDestination } from "./EmployeeChrome.js";
+import { SetupChecklistGroupProps } from "../general-purpose/SetupChecklist.js";
+import { McpPluginCatalogProps } from "./McpPluginCatalog.js";
+import { WorkspaceMountManagerProps } from "./WorkspaceMountManager.js";
+import * as React from "react";
+
+//#region src/components/agents-sdk/EmployeeStartScreen.d.ts
+interface EmployeeStartConnection {
+  configured: boolean;
+  description?: string;
+  onSelect: () => void;
+}
+interface EmployeeStartActions<Id extends string = string> {
+  onSubmit: (message: PromptInputMessage) => void | Promise<void>;
+  suggestions?: readonly {
+    label: string;
+    value: string;
+  }[];
+  suggestionsError?: boolean;
+  onRetrySuggestions?: () => void;
+  hasConnectedApps?: boolean;
+  slack?: EmployeeStartConnection;
+  discord?: EmployeeStartConnection;
+  mounts?: Omit<WorkspaceMountManagerProps, "trigger">;
+  personalization?: Pick<SetupChecklistGroupProps<Id>, "entries" | "onSelect">;
+}
+/** Canonical welcome screen, including configured connection states and connection menus. */
+declare function EmployeeStartScreen<Id extends string>({
+  brand,
+  start,
+  plugins,
+  renderLink,
+  children
+}: {
+  brand: EmployeeBrand;
+  start: EmployeeStartActions<Id>;
+  plugins?: McpPluginCatalogProps;
+  renderLink: (destination: EmployeeDestination) => React.ReactElement;
+  children: React.ReactNode;
+}): React.JSX.Element;
+//#endregion
+export { EmployeeStartActions, EmployeeStartConnection, EmployeeStartScreen };

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

@@ -0,0 +1,133 @@
+import { C as FolderIcon, G as SlackIcon, I as PaperclipIcon, c as BoxIcon, g as DiscordIcon } from "../../icons-CeGfXO21.js";
+import { Button } from "../foundations/Button.js";
+import { Menu } from "../foundations/Menu.js";
+import { AppIcon } from "../foundations/AppIcon.js";
+import "../foundations/icons.js";
+import { ActionGuideAction } from "../general-purpose/ActionGuide.js";
+import { t as SetupChecklistAction } from "../../SetupChecklist-O6qmgwz4.js";
+import { EmployeeChrome } from "./EmployeeChrome.js";
+import { McpServerPickerAction, McpServerPickerItems } from "./McpServerPicker.js";
+import { WorkspaceMountManager } from "./WorkspaceMountManager.js";
+import "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/agents-sdk/EmployeeStartScreen.tsx
+function SetupActions({ start }) {
+	return /* @__PURE__ */ jsxs(Fragment, { children: [
+		start.slack && !start.slack.configured ? /* @__PURE__ */ jsx(ActionGuideAction, {
+			icon: /* @__PURE__ */ jsx(SlackIcon, {}),
+			onClick: start.slack.onSelect,
+			children: "Connect Slack"
+		}) : null,
+		start.discord && !start.discord.configured ? /* @__PURE__ */ jsx(ActionGuideAction, {
+			icon: /* @__PURE__ */ jsx(DiscordIcon, {}),
+			onClick: start.discord.onSelect,
+			children: "Connect Discord"
+		}) : null,
+		start.mounts ? /* @__PURE__ */ jsx(ActionGuideAction, {
+			icon: /* @__PURE__ */ jsx(FolderIcon, {}),
+			onClick: start.mounts.onAdd,
+			disabled: start.mounts.adding || start.mounts.busyMountId != null,
+			children: "Attach a local folder"
+		}) : null
+	] });
+}
+function StartComposerTray({ plugins, renderLink, start }) {
+	const connections = [{
+		id: "discord",
+		name: "Discord",
+		icon: /* @__PURE__ */ jsx(DiscordIcon, {}),
+		connection: start.discord
+	}, {
+		id: "slack",
+		name: "Slack",
+		icon: /* @__PURE__ */ jsx(SlackIcon, {}),
+		connection: start.slack
+	}].flatMap(({ id, name, icon, connection }) => connection ? [{
+		id,
+		icon,
+		label: connection.configured ? name : `Connect ${name}`,
+		description: connection.description ?? (connection.configured ? "Connected" : `Talk to this employee from ${name}`),
+		onSelect: connection.onSelect
+	}] : []);
+	const hasPluginMenu = Boolean(plugins || connections.length);
+	return /* @__PURE__ */ jsxs(Fragment, { children: [
+		start.personalization ? /* @__PURE__ */ jsx(SetupChecklistAction, {
+			actionLabel: "Prompts",
+			label: "Prompts",
+			entries: start.personalization.entries,
+			onSelect: start.personalization.onSelect
+		}) : null,
+		start.mounts ? /* @__PURE__ */ jsx(WorkspaceMountManager, {
+			...start.mounts,
+			trigger: /* @__PURE__ */ jsxs(Button, {
+				variant: "ghost",
+				color: "neutral",
+				size: "sm",
+				children: [/* @__PURE__ */ jsx(PaperclipIcon, {}), "Attach folder"]
+			})
+		}) : null,
+		hasPluginMenu ? /* @__PURE__ */ jsxs(Menu.Root, { children: [/* @__PURE__ */ jsxs(Button, {
+			type: "button",
+			variant: "ghost",
+			color: "neutral",
+			size: "sm",
+			render: /* @__PURE__ */ jsx(Menu.Trigger, { unstyled: true }),
+			"aria-label": "Connect plugins",
+			children: [/* @__PURE__ */ jsx("span", { children: "Connect plugins" }), /* @__PURE__ */ jsxs(AppIcon.Stack, {
+				"aria-hidden": "true",
+				children: [/* @__PURE__ */ jsx(AppIcon.Root, {
+					size: "xs",
+					variant: "surface",
+					children: /* @__PURE__ */ jsx(SlackIcon, {})
+				}), /* @__PURE__ */ jsx(AppIcon.Root, {
+					size: "xs",
+					variant: "surface",
+					children: /* @__PURE__ */ jsx(DiscordIcon, {})
+				})]
+			})]
+		}), /* @__PURE__ */ jsx(Menu.Portal, { children: /* @__PURE__ */ jsx(Menu.Positioner, {
+			side: "bottom",
+			align: "start",
+			sideOffset: 4,
+			children: /* @__PURE__ */ jsxs(Menu.Popup, {
+				"aria-label": "Plugins",
+				"data-recipe": "wide-scroll-picker",
+				children: [/* @__PURE__ */ jsx(McpServerPickerItems, {
+					actions: connections,
+					servers: plugins?.servers ?? [],
+					mcp: plugins?.mcp,
+					onConnect: plugins?.onConnect,
+					onDisconnect: plugins?.onDisconnect
+				}), /* @__PURE__ */ jsx(McpServerPickerAction, {
+					icon: /* @__PURE__ */ jsx(BoxIcon, {}),
+					label: "Browse plugins",
+					description: plugins?.onConnect ? "Find and connect supported tools" : "See what this browser is connected to",
+					render: renderLink({
+						kind: "view",
+						view: "plugins"
+					})
+				})]
+			})
+		}) })] }) : null
+	] });
+}
+/** Canonical welcome screen, including configured connection states and connection menus. */
+function EmployeeStartScreen({ brand, start, plugins, renderLink, children }) {
+	return /* @__PURE__ */ jsx(EmployeeChrome.Welcome, {
+		brand,
+		suggestions: start.suggestions,
+		suggestionsError: start.suggestionsError,
+		onRetrySuggestions: start.onRetrySuggestions,
+		onSubmit: start.onSubmit,
+		hasConnectedApps: start.hasConnectedApps,
+		setupActions: /* @__PURE__ */ jsx(SetupActions, { start }),
+		tray: /* @__PURE__ */ jsx(StartComposerTray, {
+			start,
+			plugins,
+			renderLink
+		}),
+		children
+	});
+}
+//#endregion
+export { EmployeeStartScreen };