@inf-monkeys-tech/monkeys-design 1.0.66 → 1.0.68

package/dist/components/agent-workbench/index.d.mts

@@ -1,5 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { AgentWorkbenchComposerViewModel, AgentSessionPermissionProfile, AgentSessionViewModel, AgentSessionEvent } from '@inf-monkeys-tech/monkeys';
+import { AgentWorkbenchComposerViewModel, AgentSessionPermissionProfile, AgentWorkbenchQuickStartViewModel, AgentSessionViewModel, AgentSessionEvent } from '@inf-monkeys-tech/monkeys';
+export { AgentWorkbenchQuickStartCategory, AgentWorkbenchQuickStartIcon, AgentWorkbenchQuickStartSection, AgentWorkbenchQuickStartTemplate, AgentWorkbenchQuickStartViewModel } from '@inf-monkeys-tech/monkeys';
 import { d as AgentWorkbenchApprovalIntent, e as AgentWorkbenchArtifactIntent } from '../../details-model-db4bd679f88e.mjs';
 export { A as AgentWorkbenchActivity, a as AgentWorkbenchActivityClassNames, b as AgentWorkbenchActivityModel, c as AgentWorkbenchActivityProps, f as AgentWorkbenchDetailsIntent, g as AgentWorkbenchDetailsModel, h as AgentWorkbenchDetailsState, i as AgentWorkbenchDetailsTab, j as AgentWorkbenchEventOf, E as AgentWorkbenchExploreCardMedia, F as AgentWorkbenchExploreCardMediaProps, k as AgentWorkbenchExploreGroup, l as AgentWorkbenchExploreItem, G as AgentWorkbenchExploreMediaTreatment, H as AgentWorkbenchExploreMediaVariant, m as AgentWorkbenchExploreSidebar, n as AgentWorkbenchExploreSidebarIntent, o as AgentWorkbenchExploreSidebarLabels, p as AgentWorkbenchExploreSidebarProps, q as AgentWorkbenchSidebar, r as AgentWorkbenchSidebarClassNames, s as AgentWorkbenchSidebarIntent, t as AgentWorkbenchSidebarProps, u as AgentWorkbenchTaskDetails, v as AgentWorkbenchTaskDetailsClassNames, w as AgentWorkbenchTaskDetailsProps, x as AgentWorkbenchTerminalModel, y as AgentWorkbenchTool, z as AgentWorkbenchToolClassNames, B as AgentWorkbenchToolProps, C as createAgentWorkbenchActivityModel, D as createAgentWorkbenchDetailsModel } from '../../details-model-db4bd679f88e.mjs';
 import { ReactNode, ComponentType } from 'react';
@@ -34,6 +35,9 @@ type AgentWorkbenchComposerIntent = {
     files: File[];
 } | {
     type: 'request-voice-input';
+} | {
+    type: 'retry-attachment';
+    attachmentId: string;
 } | {
     type: 'select-input-action';
     actionId: string;
@@ -57,52 +61,14 @@ interface AgentWorkbenchComposerClassNames {
     toolbar?: string;
 }
 interface AgentWorkbenchComposerProps {
-    viewModel: AgentWorkbenchComposerViewModel & {
-        inputActions?: readonly ComposerInputAction[];
-        selectedInputActionId?: string;
-    };
+    viewModel: AgentWorkbenchComposerViewModel;
     modeSelectionEnabled?: boolean;
     modeFilteringEnabled?: boolean;
     className?: string;
     classNames?: AgentWorkbenchComposerClassNames;
     onIntent?: (intent: AgentWorkbenchComposerIntent) => void;
 }
-type ComposerInputAction = {
-    id: string;
-    label: string;
-    icon?: 'file-text' | 'image';
-};
 declare function AgentWorkbenchComposer({ viewModel, modeSelectionEnabled, modeFilteringEnabled, className, classNames, onIntent, }: AgentWorkbenchComposerProps): react_jsx_runtime.JSX.Element;
-type AgentWorkbenchQuickStartIcon = 'code' | 'file-text' | 'palette' | 'search' | 'shopping-bag' | 'sparkles';
-interface AgentWorkbenchQuickStartTemplate {
-    id: string;
-    title: string;
-    description?: string;
-    prompt: string;
-    action?: 'prompt' | 'upload';
-    icon?: AgentWorkbenchQuickStartIcon;
-    coverImageUrl?: string;
-    accept?: string;
-    multiple?: boolean;
-    modes?: Array<'chat' | 'work'>;
-}
-interface AgentWorkbenchQuickStartSection {
-    id: string;
-    label: string;
-    templates: AgentWorkbenchQuickStartTemplate[];
-}
-interface AgentWorkbenchQuickStartCategory {
-    id: string;
-    label: string;
-    icon?: AgentWorkbenchQuickStartIcon;
-    sections: AgentWorkbenchQuickStartSection[];
-}
-interface AgentWorkbenchQuickStartViewModel {
-    contract: 'AgentWorkbenchQuickStartViewModel';
-    mode: 'chat' | 'work';
-    categories: AgentWorkbenchQuickStartCategory[];
-    disabled?: boolean;
-}
 type AgentWorkbenchQuickStartIntent = {
     type: 'change-category';
     categoryId?: string;
@@ -246,4 +212,4 @@ interface AgentWorkbenchArtifactWorkspaceProps {
     onIntent?: (intent: AgentWorkbenchArtifactWorkspaceIntent) => void;
 }
 declare function AgentWorkbenchArtifactWorkspace({ artifacts, activeArtifactId, className, renderArtifact, onIntent, }: AgentWorkbenchArtifactWorkspaceProps): null | react_jsx_runtime.JSX.Element;
-export { AgentWorkbenchAction, type AgentWorkbenchActionKind, type AgentWorkbenchActionProps, type AgentWorkbenchActionStatus, AgentWorkbenchApprovalIntent, AgentWorkbenchArtifactIntent, type AgentWorkbenchArtifactItem, type AgentWorkbenchArtifactKind, type AgentWorkbenchArtifactOrigin, type AgentWorkbenchArtifactStatus, AgentWorkbenchArtifactSummary, type AgentWorkbenchArtifactSummaryProps, AgentWorkbenchArtifactWorkspace, type AgentWorkbenchArtifactWorkspaceIntent, type AgentWorkbenchArtifactWorkspaceProps, AgentWorkbenchComposer, type AgentWorkbenchComposerClassNames, type AgentWorkbenchComposerIntent, type AgentWorkbenchComposerProps, AgentWorkbenchProcess, type AgentWorkbenchProcessProps, type AgentWorkbenchProcessStatus, AgentWorkbenchQuickStart, type AgentWorkbenchQuickStartCategory, type AgentWorkbenchQuickStartIcon, type AgentWorkbenchQuickStartIntent, type AgentWorkbenchQuickStartProps, type AgentWorkbenchQuickStartSection, type AgentWorkbenchQuickStartTemplate, type AgentWorkbenchQuickStartViewModel, AgentWorkbenchThread, type AgentWorkbenchThreadClassNames, type AgentWorkbenchThreadMessage, type AgentWorkbenchThreadProps };
+export { AgentWorkbenchAction, type AgentWorkbenchActionKind, type AgentWorkbenchActionProps, type AgentWorkbenchActionStatus, AgentWorkbenchApprovalIntent, AgentWorkbenchArtifactIntent, type AgentWorkbenchArtifactItem, type AgentWorkbenchArtifactKind, type AgentWorkbenchArtifactOrigin, type AgentWorkbenchArtifactStatus, AgentWorkbenchArtifactSummary, type AgentWorkbenchArtifactSummaryProps, AgentWorkbenchArtifactWorkspace, type AgentWorkbenchArtifactWorkspaceIntent, type AgentWorkbenchArtifactWorkspaceProps, AgentWorkbenchComposer, type AgentWorkbenchComposerClassNames, type AgentWorkbenchComposerIntent, type AgentWorkbenchComposerProps, AgentWorkbenchProcess, type AgentWorkbenchProcessProps, type AgentWorkbenchProcessStatus, AgentWorkbenchQuickStart, type AgentWorkbenchQuickStartIntent, type AgentWorkbenchQuickStartProps, AgentWorkbenchThread, type AgentWorkbenchThreadClassNames, type AgentWorkbenchThreadMessage, type AgentWorkbenchThreadProps };

package/dist/components/agent-workbench/index.d.ts

@@ -1,5 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { AgentWorkbenchComposerViewModel, AgentSessionPermissionProfile, AgentSessionViewModel, AgentSessionEvent } from '@inf-monkeys-tech/monkeys';
+import { AgentWorkbenchComposerViewModel, AgentSessionPermissionProfile, AgentWorkbenchQuickStartViewModel, AgentSessionViewModel, AgentSessionEvent } from '@inf-monkeys-tech/monkeys';
+export { AgentWorkbenchQuickStartCategory, AgentWorkbenchQuickStartIcon, AgentWorkbenchQuickStartSection, AgentWorkbenchQuickStartTemplate, AgentWorkbenchQuickStartViewModel } from '@inf-monkeys-tech/monkeys';
 import { d as AgentWorkbenchApprovalIntent, e as AgentWorkbenchArtifactIntent } from '../../details-model-db4bd679f88e.js';
 export { A as AgentWorkbenchActivity, a as AgentWorkbenchActivityClassNames, b as AgentWorkbenchActivityModel, c as AgentWorkbenchActivityProps, f as AgentWorkbenchDetailsIntent, g as AgentWorkbenchDetailsModel, h as AgentWorkbenchDetailsState, i as AgentWorkbenchDetailsTab, j as AgentWorkbenchEventOf, E as AgentWorkbenchExploreCardMedia, F as AgentWorkbenchExploreCardMediaProps, k as AgentWorkbenchExploreGroup, l as AgentWorkbenchExploreItem, G as AgentWorkbenchExploreMediaTreatment, H as AgentWorkbenchExploreMediaVariant, m as AgentWorkbenchExploreSidebar, n as AgentWorkbenchExploreSidebarIntent, o as AgentWorkbenchExploreSidebarLabels, p as AgentWorkbenchExploreSidebarProps, q as AgentWorkbenchSidebar, r as AgentWorkbenchSidebarClassNames, s as AgentWorkbenchSidebarIntent, t as AgentWorkbenchSidebarProps, u as AgentWorkbenchTaskDetails, v as AgentWorkbenchTaskDetailsClassNames, w as AgentWorkbenchTaskDetailsProps, x as AgentWorkbenchTerminalModel, y as AgentWorkbenchTool, z as AgentWorkbenchToolClassNames, B as AgentWorkbenchToolProps, C as createAgentWorkbenchActivityModel, D as createAgentWorkbenchDetailsModel } from '../../details-model-db4bd679f88e.js';
 import { ReactNode, ComponentType } from 'react';
@@ -34,6 +35,9 @@ type AgentWorkbenchComposerIntent = {
     files: File[];
 } | {
     type: 'request-voice-input';
+} | {
+    type: 'retry-attachment';
+    attachmentId: string;
 } | {
     type: 'select-input-action';
     actionId: string;
@@ -57,52 +61,14 @@ interface AgentWorkbenchComposerClassNames {
     toolbar?: string;
 }
 interface AgentWorkbenchComposerProps {
-    viewModel: AgentWorkbenchComposerViewModel & {
-        inputActions?: readonly ComposerInputAction[];
-        selectedInputActionId?: string;
-    };
+    viewModel: AgentWorkbenchComposerViewModel;
     modeSelectionEnabled?: boolean;
     modeFilteringEnabled?: boolean;
     className?: string;
     classNames?: AgentWorkbenchComposerClassNames;
     onIntent?: (intent: AgentWorkbenchComposerIntent) => void;
 }
-type ComposerInputAction = {
-    id: string;
-    label: string;
-    icon?: 'file-text' | 'image';
-};
 declare function AgentWorkbenchComposer({ viewModel, modeSelectionEnabled, modeFilteringEnabled, className, classNames, onIntent, }: AgentWorkbenchComposerProps): react_jsx_runtime.JSX.Element;
-type AgentWorkbenchQuickStartIcon = 'code' | 'file-text' | 'palette' | 'search' | 'shopping-bag' | 'sparkles';
-interface AgentWorkbenchQuickStartTemplate {
-    id: string;
-    title: string;
-    description?: string;
-    prompt: string;
-    action?: 'prompt' | 'upload';
-    icon?: AgentWorkbenchQuickStartIcon;
-    coverImageUrl?: string;
-    accept?: string;
-    multiple?: boolean;
-    modes?: Array<'chat' | 'work'>;
-}
-interface AgentWorkbenchQuickStartSection {
-    id: string;
-    label: string;
-    templates: AgentWorkbenchQuickStartTemplate[];
-}
-interface AgentWorkbenchQuickStartCategory {
-    id: string;
-    label: string;
-    icon?: AgentWorkbenchQuickStartIcon;
-    sections: AgentWorkbenchQuickStartSection[];
-}
-interface AgentWorkbenchQuickStartViewModel {
-    contract: 'AgentWorkbenchQuickStartViewModel';
-    mode: 'chat' | 'work';
-    categories: AgentWorkbenchQuickStartCategory[];
-    disabled?: boolean;
-}
 type AgentWorkbenchQuickStartIntent = {
     type: 'change-category';
     categoryId?: string;
@@ -246,4 +212,4 @@ interface AgentWorkbenchArtifactWorkspaceProps {
     onIntent?: (intent: AgentWorkbenchArtifactWorkspaceIntent) => void;
 }
 declare function AgentWorkbenchArtifactWorkspace({ artifacts, activeArtifactId, className, renderArtifact, onIntent, }: AgentWorkbenchArtifactWorkspaceProps): null | react_jsx_runtime.JSX.Element;
-export { AgentWorkbenchAction, type AgentWorkbenchActionKind, type AgentWorkbenchActionProps, type AgentWorkbenchActionStatus, AgentWorkbenchApprovalIntent, AgentWorkbenchArtifactIntent, type AgentWorkbenchArtifactItem, type AgentWorkbenchArtifactKind, type AgentWorkbenchArtifactOrigin, type AgentWorkbenchArtifactStatus, AgentWorkbenchArtifactSummary, type AgentWorkbenchArtifactSummaryProps, AgentWorkbenchArtifactWorkspace, type AgentWorkbenchArtifactWorkspaceIntent, type AgentWorkbenchArtifactWorkspaceProps, AgentWorkbenchComposer, type AgentWorkbenchComposerClassNames, type AgentWorkbenchComposerIntent, type AgentWorkbenchComposerProps, AgentWorkbenchProcess, type AgentWorkbenchProcessProps, type AgentWorkbenchProcessStatus, AgentWorkbenchQuickStart, type AgentWorkbenchQuickStartCategory, type AgentWorkbenchQuickStartIcon, type AgentWorkbenchQuickStartIntent, type AgentWorkbenchQuickStartProps, type AgentWorkbenchQuickStartSection, type AgentWorkbenchQuickStartTemplate, type AgentWorkbenchQuickStartViewModel, AgentWorkbenchThread, type AgentWorkbenchThreadClassNames, type AgentWorkbenchThreadMessage, type AgentWorkbenchThreadProps };
+export { AgentWorkbenchAction, type AgentWorkbenchActionKind, type AgentWorkbenchActionProps, type AgentWorkbenchActionStatus, AgentWorkbenchApprovalIntent, AgentWorkbenchArtifactIntent, type AgentWorkbenchArtifactItem, type AgentWorkbenchArtifactKind, type AgentWorkbenchArtifactOrigin, type AgentWorkbenchArtifactStatus, AgentWorkbenchArtifactSummary, type AgentWorkbenchArtifactSummaryProps, AgentWorkbenchArtifactWorkspace, type AgentWorkbenchArtifactWorkspaceIntent, type AgentWorkbenchArtifactWorkspaceProps, AgentWorkbenchComposer, type AgentWorkbenchComposerClassNames, type AgentWorkbenchComposerIntent, type AgentWorkbenchComposerProps, AgentWorkbenchProcess, type AgentWorkbenchProcessProps, type AgentWorkbenchProcessStatus, AgentWorkbenchQuickStart, type AgentWorkbenchQuickStartIntent, type AgentWorkbenchQuickStartProps, AgentWorkbenchThread, type AgentWorkbenchThreadClassNames, type AgentWorkbenchThreadMessage, type AgentWorkbenchThreadProps };

package/dist/components/agent-workbench/index.js

@@ -184,6 +184,8 @@ var enUS = {
         moveDown: "Move message down",
         queued: "Queued messages",
         uploading: "Uploading",
+        uploadFailed: "Upload failed",
+        retryAttachment: "Retry attachment upload",
         noModels: "No models available",
         message: "Message",
         attachmentOnly: "Attachment",
@@ -1097,23 +1099,25 @@ function AgentWorkbenchComposer({
           }
         ) : null,
         /* @__PURE__ */ jsxRuntime.jsxs("div", { ref: surfaceRef, className: "agent-workbench-composer__surface min-w-0 max-w-full rounded-lg border border-input bg-background p-3 shadow-sm focus-within:border-ring focus-within:ring-2 focus-within:ring-ring/30", children: [
-          viewModel.attachments.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn2("mb-2 flex max-w-full gap-2 overflow-x-auto", classNames?.attachments), children: viewModel.attachments.map((attachment) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex size-16 shrink-0 items-center justify-center overflow-hidden rounded-md border border-border bg-muted", children: [
-            attachment.previewUrl && attachment.mediaType?.startsWith("image/") ? /* @__PURE__ */ jsxRuntime.jsx("img", { src: attachment.previewUrl, alt: "", className: "size-full object-cover" }) : attachment.mediaType?.startsWith("image/") ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Image, { className: "size-5 text-muted-foreground" }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.File, { className: "size-5 text-muted-foreground" }),
-            attachment.status === "uploading" ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute inset-0 flex items-center justify-center bg-background/80 text-[10px] font-medium", children: messages.composer.uploading }) : null,
-            /* @__PURE__ */ jsxRuntime.jsx(
-              Button,
-              {
-                type: "button",
-                variant: "secondary",
-                size: "icon",
-                className: "absolute right-1 top-1 !size-5 min-w-5 rounded-full bg-background/90 p-0 text-foreground shadow [&_svg]:!size-3",
-                "aria-label": messages.composer.removeAttachment,
-                onClick: () => onIntent?.({ type: "remove-attachment", attachmentId: attachment.id }),
-                children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "size-3" })
-              }
-            ),
-            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute inset-x-0 bottom-0 truncate bg-background/85 px-1 py-0.5 text-[9px]", children: attachment.name })
-          ] }, attachment.id)) }) : null,
+          viewModel.attachments.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { "data-agent-workbench-composer-attachments": true, className: cn2("mb-2 flex max-w-full gap-2 overflow-x-auto overscroll-x-contain pb-1", classNames?.attachments), children: viewModel.attachments.map((attachment) => {
+            const isAttachmentError = attachment.status === "error";
+            const isAttachmentUploading = attachment.status === "uploading";
+            return /* @__PURE__ */ jsxRuntime.jsxs("div", { role: isAttachmentError ? "alert" : void 0, className: cn2("flex h-14 min-w-48 max-w-64 shrink-0 items-center gap-2 rounded-md border bg-muted/45 p-1.5", isAttachmentError ? "border-destructive/50 bg-destructive/5" : "border-border"), children: [
+              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex size-10 shrink-0 items-center justify-center overflow-hidden rounded bg-muted", children: attachment.previewUrl && attachment.mediaType?.startsWith("image/") ? /* @__PURE__ */ jsxRuntime.jsx("img", { src: attachment.previewUrl, alt: "", className: "size-full object-cover" }) : attachment.mediaType?.startsWith("image/") ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Image, { className: "size-5 text-muted-foreground" }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.File, { className: "size-5 text-muted-foreground" }) }),
+              /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "min-w-0 flex-1", children: [
+                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "block truncate text-xs font-medium text-foreground", title: attachment.name, children: attachment.name }),
+                /* @__PURE__ */ jsxRuntime.jsxs("span", { className: cn2("mt-0.5 flex items-center gap-1 text-[11px]", isAttachmentError ? "text-destructive-text" : "text-muted-foreground"), children: [
+                  isAttachmentUploading ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.LoaderCircle, { className: "size-3 animate-spin", "aria-hidden": "true" }) : null,
+                  isAttachmentError ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.CircleAlert, { className: "size-3", "aria-hidden": "true" }) : null,
+                  isAttachmentUploading ? messages.composer.uploading : isAttachmentError ? messages.composer.uploadFailed : attachment.mediaType || messages.composer.attachmentOnly
+                ] })
+              ] }),
+              /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex shrink-0 items-center gap-0.5", children: [
+                isAttachmentError ? /* @__PURE__ */ jsxRuntime.jsx(Button, { type: "button", variant: "ghost", size: "icon", className: "!size-7 min-w-7 shrink-0 p-0 text-destructive-text hover:text-destructive-text", "aria-label": `${messages.composer.retryAttachment}: ${attachment.name}`, onClick: () => onIntent?.({ type: "retry-attachment", attachmentId: attachment.id }), children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.RotateCcw, { className: "size-3.5" }) }) : null,
+                /* @__PURE__ */ jsxRuntime.jsx(Button, { type: "button", variant: "ghost", size: "icon", className: "!size-7 min-w-7 shrink-0 p-0 text-muted-foreground hover:text-foreground", "aria-label": `${messages.composer.removeAttachment}: ${attachment.name}`, onClick: () => onIntent?.({ type: "remove-attachment", attachmentId: attachment.id }), children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "size-3.5" }) })
+              ] })
+            ] }, attachment.id);
+          }) }) : null,
           /* @__PURE__ */ jsxRuntime.jsx(
             AutosizeTextarea,
             {
@@ -1122,7 +1126,7 @@ function AgentWorkbenchComposer({
               maxHeight: 256,
               "aria-label": messages.composer.message,
               placeholder: viewModel.placeholder,
-              className: cn2("min-w-0 w-full resize-none rounded-none border-0 bg-transparent px-0 py-0 text-sm leading-relaxed text-foreground shadow-none focus-visible:ring-0 focus-visible:ring-offset-0", classNames?.textarea),
+              className: cn2("min-w-0 w-full resize-none overflow-y-auto rounded-none border-0 bg-transparent px-0 py-0 text-sm leading-relaxed text-foreground shadow-none focus-visible:ring-0 focus-visible:ring-offset-0", classNames?.textarea),
               onChange: (event) => onIntent?.({ type: "change-value", value: event.target.value }),
               onKeyDown: (event) => {
                 if (event.key === "Enter" && !event.shiftKey && !event.nativeEvent.isComposing) {
@@ -1133,7 +1137,7 @@ function AgentWorkbenchComposer({
             }
           ),
           /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn2("agent-workbench-composer__toolbar mt-2 flex min-h-8 min-w-0 max-w-full items-center gap-2", isNarrow ? "flex-wrap" : "flex-nowrap", classNames?.toolbar), children: [
-            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn2("agent-workbench-composer__controls flex min-w-0 max-w-full flex-1 items-center gap-1.5", isNarrow ? "w-full flex-wrap" : "flex-nowrap"), children: [
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { "data-agent-workbench-composer-controls": true, className: cn2("agent-workbench-composer__controls flex min-w-0 max-w-full flex-1 items-center gap-1.5", isNarrow ? "w-full flex-wrap" : "flex-nowrap overflow-x-auto overscroll-x-contain pb-1"), children: [
               viewModel.capabilities.attachments ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
                 /* @__PURE__ */ jsxRuntime.jsx(Button, { type: "button", variant: "ghost", size: "icon", className: iconButtonClass, "aria-label": messages.composer.attach, onClick: () => fileInputRef.current?.click(), children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Paperclip, { className: "size-4" }) }),
                 /* @__PURE__ */ jsxRuntime.jsx(
@@ -1166,7 +1170,7 @@ function AgentWorkbenchComposer({
                           className: "h-7 min-w-0 gap-1.5 px-2.5 text-xs text-foreground/75 shadow-none hover:text-foreground data-[state=active]:bg-primary/10 data-[state=active]:text-primary data-[state=active]:shadow-none",
                           children: [
                             action.icon ? /* @__PURE__ */ jsxRuntime.jsx(ActionIcon, { className: "size-3.5" }) : null,
-                            action.label
+                            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "max-w-32 truncate", children: action.label })
                           ]
                         },
                         action.id