@mcp-b/react-components 0.14.0 → 0.14.1

package/dist/components/McpServerPicker.d.ts

@@ -16,7 +16,7 @@ interface McpServerPickerProps {
   onRetry?: McpServerConnectionAction;
   /** Called when a ready/connected server should refresh discovery through an app-owned Agent RPC. */
   onRefresh?: McpServerConnectionAction;
-  /** Called when a server transport should close but the stored config should remain. */
+  /** Called when an authenticating or connected server should be removed or disconnected. */
   onDisconnect?: McpServerConnectionAction;
   /** Offset from the plus trigger to the menu, useful for prompt composers. */
   sideOffset?: number;

package/dist/components/McpServerPicker.js

@@ -120,6 +120,12 @@ function McpServerPickerRow({ server, mcp, onConnect, onAuthorize, onDisconnect,
 					label: pending("authorize") ? `Opening ${server.name}` : `Authorize ${server.name}`,
 					onClick: () => onAuthorize(connectedServerId, connectedServer)
 				}) : null,
+				connectedServer?.state === "authenticating" && connectedServerId && onDisconnect ? /* @__PURE__ */ jsx(McpServerActionItem, {
+					disabled: pending("disconnect"),
+					icon: /* @__PURE__ */ jsx(MinusIcon, {}),
+					label: pending("disconnect") ? `Cancelling ${server.name} authentication` : `Cancel ${server.name} authentication`,
+					onClick: () => onDisconnect(connectedServerId, connectedServer)
+				}) : null,
 				connectedServer?.state === "failed" && connectedServerId && onRetry ? /* @__PURE__ */ jsx(McpServerActionItem, {
 					disabled: pending("retry"),
 					icon: /* @__PURE__ */ jsx(RefreshIcon, {}),

package/dist/styles/activity.css

@@ -4,11 +4,15 @@
   display: flex;
   flex-direction: column;
   width: 100%;
+  min-width: 0;
   /* Hard cap, Codex-style, on the WHOLE unit — collapsed line and expanded
      log alike — so toggling never reflows the conversation width. Plain rem,
      not min(100%, …): percentages are ignored in intrinsic-size contributions,
      so the min() let wide nowrap rows inflate content-sized ancestors. */
   max-width: 36rem;
+  /* Live tool labels and panels must never contribute a wider intrinsic size
+     when Activity is inserted into a narrow chat transcript. */
+  contain: inline-size;
   /* Whitespace separates the work log from message prose around it */
   margin-block: 0.5rem;
   font-family: inherit;
@@ -17,6 +21,8 @@
 
 .activity__trigger {
   display: flex;
+  width: 100%;
+  min-width: 0;
   align-items: center;
   gap: var(--sigvelo-spacing-1-5);
   padding-block: var(--sigvelo-spacing-1-5);

package/dist/styles/agent-chat.css

@@ -3,6 +3,7 @@
   position: relative;
   width: 100%;
   height: 100%;
+  min-width: 0;
   min-height: 0;
   background-color: var(--sigvelo-color-surface);
   color: var(--sigvelo-color-text);
@@ -10,6 +11,7 @@
 }
 
 .agent-chat__conversation {
+  min-width: 0;
   height: 100%;
   min-height: 0;
 }
@@ -18,6 +20,8 @@
    --agent-chat-composer-size is set from a ResizeObserver in AgentChat. */
 .agent-chat__transcript-content {
   gap: 0.875rem;
+  min-inline-size: 0;
+  max-inline-size: 100%;
   inline-size: min(100%, var(--agent-chat-content-max-inline-size));
   margin-inline: auto;
   padding-block: 1rem calc(var(--agent-chat-composer-size, 5rem) + 0.5rem);
@@ -35,7 +39,9 @@
 }
 
 .agent-chat__scroll-button {
-  inset-block-end: calc(var(--agent-chat-composer-size, 5rem) + 0.5rem);
+  --message-scroller-button-inset-block-end: calc(
+    var(--agent-chat-composer-size, 5rem) + var(--sigvelo-spacing-2)
+  );
 }
 
 /* Floating over the transcript: solid behind the controls, fading out

package/dist/styles/message-scroller.css

@@ -60,7 +60,7 @@
 .message-scroller__button {
   position: absolute;
   inset-inline-start: 50%;
-  inset-block-end: 1rem;
+  inset-block-end: var(--message-scroller-button-inset-block-end, 1rem);
   z-index: 1;
   translate: -50% 0;
   border-radius: 999rem;

package/dist/styles/message.css

@@ -3,6 +3,7 @@
   flex-direction: column;
   gap: 0.25rem;
   width: 100%;
+  min-width: 0;
   font-family: inherit;
   color: var(--sigvelo-color-text);
 }
@@ -20,6 +21,7 @@
 .message__content {
   display: inline-block;
   max-width: min(42rem, 85%);
+  min-width: 0;
   padding-block: 0.5rem;
   padding-inline: var(--sigvelo-spacing-3);
   border-radius: var(--sigvelo-radius-lg);

package/dist/styles/streamdown.css

@@ -21,6 +21,16 @@
   overflow-wrap: anywhere;
 }
 
+.message[data-from="user"] [data-streamdown="link"] {
+  color: var(--sigvelo-color-primary-text-on-bg);
+}
+
+[data-streamdown="link"]:focus-visible {
+  outline: var(--sigvelo-focus-width) solid currentColor;
+  outline-offset: var(--sigvelo-focus-offset);
+  border-radius: var(--sigvelo-radius-xs);
+}
+
 /* Links render as <button> when link safety is enabled. */
 button[data-streamdown="link"] {
   appearance: none;

package/dist/styles/workspace-explorer.css

@@ -108,6 +108,7 @@
 }
 
 .workspace-explorer__tree .file-tree__name {
+  flex: 0 1 auto;
   line-height: 1.4;
 }
 

package/dist/utils/codex-model-catalog.d.ts

@@ -78,7 +78,7 @@ declare const CHECKED_IN_CODEX_MODELS: readonly [{
   readonly upgradeInfo: null;
   readonly availabilityNux: null;
   readonly hidden: boolean;
-  readonly inputModalities: ("image" | "text")[];
+  readonly inputModalities: ("text" | "image")[];
   readonly supportsPersonality: boolean;
   readonly additionalSpeedTiers: never[];
   readonly serviceTiers: never[];
@@ -98,7 +98,7 @@ declare const CHECKED_IN_CODEX_MODELS: readonly [{
   readonly upgradeInfo: null;
   readonly availabilityNux: null;
   readonly hidden: boolean;
-  readonly inputModalities: ("image" | "text")[];
+  readonly inputModalities: ("text" | "image")[];
   readonly supportsPersonality: boolean;
   readonly additionalSpeedTiers: never[];
   readonly serviceTiers: never[];
@@ -115,7 +115,7 @@ declare const CHECKED_IN_CODEX_MODELS: readonly [{
   readonly upgradeInfo: null;
   readonly availabilityNux: null;
   readonly hidden: boolean;
-  readonly inputModalities: ("image" | "text")[];
+  readonly inputModalities: ("text" | "image")[];
   readonly supportsPersonality: boolean;
   readonly additionalSpeedTiers: never[];
   readonly serviceTiers: never[];
@@ -132,7 +132,7 @@ declare const CHECKED_IN_CODEX_MODELS: readonly [{
   readonly upgradeInfo: null;
   readonly availabilityNux: null;
   readonly hidden: boolean;
-  readonly inputModalities: ("image" | "text")[];
+  readonly inputModalities: ("text" | "image")[];
   readonly supportsPersonality: boolean;
   readonly additionalSpeedTiers: never[];
   readonly serviceTiers: never[];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mcp-b/react-components",
-  "version": "0.14.0",
+  "version": "0.14.1",
   "description": "MCP-B React components built on Base UI and shared design tokens, including Cloudflare Think chat primitives.",
   "homepage": "https://design-system.sigvelo.com",
   "bugs": {
@@ -53,7 +53,7 @@
     "lucide-react": "^1.23.0",
     "shiki": "^3.23.0",
     "streamdown": "^2.5.0",
-    "@mcp-b/design-tokens": "0.14.0"
+    "@mcp-b/design-tokens": "0.14.1"
   },
   "devDependencies": {
     "@ai-sdk/react": "^3.0.222",