@mcp-b/react-components 0.25.0 → 0.26.0

package/dist/styles/goal.css

@@ -17,28 +17,34 @@
   color: var(--sigvelo-color-text-muted);
 }
 
+/* One capped row: the objective truncates, everything else keeps its width.
+   Full text belongs behind hover (title/tooltip) or a popover, not the row. */
 .goal__content {
   display: flex;
   flex: 1;
-  flex-wrap: wrap;
-  gap: 0 var(--sigvelo-spacing-1);
+  gap: var(--sigvelo-spacing-1);
   align-items: baseline;
   min-inline-size: 0;
-  overflow-wrap: anywhere;
+  white-space: nowrap;
 }
 
 .goal__title {
-  min-inline-size: 0;
+  flex: none;
   font-weight: var(--sigvelo-font-weight-semibold);
 }
 
 .goal__objective {
   min-inline-size: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
   color: var(--sigvelo-color-text-muted);
 }
 
 .goal__meta {
-  min-inline-size: 0;
+  flex: none;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-inline-size: 40%;
   color: var(--sigvelo-color-text-muted);
 }
 

package/dist/styles/message-scroller.css

@@ -53,6 +53,7 @@
    bounds DOM cost, and translateY replaces flow layout. */
 .message-scroller__virtual-content {
   position: relative;
+  box-sizing: content-box;
   width: 100%;
 }
 

package/dist/styles/plan.css

@@ -120,6 +120,51 @@
   line-height: var(--sigvelo-leading-normal);
 }
 
+.plan-summary {
+  display: inline-block;
+  font-family: inherit;
+}
+
+.plan-summary__trigger {
+  display: inline-flex;
+  align-items: center;
+  gap: var(--sigvelo-spacing-1-5);
+  padding-block: var(--sigvelo-spacing-1);
+  padding-inline: var(--sigvelo-spacing-2-5);
+  color: var(--sigvelo-color-text);
+  font-size: var(--sigvelo-text-compact);
+  line-height: var(--sigvelo-leading-snug);
+  background-color: var(--sigvelo-color-surface-raised);
+  border: var(--sigvelo-border-width) var(--sigvelo-border-style)
+    var(--sigvelo-color-neutral-border-subtle);
+  border-radius: var(--sigvelo-radius-full);
+}
+
+.plan-summary__trigger:hover {
+  background-color: color-mix(
+    in oklab,
+    var(--sigvelo-color-surface-raised),
+    var(--sigvelo-color-text) 5%
+  );
+}
+
+.plan-summary__trigger svg {
+  flex: none;
+}
+
+.plan-summary__trigger-label {
+  min-inline-size: 0;
+  font-variant-numeric: tabular-nums;
+}
+
+.plan-summary__content {
+  min-inline-size: 16rem;
+  max-inline-size: min(24rem, calc(100vw - var(--sigvelo-spacing-8)));
+  padding: 0;
+  font-family: inherit;
+  color: var(--sigvelo-color-text);
+}
+
 @media (forced-colors: active) {
   .plan__step-indicator {
     border: var(--sigvelo-border-style) var(--sigvelo-border-width) CanvasText;

package/dist/utils/mcp-server-catalog.d.ts

@@ -1,2 +1,2 @@
-import { a as MCP_SERVER_SETUP_AUTH, c as McpServerManualSetup, d as McpServerSetupAuthFieldName, f as McpServerSetupLink, h as getMcpServerRuntimeState, i as MANUAL_MCP_SERVER_CARDS, l as McpServerSetupAuth, m as getMcpServerIconSrc, n as DCR_MCP_SERVER_CARDS, o as McpServerCard, p as getMcpServerEntry, r as DEFAULT_MCP_SERVER_CARDS, s as McpServerCardIcon, t as CUSTOM_MCP_SERVER_CARD, u as McpServerSetupAuthField } from "../mcp-server-catalog-DycejaJ5.js";
+import { a as MCP_SERVER_SETUP_AUTH, c as McpServerManualSetup, d as McpServerSetupAuthFieldName, f as McpServerSetupLink, h as getMcpServerRuntimeState, i as MANUAL_MCP_SERVER_CARDS, l as McpServerSetupAuth, m as getMcpServerIconSrc, n as DCR_MCP_SERVER_CARDS, o as McpServerCard, p as getMcpServerEntry, r as DEFAULT_MCP_SERVER_CARDS, s as McpServerCardIcon, t as CUSTOM_MCP_SERVER_CARD, u as McpServerSetupAuthField } from "../mcp-server-catalog-BewjV7Eq.js";
 export { CUSTOM_MCP_SERVER_CARD, DCR_MCP_SERVER_CARDS, DEFAULT_MCP_SERVER_CARDS, MANUAL_MCP_SERVER_CARDS, MCP_SERVER_SETUP_AUTH, McpServerCard, McpServerCardIcon, McpServerManualSetup, McpServerSetupAuth, McpServerSetupAuthField, McpServerSetupAuthFieldName, McpServerSetupLink, getMcpServerEntry, getMcpServerIconSrc, getMcpServerRuntimeState };

package/dist/utils/mcp-server-catalog.js

@@ -811,7 +811,7 @@ const MANUAL_MCP_SERVER_CARDS = [
 		url: "https://mcp.slack.com/mcp",
 		description: "Search channels, send messages, and manage canvases",
 		category: MANUAL_CATEGORY,
-		icon: "https://slack.com/favicon.ico",
+		icon: "https://cdn.simpleicons.org/slack/4A154B",
 		manualSetup: {
 			auth: MCP_SERVER_SETUP_AUTH.manualOAuthClientSecret,
 			description: "Create or reuse a Slack app, enable MCP access, configure redirect URLs, then connect with the app client ID and secret.",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mcp-b/react-components",
-  "version": "0.25.0",
+  "version": "0.26.0",
   "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": {
@@ -58,7 +58,7 @@
     "streamdown": "^2.5.0",
     "unist-util-visit": "^5.1.0",
     "yet-another-react-lightbox": "^3.32.1",
-    "@mcp-b/design-tokens": "0.25.0"
+    "@mcp-b/design-tokens": "0.26.0"
   },
   "devDependencies": {
     "@ai-sdk/react": "^3.0.222",