@workerdeck/ui 2.1.0 → 2.2.0

package/build/{SessionPanel-DrMj8Yv0.mjs → SessionPanel-ErvQUyHe.mjs}

@@ -4385,6 +4385,22 @@ function hashtagTrigger(opts = {}) {
 		...rest
 	};
 }
+/**
+* Creates a **launch** trigger: `onActivate` fires on keydown and the character
+* never enters the editor. For flipping the composer into another mode, or
+* opening a surface outside it.
+*
+* Defaults: `position: 'start'`, `mode: 'launch'`.
+*/
+function launchTrigger(opts) {
+	const { char, ...rest } = opts;
+	return {
+		char,
+		position: "start",
+		mode: "launch",
+		...rest
+	};
+}
 //#endregion
 //#region src/components/agent/transcript-variant.tsx
 const VariantContext = createContext("cards");
@@ -5529,6 +5545,8 @@ function TerminalSurface({ fontSize, lineHeight, bleed, affordances, className,
 }
 //#endregion
 //#region src/components/agent/Composer.tsx
+const SHELL_PLACEHOLDER = "Run a command on the host…";
+const SHELL_HINT = "! shell mode · esc to exit";
 function cleanName(name) {
 	return name.replace(/\s*\(MCP\)$/i, "");
 }
@@ -5542,13 +5560,14 @@ function matchScore(query, haystacks) {
 	if (lowered.some((h) => h.startsWith(needle))) return 2;
 	return lowered.some((h) => h.includes(needle)) ? 1 : 0;
 }
-function Composer({ onSend, onInterrupt, busy, disabled, placeholder = "Message the agent…", commands, skills, onSearchFiles, attachments, toolbar, layout = "stacked", fontSize, lineHeight, affordances, draft, className, ref }) {
+function Composer({ onSend, onInterrupt, busy, disabled, placeholder = "Message the agent…", commands, skills, onSearchFiles, onShellCommand, attachments, toolbar, layout = "stacked", fontSize, lineHeight, affordances, draft, className, ref }) {
 	const inline = layout === "inline";
 	const terminal = useTranscriptVariant() === "terminal";
 	const [initialDraft] = useState(() => draft?.initialText ?? "");
 	const { bind, plainText, isEmpty, clear, focus } = usePromptAreaState(initialDraft === "" ? void 0 : { initialValue: plainTextToSegments(initialDraft) });
 	const fileInput = useRef(null);
 	const [dragging, setDragging] = useState(false);
+	const [shellMode, setShellMode] = useState(false);
 	useImperativeHandle(ref, () => ({
 		insertText: (text) => {
 			const prefix = plainText.length > 0 && !/\s$/.test(plainText) ? " " : "";
@@ -5642,11 +5661,17 @@ function Composer({ onSend, onInterrupt, busy, disabled, placeholder = "Message
 			chipClassName: "font-mono",
 			emptyMessage: "No matching files"
 		}));
+		if (onShellCommand) configured.push(launchTrigger({
+			char: "!",
+			accessibilityLabel: "shell mode",
+			onActivate: () => setShellMode(true)
+		}));
 		return configured.length > 0 ? configured : void 0;
 	}, [
 		commands,
 		skills,
-		onSearchFiles
+		onSearchFiles,
+		onShellCommand
 	]);
 	const saveDraft = draft?.save;
 	useEffect(() => {
@@ -5656,12 +5681,35 @@ function Composer({ onSend, onInterrupt, busy, disabled, placeholder = "Message
 	const canSend = !disabled && (!isEmpty || staged.length > 0) && !attachments?.uploading && !attachments?.hasFailure;
 	const submit = () => {
 		if (!canSend) return;
+		if (shellMode) {
+			const command = plainText.trim();
+			if (command === "") return;
+			onShellCommand?.(command);
+			setShellMode(false);
+			draft?.clear();
+			clear();
+			focus();
+			return;
+		}
 		onSend(plainText.trim(), attachments?.readyIds ?? []);
 		attachments?.clear();
 		draft?.clear();
 		clear();
 		focus();
 	};
+	const leaveShellMode = () => {
+		setShellMode(false);
+		focus();
+	};
+	const shellKeys = shellMode ? {
+		onEscape: leaveShellMode,
+		onKeyDown: (e) => {
+			if (e.key === "Backspace" && isEmpty) {
+				e.preventDefault();
+				leaveShellMode();
+			}
+		}
+	} : {};
 	const pick = (files) => {
 		if (files && files.length > 0) attachments?.add(files);
 	};
@@ -5685,7 +5733,13 @@ function Composer({ onSend, onInterrupt, busy, disabled, placeholder = "Message
 		onClick: () => fileInput.current?.click(),
 		children: /* @__PURE__ */ jsx(Paperclip, { className: "size-4" })
 	})] }) : null;
-	const gutter = busy ? /* @__PURE__ */ jsx(GlyphButton, {
+	const gutter = shellMode ? /* @__PURE__ */ jsx(GlyphButton, {
+		gutter: true,
+		label: "Leave shell mode",
+		tone: "magenta",
+		onClick: leaveShellMode,
+		children: "!"
+	}) : busy ? /* @__PURE__ */ jsx(GlyphButton, {
 		gutter: true,
 		label: "Interrupt",
 		tone: "yellow",
@@ -5768,7 +5822,7 @@ function Composer({ onSend, onInterrupt, busy, disabled, placeholder = "Message
 				affordances,
 				bleed: "1ch",
 				"data-dragging": dragging || void 0,
-				className: cn("term-composer", disabled && "opacity-60"),
+				className: cn("term-composer", shellMode && "term-composer-shell", disabled && "opacity-60"),
 				children: /* @__PURE__ */ jsxs("div", {
 					className: "term-composer-body",
 					children: [
@@ -5776,7 +5830,7 @@ function Composer({ onSend, onInterrupt, busy, disabled, placeholder = "Message
 						/* @__PURE__ */ jsxs("div", {
 							className: "term-row",
 							children: [
-								canAttach ? fileField : null,
+								canAttach && !shellMode ? fileField : null,
 								gutter,
 								/* @__PURE__ */ jsxs("div", {
 									className: "flex min-w-0 items-start",
@@ -5787,17 +5841,27 @@ function Composer({ onSend, onInterrupt, busy, disabled, placeholder = "Message
 										normalizeBullets: false,
 										onSubmit: submit,
 										disabled,
-										placeholder: disabled ? "Session ended" : placeholder,
+										placeholder: disabled ? "Session ended" : shellMode ? SHELL_PLACEHOLDER : placeholder,
 										minHeight: line,
 										maxHeight: line * 10,
-										"aria-label": "Message the agent",
+										"aria-label": shellMode ? "Run a shell command" : "Message the agent",
 										className: "term-composer-field min-w-0 flex-1",
-										onImagePaste: (file) => attachments?.add([file])
+										onImagePaste: (file) => attachments?.add([file]),
+										...shellKeys
 									}), submitButton]
 								})
 							]
 						}),
-						toolbar ? /* @__PURE__ */ jsxs("div", {
+						shellMode ? /* @__PURE__ */ jsxs("div", {
+							className: "term-row",
+							children: [/* @__PURE__ */ jsx("span", {
+								"aria-hidden": true,
+								className: "term-gutter"
+							}), /* @__PURE__ */ jsx("span", {
+								className: "term-composer-shell-hint",
+								children: SHELL_HINT
+							})]
+						}) : toolbar ? /* @__PURE__ */ jsxs("div", {
 							className: "term-row",
 							children: [/* @__PURE__ */ jsx("span", {
 								"aria-hidden": true,
@@ -5817,11 +5881,11 @@ function Composer({ onSend, onInterrupt, busy, disabled, placeholder = "Message
 		className: cn("px-[var(--wd-composer-padding)] pb-[var(--wd-composer-padding)]", className),
 		children: [/* @__PURE__ */ jsxs("div", {
 			...dropHandlers,
-			className: cn("mx-auto w-full max-w-[var(--wd-transcript-max-width)] overflow-hidden border border-border bg-bg", "transition-colors rounded-lg shadow-(--shadow-xs)", "focus-within:border-ring focus-within:ring-2 focus-within:ring-ring/30", dragging && "border-ring ring-2 ring-ring/30", disabled && "opacity-60"),
+			className: cn("mx-auto w-full max-w-[var(--wd-transcript-max-width)] overflow-hidden border border-border bg-bg", "transition-colors rounded-lg shadow-(--shadow-xs)", "focus-within:border-ring focus-within:ring-2 focus-within:ring-ring/30", dragging && "border-ring ring-2 ring-ring/30", shellMode && "border-[var(--wd-shell-accent)] focus-within:border-[var(--wd-shell-accent)] focus-within:ring-[var(--wd-shell-accent)]/30", disabled && "opacity-60"),
 			children: [staged.length > 0 && attachments ? /* @__PURE__ */ jsx(AttachmentStrip, { attachments }) : null, inline ? /* @__PURE__ */ jsxs("div", {
 				className: "flex items-end gap-1 p-1",
 				children: [
-					attach,
+					shellMode ? /* @__PURE__ */ jsx(ShellBadge, { onLeave: leaveShellMode }) : attach,
 					/* @__PURE__ */ jsx(PromptArea, {
 						...bind,
 						triggers,
@@ -5829,12 +5893,13 @@ function Composer({ onSend, onInterrupt, busy, disabled, placeholder = "Message
 						normalizeBullets: false,
 						onSubmit: submit,
 						disabled,
-						placeholder: disabled ? "Session ended" : placeholder,
+						placeholder: disabled ? "Session ended" : shellMode ? SHELL_PLACEHOLDER : placeholder,
 						minHeight: 20,
 						maxHeight: 192,
-						"aria-label": "Message the agent",
+						"aria-label": shellMode ? "Run a shell command" : "Message the agent",
 						className: "min-w-0 flex-1 py-1 text-body-sm text-text",
-						onImagePaste: (file) => attachments?.add([file])
+						onImagePaste: (file) => attachments?.add([file]),
+						...shellKeys
 					}),
 					submitButton
 				]
@@ -5845,17 +5910,21 @@ function Composer({ onSend, onInterrupt, busy, disabled, placeholder = "Message
 				normalizeBullets: false,
 				onSubmit: submit,
 				disabled,
-				placeholder: disabled ? "Session ended" : placeholder,
+				placeholder: disabled ? "Session ended" : shellMode ? SHELL_PLACEHOLDER : placeholder,
 				minHeight: 28,
 				maxHeight: 192,
-				"aria-label": "Message the agent",
+				"aria-label": shellMode ? "Run a shell command" : "Message the agent",
 				className: "px-3 pt-2.5 pb-0 text-body-sm text-text",
-				onImagePaste: (file) => attachments?.add([file])
+				onImagePaste: (file) => attachments?.add([file]),
+				...shellKeys
 			}), /* @__PURE__ */ jsxs("div", {
 				className: "flex items-center justify-between gap-2 px-2 pb-2",
 				children: [/* @__PURE__ */ jsxs("div", {
 					className: "flex min-w-0 items-center gap-1",
-					children: [attach, toolbar]
+					children: [shellMode ? /* @__PURE__ */ jsx(ShellBadge, { onLeave: leaveShellMode }) : attach, shellMode ? /* @__PURE__ */ jsx("span", {
+						className: "text-label text-text-muted",
+						children: SHELL_HINT
+					}) : toolbar]
 				}), submitButton]
 			})] })]
 		}), errorRow]
@@ -5933,6 +6002,16 @@ function extensionOf(name) {
 	const dot = name.lastIndexOf(".");
 	return dot > 0 ? name.slice(dot + 1).toUpperCase() : "FILE";
 }
+function ShellBadge({ onLeave }) {
+	return /* @__PURE__ */ jsx("button", {
+		type: "button",
+		"aria-label": "Leave shell mode",
+		title: "Leave shell mode",
+		onClick: onLeave,
+		className: "shrink-0 rounded px-1.5 py-0.5 font-mono text-label font-semibold text-[var(--wd-shell-accent)]",
+		children: "!"
+	});
+}
 //#endregion
 //#region src/lib/css.ts
 function cssColor(color) {
@@ -11069,7 +11148,7 @@ function SessionPanel({ client, sessionId, header, panelSurface = "internal", st
 	const [panel, setPanel] = useState();
 	const [showCompletedTasks, setShowCompletedTasks] = useState(false);
 	const [taskReveal, setTaskReveal] = useState();
-	const { state, connection, replaying, protocolMismatch, models, effectiveModel, handle, send, approve, deny, interrupt, setModel, setPermissionMode, reconnectNow, loadFullResult } = useClaudeSession(client, sessionId, {
+	const { state, connection, replaying, protocolMismatch, shell, models, effectiveModel, handle, send, runShell, approve, deny, interrupt, setModel, setPermissionMode, reconnectNow, loadFullResult } = useClaudeSession(client, sessionId, {
 		onProtocolError: setProtocolError,
 		cacheTranscript
 	});
@@ -11479,6 +11558,7 @@ function SessionPanel({ client, sessionId, header, panelSurface = "internal", st
 									attachments,
 									draft,
 									onSearchFiles: hostFiles.available ? searchComposerFiles : void 0,
+									onShellCommand: shell ? runShell : void 0,
 									layout: controlsExternal ? "inline" : "stacked",
 									toolbar: controlsExternal ? void 0 : sessionControls,
 									fontSize: effectiveTermFontSize,
@@ -11612,6 +11692,6 @@ function Notice({ level, onDismiss, children }) {
 	});
 }
 //#endregion
-export { Ink as $, PERMISSION_MODES as A, DialogHeader as At, TaskList as B, SelectItem as Bt, TerminalPermissionPrompt as C, Tip as Ct, SubagentStrip as D, DialogBody as Dt, parseUserQuestions as E, Dialog$1 as Et, SkillsDialog as F, MenuItem as Ft, TerminalSurface as G, Input as Gt, contextNote as H, SelectTrigger as Ht, McpDialog as I, MenuSeparator as It, TerminalMarkdown as J, Button as Jt, ToolTitleProvider as K, Badge as Kt, HostFilesDialog as L, MenuTrigger as Lt, permissionModeChoices as M, DialogTrigger as Mt, permissionModeMeta as N, Menu$1 as Nt, PermissionPrompt as O, DialogClose as Ot, ModelSelect as P, MenuContent as Pt, Blank as Q, EntryIcon as R, Select$1 as Rt, TerminalQuestionPrompt as S, copyText as St, QuestionPrompt as T, TooltipProvider as Tt, Composer as U, SelectValue as Ut, ContextDialog as V, SelectItemText as Vt, skillPrompt as W, PortalScope as Wt, previewPatch as X, cn as Xt, TerminalDiff as Y, buttonVariants as Yt, Band as Z, ConversationContent as _, ProgressRing as _t, Transcript as a, toolIcon as at, STATUS_META as b, Spinner as bt, PromptTokenText as c, useTranscriptDensity as ct, FileCard as d, hashtagTrigger as dt, Row as et, TerminalItemView as f, mentionTrigger as ft, Conversation as g, segmentsToPlainText as gt, Loader as h, plainTextToSegments as ht, useMinuteClock as i, isMutatingTool as it, PermissionModeSelect as j, DialogRow as jt, Response as k, DialogContent as kt, Message as l, useTranscriptVariant as lt, SessionEmptyState as m, PromptArea as mt, UsageDialog as n, WithActions as nt, ToolCallCard as o, TranscriptDensityProvider as ot, TerminalTranscript as p, usePromptAreaState as pt, useToolTitle as q, badgeVariants as qt, UsageMeters as r, useAffordances as rt, Reasoning as s, TranscriptVariantProvider as st, SessionPanel as t, CopyAction as tt, MessageContent as u, commandTrigger as ut, ConversationScrollButton as v, Splitter as vt, QUESTION_BEHAVIORS as w, TooltipContent as wt, SessionInfoDialog as x, CopyButton as xt, StatusBar as y, CodeBlock as yt, TasksDialog as z, SelectContent as zt };
+export { Ink as $, PERMISSION_MODES as A, DialogContent as At, TaskList as B, SelectContent as Bt, TerminalPermissionPrompt as C, copyText as Ct, SubagentStrip as D, Dialog$1 as Dt, parseUserQuestions as E, TooltipProvider as Et, SkillsDialog as F, MenuContent as Ft, TerminalSurface as G, PortalScope as Gt, contextNote as H, SelectItemText as Ht, McpDialog as I, MenuItem as It, TerminalMarkdown as J, badgeVariants as Jt, ToolTitleProvider as K, Input as Kt, HostFilesDialog as L, MenuSeparator as Lt, permissionModeChoices as M, DialogRow as Mt, permissionModeMeta as N, DialogTrigger as Nt, PermissionPrompt as O, DialogBody as Ot, ModelSelect as P, Menu$1 as Pt, Blank as Q, EntryIcon as R, MenuTrigger as Rt, TerminalQuestionPrompt as S, CopyButton as St, QuestionPrompt as T, TooltipContent as Tt, Composer as U, SelectTrigger as Ut, ContextDialog as V, SelectItem as Vt, skillPrompt as W, SelectValue as Wt, previewPatch as X, buttonVariants as Xt, TerminalDiff as Y, Button as Yt, Band as Z, cn as Zt, ConversationContent as _, segmentsToPlainText as _t, Transcript as a, toolIcon as at, STATUS_META as b, CodeBlock as bt, PromptTokenText as c, useTranscriptDensity as ct, FileCard as d, hashtagTrigger as dt, Row as et, TerminalItemView as f, launchTrigger as ft, Conversation as g, plainTextToSegments as gt, Loader as h, PromptArea as ht, useMinuteClock as i, isMutatingTool as it, PermissionModeSelect as j, DialogHeader as jt, Response as k, DialogClose as kt, Message as l, useTranscriptVariant as lt, SessionEmptyState as m, usePromptAreaState as mt, UsageDialog as n, WithActions as nt, ToolCallCard as o, TranscriptDensityProvider as ot, TerminalTranscript as p, mentionTrigger as pt, useToolTitle as q, Badge as qt, UsageMeters as r, useAffordances as rt, Reasoning as s, TranscriptVariantProvider as st, SessionPanel as t, CopyAction as tt, MessageContent as u, commandTrigger as ut, ConversationScrollButton as v, ProgressRing as vt, QUESTION_BEHAVIORS as w, Tip as wt, SessionInfoDialog as x, Spinner as xt, StatusBar as y, Splitter as yt, TasksDialog as z, Select$1 as zt };
 
-//# sourceMappingURL=SessionPanel-DrMj8Yv0.mjs.map
+//# sourceMappingURL=SessionPanel-ErvQUyHe.mjs.map