@mcp-b/react-components 0.50.0 → 0.50.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (29) hide show
  1. package/dist/components/agents-sdk/AgentChat.js +4 -5
  2. package/dist/components/agents-sdk/AgentEvent.js +2 -2
  3. package/dist/components/agents-sdk/EmployeeChrome.js +3 -3
  4. package/dist/components/agents-sdk/EmployeeSchedules.js +2 -2
  5. package/dist/components/agents-sdk/EmployeeStartScreen.js +2 -2
  6. package/dist/components/agents-sdk/ManagerAccountActions.js +1 -1
  7. package/dist/components/agents-sdk/ManagerOffice.js +1 -1
  8. package/dist/components/agents-sdk/ManagerOfficeScreens.js +1 -1
  9. package/dist/components/agents-sdk/McpPluginCatalog.js +1 -1
  10. package/dist/components/agents-sdk/ModelEndpointDialog.js +1 -1
  11. package/dist/components/agents-sdk/SubagentRunPanel.js +1 -1
  12. package/dist/components/agents-sdk/ThinkChatActivity.js +2 -2
  13. package/dist/components/agents-sdk/ThinkRoutineActions.js +1 -1
  14. package/dist/components/agents-sdk/ThinkRoutineForm.js +2 -2
  15. package/dist/components/agents-sdk/ThinkThreadPicker.js +1 -1
  16. package/dist/components/agents-sdk/WorkspaceCorrespondence.js +1 -1
  17. package/dist/components/agents-sdk/WorkspaceExecution.js +2 -2
  18. package/dist/components/agents-sdk/WorkspaceProject.js +1 -1
  19. package/dist/components/agents-sdk/WorkspaceUserScript.js +1 -1
  20. package/dist/components/foundations/ToggleGroup.d.ts +1 -1
  21. package/dist/components/foundations/ToggleGroup.js +1 -1
  22. package/dist/components/general-purpose/PricingUsageCalculator.js +1 -1
  23. package/dist/components/general-purpose/ThemeModeControl.js +1 -1
  24. package/dist/components/nanites/AgentToolDetail.js +4 -4
  25. package/dist/styles/agent-chat.css +12 -4
  26. package/dist/styles/message.css +4 -0
  27. package/package.json +2 -2
  28. package/dist/{ManagerOffice-5pEFpoV3.js → ManagerOffice-CqOggftJ.js} +1 -1
  29. package/dist/{workspace-assets-wW_lQLYK.js → workspace-assets-C3QT6UlQ.js} +1 -1
@@ -8,11 +8,11 @@ import { AgentMessageParts } from "../ai-sdk/AgentMessageParts.js";
8
8
  import { Marker, MarkerContent } from "../foundations/Marker.js";
9
9
  import { VirtualMessageScroller } from "../ai-sdk/MessageScrollerVirtual.js";
10
10
  import { Queue, QueueItem, QueueItemAction, QueueItemActions, QueueItemContent, QueueItemIndicator, QueueList } from "../ai-sdk/Queue.js";
11
- import { EmptyState } from "../foundations/EmptyState.js";
12
- import { TransitionSurface } from "../foundations/TransitionSurface.js";
13
11
  import { AgentEventRow, getAgentEvent } from "./AgentEvent.js";
14
12
  import { AgentChatQueueProvider, useOptionalAgentChatQueue } from "./AgentChatQueue.js";
15
13
  import { PromptInputApproval, getApprovalStateKey, getPendingToolApprovals } from "./PromptInputApproval.js";
14
+ import { EmptyState } from "../foundations/EmptyState.js";
15
+ import { TransitionSurface } from "../foundations/TransitionSurface.js";
16
16
  import * as React from "react";
17
17
  import { Fragment, jsx, jsxs } from "react/jsx-runtime";
18
18
  import { useRender } from "@base-ui/react/use-render";
@@ -252,7 +252,7 @@ function AgentChatActions({ children, ...props }) {
252
252
  const { messages, busy } = useAgentChatRuntime();
253
253
  const number = messages.slice(0, messageIndex + 1).filter((m) => m.role === message.role && !isCompactionMessage(m) && !getAgentEvent(m)).length;
254
254
  const unavailable = busy && (message.role === "user" ? message.id === messages.findLast((item) => item.role === "user" && !getAgentEvent(item))?.id : message.id === messages.at(-1)?.id);
255
- const actions = /* @__PURE__ */ jsx(MessageActions, {
255
+ return /* @__PURE__ */ jsx(MessageMeta, { children: /* @__PURE__ */ jsx(MessageActions, {
256
256
  reserveSpace: message.role === "assistant",
257
257
  "aria-label": `Actions for ${message.role === "assistant" ? "response" : "message"} ${number}`,
258
258
  "data-unavailable": unavailable ? true : void 0,
@@ -260,8 +260,7 @@ function AgentChatActions({ children, ...props }) {
260
260
  inert: unavailable ? true : void 0,
261
261
  ...props,
262
262
  children
263
- });
264
- return message.role === "user" ? /* @__PURE__ */ jsx(MessageMeta, { children: actions }) : actions;
263
+ }) });
265
264
  }
266
265
  function AgentChatCopyAction() {
267
266
  const { message, messageIndex } = useChatMessage();
@@ -2,9 +2,9 @@ import { t as cx } from "../../class-names-BiMDVpUo.js";
2
2
  import { Activity, ActivityContent, ActivityText, ActivityTrigger } from "../ai-sdk/Activity.js";
3
3
  import { r as firstLine } from "../../format-COCyV98Z.js";
4
4
  import { MessageResponse } from "../ai-sdk/Message.js";
5
- import { NaniteMark } from "../nanites/NaniteScene.js";
6
- import { getSubagentRunName } from "./SubagentRunIndicator.js";
7
5
  import { useOptionalAgentToolRuns } from "./AgentToolRunsContext.js";
6
+ import { getSubagentRunName } from "./SubagentRunIndicator.js";
7
+ import { NaniteMark } from "../nanites/NaniteScene.js";
8
8
  import "react";
9
9
  import { jsx, jsxs } from "react/jsx-runtime";
10
10
  import { isTextUIPart } from "ai";
@@ -9,15 +9,15 @@ import { AgentChatStartScreen, AgentChatStartScreenComposer, AgentChatStartScree
9
9
  import { DescriptionList } from "../foundations/DescriptionList.js";
10
10
  import { Avatar } from "../foundations/Avatar.js";
11
11
  import { ChatGptSignInScreen } from "../extension/ChatGptSignInScreen.js";
12
+ import { SubagentRunLabel, getSubagentRunName } from "./SubagentRunIndicator.js";
12
13
  import { EmptyState } from "../foundations/EmptyState.js";
14
+ import { AgentChat } from "./AgentChat.js";
15
+ import "../foundations/icons.js";
13
16
  import { Switch } from "../foundations/Switch.js";
14
17
  import { useTheme } from "../foundations/ThemeProvider.js";
15
- import "../foundations/icons.js";
16
18
  import { ActionGuide, ActionGuideAction, ActionGuideList, ActionGuideSection } from "../general-purpose/ActionGuide.js";
17
19
  import { AppTopBar } from "../general-purpose/AppTopBar.js";
18
20
  import { ResponsiveSidebarShell, useResponsiveSidebarShell } from "../general-purpose/ResponsiveSidebarShell.js";
19
- import { SubagentRunLabel, getSubagentRunName } from "./SubagentRunIndicator.js";
20
- import { AgentChat } from "./AgentChat.js";
21
21
  import { McpServerIcon } from "./McpServerIcon.js";
22
22
  import { ThinkThreadPicker } from "./ThinkThreadPicker.js";
23
23
  import * as React from "react";
@@ -1,9 +1,9 @@
1
1
  import { R as PencilIcon, r as ArrowLeftIcon } from "../../icons-CeGfXO21.js";
2
- import { LinkButton } from "../foundations/LinkButton.js";
3
2
  import "../foundations/icons.js";
3
+ import { StatusScreen } from "../general-purpose/StatusScreen.js";
4
4
  import { AppTopBar } from "../general-purpose/AppTopBar.js";
5
5
  import { ResponsiveSidebarShell } from "../general-purpose/ResponsiveSidebarShell.js";
6
- import { StatusScreen } from "../general-purpose/StatusScreen.js";
6
+ import { LinkButton } from "../foundations/LinkButton.js";
7
7
  import { EmployeeChrome } from "./EmployeeChrome.js";
8
8
  import { getThinkExecutionRunId } from "./ThinkExecutionRun.js";
9
9
  import { ThinkRoutineActions, useThinkRoutineActions } from "./ThinkRoutineActions.js";
@@ -1,11 +1,11 @@
1
1
  import { C as FolderIcon, G as SlackIcon, I as PaperclipIcon, c as BoxIcon, g as DiscordIcon } from "../../icons-CeGfXO21.js";
2
2
  import { Button } from "../foundations/Button.js";
3
3
  import { Menu } from "../foundations/Menu.js";
4
- import { AppIcon } from "../foundations/AppIcon.js";
5
4
  import "../foundations/icons.js";
6
5
  import { ActionGuideAction } from "../general-purpose/ActionGuide.js";
7
- import { t as SetupChecklistAction } from "../../SetupChecklist-O6qmgwz4.js";
6
+ import { AppIcon } from "../foundations/AppIcon.js";
8
7
  import { EmployeeChrome } from "./EmployeeChrome.js";
8
+ import { t as SetupChecklistAction } from "../../SetupChecklist-O6qmgwz4.js";
9
9
  import { McpServerPickerAction, McpServerPickerItems } from "./McpServerPicker.js";
10
10
  import { WorkspaceMountManager } from "./WorkspaceMountManager.js";
11
11
  import "react";
@@ -2,9 +2,9 @@ import { B as PlusIcon, y as EllipsisIcon } from "../../icons-CeGfXO21.js";
2
2
  import { Menu } from "../foundations/Menu.js";
3
3
  import { IconButton } from "../foundations/IconButton.js";
4
4
  import { a as formatErrorMessage } from "../../format-COCyV98Z.js";
5
- import { Toast } from "../foundations/Toast.js";
6
5
  import "../foundations/icons.js";
7
6
  import { AppTopBar } from "../general-purpose/AppTopBar.js";
7
+ import { Toast } from "../foundations/Toast.js";
8
8
  import "react";
9
9
  import { Fragment, jsx, jsxs } from "react/jsx-runtime";
10
10
  //#region src/components/agents-sdk/ManagerAccountActions.tsx
@@ -1,3 +1,3 @@
1
1
  import "../foundations/icons.js";
2
- import { n as ManagerOfficeSidebar, r as ManagerOfficeSidebarAlert, t as ManagerOffice } from "../../ManagerOffice-5pEFpoV3.js";
2
+ import { n as ManagerOfficeSidebar, r as ManagerOfficeSidebarAlert, t as ManagerOffice } from "../../ManagerOffice-CqOggftJ.js";
3
3
  export { ManagerOffice, ManagerOfficeSidebar, ManagerOfficeSidebarAlert };
@@ -5,7 +5,7 @@ import { AppTopBar } from "../general-purpose/AppTopBar.js";
5
5
  import { ResponsiveSidebarShell } from "../general-purpose/ResponsiveSidebarShell.js";
6
6
  import { ThinkThreadPicker } from "./ThinkThreadPicker.js";
7
7
  import { EmployeeChrome } from "./EmployeeChrome.js";
8
- import { n as ManagerOfficeSidebar, r as ManagerOfficeSidebarAlert, t as ManagerOffice } from "../../ManagerOffice-5pEFpoV3.js";
8
+ import { n as ManagerOfficeSidebar, r as ManagerOfficeSidebarAlert, t as ManagerOffice } from "../../ManagerOffice-CqOggftJ.js";
9
9
  import "react";
10
10
  import { Fragment, jsx, jsxs } from "react/jsx-runtime";
11
11
  //#region src/components/agents-sdk/ManagerOfficeScreens.tsx
@@ -8,8 +8,8 @@ import { Dialog } from "../foundations/Dialog.js";
8
8
  import { a as formatErrorMessage } from "../../format-COCyV98Z.js";
9
9
  import { Separator } from "../foundations/Separator.js";
10
10
  import { AppIcon } from "../foundations/AppIcon.js";
11
- import { SearchField } from "../foundations/SearchField.js";
12
11
  import { McpServerIcon } from "./McpServerIcon.js";
12
+ import { SearchField } from "../foundations/SearchField.js";
13
13
  import { t as getMcpServerProjection } from "../../mcp-server-mAErsxHU.js";
14
14
  import { McpServerSetupDialog } from "./McpServerPicker.js";
15
15
  import * as React from "react";
@@ -1,6 +1,6 @@
1
1
  import { Field } from "../foundations/Field.js";
2
- import { Checkbox } from "../foundations/Checkbox.js";
3
2
  import { SettingsFormDialog } from "../general-purpose/SettingsFormDialog.js";
3
+ import { Checkbox } from "../foundations/Checkbox.js";
4
4
  import { jsx, jsxs } from "react/jsx-runtime";
5
5
  //#region src/components/agents-sdk/ModelEndpointDialog.tsx
6
6
  /** Shared connection form; the host owns validation, credentials and persistence. */
@@ -195,7 +195,7 @@ function SubagentRunPanelContent({ panel, renderRunLink }) {
195
195
  const { runs, active, completed, visible } = getSubagentRunRows(panel);
196
196
  const focus = useSubagentRunFocus(panel, visible);
197
197
  const stop = panel.commands["current-work"] ?? IDLE;
198
- if (panel.collection.status === "ready" && !runs.length && !panel.parentRunning) return null;
198
+ if (!runs.length) return null;
199
199
  return /* @__PURE__ */ jsx(AgentChatPromptTray, {
200
200
  "data-subagent-run-panel": "",
201
201
  children: /* @__PURE__ */ jsx(Queue, {
@@ -3,9 +3,9 @@ import { Activity, ActivityContent, ActivityItem, ActivityItemGroup, ActivityTex
3
3
  import { Button } from "../foundations/Button.js";
4
4
  import { MessageResponse } from "../ai-sdk/Message.js";
5
5
  import { t as NavigationLink } from "../../navigation-link-kqMa81v5.js";
6
- import { getSubagentRunName } from "./SubagentRunIndicator.js";
7
- import { useOptionalAgentToolRuns } from "./AgentToolRunsContext.js";
8
6
  import { AgentActivityFavicon, AgentActivityIcon } from "./AgentActivity.js";
7
+ import { useOptionalAgentToolRuns } from "./AgentToolRunsContext.js";
8
+ import { getSubagentRunName } from "./SubagentRunIndicator.js";
9
9
  import { useOptionalThinkChatLive } from "./ThinkChatContext.js";
10
10
  import { isBrowserToolPart, isExecuteToolPart, isFetchToolPart, isPartWorking, isSessionContextToolPart, isSkillToolPart, isThinkChatActivityPart, isWorkspaceToolPart } from "./ThinkChatToolParts.js";
11
11
  import { ThinkChatBrowserPanel, ThinkChatExecutePanel, ThinkChatFetchPanel, ThinkChatSessionContextPanel, ThinkChatSkillPanel, ThinkChatWorkspacePanel } from "./ThinkChatToolPanels.js";
@@ -2,8 +2,8 @@ import { K as SpinnerIcon, Q as TrashIcon, z as PlayIcon } from "../../icons-CeG
2
2
  import { Button } from "../foundations/Button.js";
3
3
  import { a as formatErrorMessage } from "../../format-COCyV98Z.js";
4
4
  import { n as mergeRefs } from "../../merge-refs-DF_7w2x_.js";
5
- import { AlertDialog } from "../foundations/AlertDialog.js";
6
5
  import { AppTopBar } from "../general-purpose/AppTopBar.js";
6
+ import { AlertDialog } from "../foundations/AlertDialog.js";
7
7
  import * as React from "react";
8
8
  import { Fragment, jsx, jsxs } from "react/jsx-runtime";
9
9
  import { mergeProps } from "@base-ui/react/merge-props";
@@ -6,12 +6,12 @@ import { Form } from "../foundations/Form.js";
6
6
  import { Textarea } from "../foundations/Textarea.js";
7
7
  import { a as formatErrorMessage } from "../../format-COCyV98Z.js";
8
8
  import { Select } from "../foundations/Select.js";
9
+ import { AppTopBar } from "../general-purpose/AppTopBar.js";
10
+ import { Fieldset } from "../foundations/Fieldset.js";
9
11
  import { Checkbox } from "../foundations/Checkbox.js";
10
12
  import { CheckboxGroup } from "../foundations/CheckboxGroup.js";
11
13
  import { Combobox } from "../foundations/Combobox.js";
12
- import { Fieldset } from "../foundations/Fieldset.js";
13
14
  import { NumberField } from "../foundations/NumberField.js";
14
- import { AppTopBar } from "../general-purpose/AppTopBar.js";
15
15
  import * as React from "react";
16
16
  import { Fragment, jsx, jsxs } from "react/jsx-runtime";
17
17
  //#region src/components/agents-sdk/ThinkRoutineForm.tsx
@@ -4,8 +4,8 @@ import { Button, buttonVariants } from "../foundations/Button.js";
4
4
  import { a as formatErrorMessage } from "../../format-COCyV98Z.js";
5
5
  import { n as isPlainPrimaryLinkActivation, t as NavigationLink } from "../../navigation-link-kqMa81v5.js";
6
6
  import { ScrollArea } from "../foundations/ScrollArea.js";
7
- import { AlertDialog } from "../foundations/AlertDialog.js";
8
7
  import { EmptyState } from "../foundations/EmptyState.js";
8
+ import { AlertDialog } from "../foundations/AlertDialog.js";
9
9
  import { LinkButton } from "../foundations/LinkButton.js";
10
10
  import { SearchField } from "../foundations/SearchField.js";
11
11
  import * as React from "react";
@@ -9,7 +9,7 @@ import { Card, CardAction, CardContent, CardFooter, CardHeader, CardTitle } from
9
9
  import { DescriptionList } from "../foundations/DescriptionList.js";
10
10
  import { Input } from "../foundations/Input.js";
11
11
  import { EmailMessageCard, SlackMessageCard } from "../ai-sdk/ConnectedAppCards.js";
12
- import { i as WorkspaceDeleteControl, r as httpUrl, t as FaviconMark } from "../../workspace-assets-wW_lQLYK.js";
12
+ import { i as WorkspaceDeleteControl, r as httpUrl, t as FaviconMark } from "../../workspace-assets-C3QT6UlQ.js";
13
13
  import * as React from "react";
14
14
  import { createElement } from "react";
15
15
  import { Fragment, jsx, jsxs } from "react/jsx-runtime";
@@ -8,9 +8,9 @@ import { a as formatErrorMessage, o as formatUnknownValue, r as firstLine } from
8
8
  import { Card, CardAction, CardContent, CardDescription, CardHeader, CardTitle } from "../foundations/Card.js";
9
9
  import { DescriptionList } from "../foundations/DescriptionList.js";
10
10
  import { Input } from "../foundations/Input.js";
11
- import { Checkbox } from "../foundations/Checkbox.js";
12
11
  import { EmptyState } from "../foundations/EmptyState.js";
13
- import { i as WorkspaceDeleteControl, n as WorkspaceComposerLink, r as httpUrl, t as FaviconMark } from "../../workspace-assets-wW_lQLYK.js";
12
+ import { Checkbox } from "../foundations/Checkbox.js";
13
+ import { i as WorkspaceDeleteControl, n as WorkspaceComposerLink, r as httpUrl, t as FaviconMark } from "../../workspace-assets-C3QT6UlQ.js";
14
14
  import * as React from "react";
15
15
  import { createElement } from "react";
16
16
  import { Fragment, jsx, jsxs } from "react/jsx-runtime";
@@ -7,7 +7,7 @@ import { Card, CardAction, CardContent, CardDescription, CardHeader, CardTitle }
7
7
  import { DescriptionList } from "../foundations/DescriptionList.js";
8
8
  import { EmptyState } from "../foundations/EmptyState.js";
9
9
  import { LinkButton } from "../foundations/LinkButton.js";
10
- import { i as WorkspaceDeleteControl, n as WorkspaceComposerLink, t as FaviconMark } from "../../workspace-assets-wW_lQLYK.js";
10
+ import { i as WorkspaceDeleteControl, n as WorkspaceComposerLink, t as FaviconMark } from "../../workspace-assets-C3QT6UlQ.js";
11
11
  import * as React from "react";
12
12
  import { jsx, jsxs } from "react/jsx-runtime";
13
13
  import { useQuery } from "@tanstack/react-query";
@@ -5,7 +5,7 @@ import { Card, CardAction, CardContent, CardDescription, CardHeader, CardTitle }
5
5
  import { DescriptionList } from "../foundations/DescriptionList.js";
6
6
  import { EmptyState } from "../foundations/EmptyState.js";
7
7
  import { Switch } from "../foundations/Switch.js";
8
- import { i as WorkspaceDeleteControl, n as WorkspaceComposerLink, t as FaviconMark } from "../../workspace-assets-wW_lQLYK.js";
8
+ import { i as WorkspaceDeleteControl, n as WorkspaceComposerLink, t as FaviconMark } from "../../workspace-assets-C3QT6UlQ.js";
9
9
  import * as React from "react";
10
10
  import { jsx, jsxs } from "react/jsx-runtime";
11
11
  //#region src/components/agents-sdk/WorkspaceUserScript.tsx
@@ -1,7 +1,7 @@
1
1
  import { ToggleVariantsOptions } from "./Toggle.js";
2
2
  import * as React from "react";
3
- import { Toggle } from "@base-ui/react/toggle";
4
3
  import { ToggleGroup as ToggleGroup$1 } from "@base-ui/react/toggle-group";
4
+ import { Toggle } from "@base-ui/react/toggle";
5
5
 
6
6
  //#region src/components/foundations/ToggleGroup.d.ts
7
7
  type ToggleGroupSize = ToggleVariantsOptions["size"];
@@ -3,8 +3,8 @@ import { n as mergeRefs } from "../../merge-refs-DF_7w2x_.js";
3
3
  import { toggleVariants } from "./Toggle.js";
4
4
  import * as React from "react";
5
5
  import { jsx, jsxs } from "react/jsx-runtime";
6
- import { Toggle } from "@base-ui/react/toggle";
7
6
  import { ToggleGroup as ToggleGroup$1 } from "@base-ui/react/toggle-group";
7
+ import { Toggle } from "@base-ui/react/toggle";
8
8
  //#region src/components/foundations/ToggleGroup.tsx
9
9
  /**
10
10
  * Tracks the pressed item's box so the segmented thumb can slide to it instead
@@ -1,8 +1,8 @@
1
1
  import { t as cx } from "../../class-names-BiMDVpUo.js";
2
2
  import { Card } from "../foundations/Card.js";
3
3
  import { Separator } from "../foundations/Separator.js";
4
- import { Progress } from "../foundations/Progress.js";
5
4
  import { Slider } from "../foundations/Slider.js";
5
+ import { Progress } from "../foundations/Progress.js";
6
6
  import { formatPricingUsage, getUsagePrice } from "./Pricing.js";
7
7
  import * as React from "react";
8
8
  import { jsx, jsxs } from "react/jsx-runtime";
@@ -1,6 +1,6 @@
1
1
  import { F as MoonIcon, P as MonitorIcon, Y as SunIcon } from "../../icons-CeGfXO21.js";
2
- import { Radio, RadioGroup } from "../foundations/RadioGroup.js";
3
2
  import { useTheme } from "../foundations/ThemeProvider.js";
3
+ import { Radio, RadioGroup } from "../foundations/RadioGroup.js";
4
4
  import { jsx, jsxs } from "react/jsx-runtime";
5
5
  //#region src/components/general-purpose/ThemeModeControl.tsx
6
6
  const modes = [
@@ -1,13 +1,13 @@
1
1
  import { t as cx } from "../../class-names-BiMDVpUo.js";
2
2
  import { r as ArrowLeftIcon } from "../../icons-CeGfXO21.js";
3
3
  import { MessageActions } from "../ai-sdk/Message.js";
4
- import { TransitionSurface } from "../foundations/TransitionSurface.js";
5
- import { AppTopBar } from "../general-purpose/AppTopBar.js";
6
- import { NaniteMark } from "./NaniteScene.js";
7
4
  import { SubagentRunIndicator, getSubagentRunName } from "../agents-sdk/SubagentRunIndicator.js";
8
- import { SubagentRunMetadata } from "../agents-sdk/SubagentRunDetails.js";
5
+ import { NaniteMark } from "./NaniteScene.js";
6
+ import { TransitionSurface } from "../foundations/TransitionSurface.js";
9
7
  import { AgentChat } from "../agents-sdk/AgentChat.js";
8
+ import { AppTopBar } from "../general-purpose/AppTopBar.js";
10
9
  import { ThinkChat } from "../agents-sdk/ThinkChat.js";
10
+ import { SubagentRunMetadata } from "../agents-sdk/SubagentRunDetails.js";
11
11
  import * as React from "react";
12
12
  import { jsx, jsxs } from "react/jsx-runtime";
13
13
  import { useAgentChat } from "@cloudflare/think/react";
@@ -168,14 +168,17 @@
168
168
  the same quiet look without per-app classes. Hug the actions — a short
169
169
  viewport (Storybook addons, a short side panel) used to stretch this into
170
170
  a vacant slab. Space-between only when there are three slots to fill.
171
- Compact control tokens keep this strip on the same ramp as the composer. */
171
+ Compact control tokens keep this strip on the same ramp as the composer.
172
+ Count buttons only: opening a popup inserts non-layout focus guards. */
172
173
  .agent-chat-start-screen__composer-tray {
173
174
  align-self: start;
174
175
  justify-content: start;
175
176
  min-block-size: 0;
176
177
  }
177
178
 
178
- .agent-chat-start-screen__composer-tray:has(> :nth-child(3):last-child) {
179
+ .agent-chat-start-screen__composer-tray:has(
180
+ > :nth-child(3 of .button):nth-last-child(1 of .button)
181
+ ) {
179
182
  justify-content: space-between;
180
183
  }
181
184
 
@@ -561,12 +564,17 @@
561
564
  font-size: var(--sigvelo-text-lg);
562
565
  }
563
566
 
564
- .agent-chat-start-screen__composer-tray:has(> :nth-child(3):last-child) {
567
+ .agent-chat-start-screen__composer-tray:has(
568
+ > :nth-child(3 of .button):nth-last-child(1 of .button)
569
+ ) {
565
570
  display: grid;
566
571
  grid-template-columns: repeat(3, var(--sigvelo-layout-track-fill));
567
572
  }
568
573
 
569
- .agent-chat-start-screen__composer-tray:has(> :nth-child(3):last-child) > .button {
574
+ .agent-chat-start-screen__composer-tray:has(
575
+ > :nth-child(3 of .button):nth-last-child(1 of .button)
576
+ )
577
+ > .button {
570
578
  inline-size: 100%;
571
579
  justify-content: center;
572
580
  }
@@ -146,6 +146,10 @@
146
146
  white-space: nowrap;
147
147
  }
148
148
 
149
+ .message[data-from="assistant"] > .message__meta {
150
+ align-self: flex-start;
151
+ }
152
+
149
153
  .message__meta .message__actions[data-unavailable] {
150
154
  visibility: hidden;
151
155
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mcp-b/react-components",
3
- "version": "0.50.0",
3
+ "version": "0.50.1",
4
4
  "description": "MCP-B React components built on Base UI and shared design tokens, including Cloudflare Think chat primitives.",
5
5
  "homepage": "https://design-system.sigvelo.com",
6
6
  "bugs": {
@@ -54,7 +54,7 @@
54
54
  "streamdown": "^2.5.0",
55
55
  "unist-util-visit": "^5.1.0",
56
56
  "yet-another-react-lightbox": "^3.32.2",
57
- "@mcp-b/design-tokens": "0.50.0"
57
+ "@mcp-b/design-tokens": "0.50.1"
58
58
  },
59
59
  "devDependencies": {
60
60
  "@ai-sdk/react": "^3.0.249",
@@ -7,8 +7,8 @@ import { AgentAttention, AgentAttentionActions, AgentAttentionBody, AgentAttenti
7
7
  import { Tooltip } from "./components/foundations/Tooltip.js";
8
8
  import { Avatar } from "./components/foundations/Avatar.js";
9
9
  import { CorrespondentName, correspondentHandleLabel } from "./components/ai-sdk/Correspondent.js";
10
- import { AppIcon } from "./components/foundations/AppIcon.js";
11
10
  import { EmptyState } from "./components/foundations/EmptyState.js";
11
+ import { AppIcon } from "./components/foundations/AppIcon.js";
12
12
  import { LinkButton } from "./components/foundations/LinkButton.js";
13
13
  import { getThinkExecutionRunStatus } from "./components/agents-sdk/ThinkExecutionRun.js";
14
14
  import * as React from "react";
@@ -5,8 +5,8 @@ import { Button } from "./components/foundations/Button.js";
5
5
  import { Tooltip } from "./components/foundations/Tooltip.js";
6
6
  import { IconButton } from "./components/foundations/IconButton.js";
7
7
  import { ComposerLink } from "./components/ai-sdk/ComposerLink.js";
8
- import { AlertDialog } from "./components/foundations/AlertDialog.js";
9
8
  import { AppIcon } from "./components/foundations/AppIcon.js";
9
+ import { AlertDialog } from "./components/foundations/AlertDialog.js";
10
10
  import * as React from "react";
11
11
  import { Fragment, jsx, jsxs } from "react/jsx-runtime";
12
12
  //#region src/components/_internal/workspace-delete.tsx