@mcp-b/react-components 0.31.3 → 0.31.5
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.
- package/dist/components/agents-sdk/McpConnectionRequest.d.ts +1 -1
- package/dist/components/agents-sdk/McpConnectorForm.d.ts +1 -1
- package/dist/components/agents-sdk/McpPluginCatalog.d.ts +1 -1
- package/dist/components/agents-sdk/McpServerPicker.d.ts +2 -10
- package/dist/components/agents-sdk/McpServerPicker.js +5 -5
- package/dist/components/general-purpose/SetupChecklist.js +29 -3
- package/dist/{mcp-server-catalog-CO7GAl1f.d.ts → mcp-server-catalog-CCj2ItkV.d.ts} +8 -1
- package/dist/styles/mcp-server-picker.css +0 -7
- package/dist/utils/mcp-server-catalog.d.ts +1 -1
- package/dist/utils/mcp-server-catalog.js +9 -1
- package/package.json +2 -2
- package/dist/MenuDisclosureGroup-yJRq7YXa.js +0 -32
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { o as McpServerCard } from "../../mcp-server-catalog-
|
|
1
|
+
import { o as McpServerCard } from "../../mcp-server-catalog-CCj2ItkV.js";
|
|
2
2
|
import * as React from "react";
|
|
3
3
|
import { DynamicToolUIPart, ToolUIPart } from "ai";
|
|
4
4
|
import { MCPServersState } from "agents";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { d as McpServerSetupAuthFieldName, l as McpServerSetupAuth } from "../../mcp-server-catalog-
|
|
1
|
+
import { d as McpServerSetupAuthFieldName, l as McpServerSetupAuth } from "../../mcp-server-catalog-CCj2ItkV.js";
|
|
2
2
|
import * as React from "react";
|
|
3
3
|
|
|
4
4
|
//#region src/components/agents-sdk/McpConnectorForm.d.ts
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { o as McpServerCard } from "../../mcp-server-catalog-
|
|
1
|
+
import { o as McpServerCard } from "../../mcp-server-catalog-CCj2ItkV.js";
|
|
2
2
|
import { l as DialogProps } from "../../Dialog-DeOSJ0Oy.js";
|
|
3
3
|
import * as React from "react";
|
|
4
4
|
import { MCPServersState } from "agents";
|
|
@@ -1,18 +1,10 @@
|
|
|
1
1
|
import { s as MenuItemProps, t as Menu } from "../../Menu-DVmjBIuM.js";
|
|
2
|
-
import { o as McpServerCard } from "../../mcp-server-catalog-
|
|
2
|
+
import { o as McpServerCard } from "../../mcp-server-catalog-CCj2ItkV.js";
|
|
3
3
|
import { McpConnectorFormProps } from "./McpConnectorForm.js";
|
|
4
4
|
import { l as DialogProps } from "../../Dialog-DeOSJ0Oy.js";
|
|
5
5
|
import * as React from "react";
|
|
6
6
|
import { MCPServersState } from "agents";
|
|
7
7
|
|
|
8
|
-
//#region src/components/_internal/MenuDisclosureGroup.d.ts
|
|
9
|
-
interface MenuDisclosureGroupProps extends Omit<React.ComponentProps<typeof Menu.Group>, "children"> {
|
|
10
|
-
label: React.ReactNode;
|
|
11
|
-
children: React.ReactNode;
|
|
12
|
-
defaultOpen?: boolean;
|
|
13
|
-
triggerClassName?: string;
|
|
14
|
-
}
|
|
15
|
-
//#endregion
|
|
16
8
|
//#region src/components/agents-sdk/McpServerPicker.d.ts
|
|
17
9
|
interface McpServerPickerProps {
|
|
18
10
|
/** MCP servers to show in the plus-menu picker. */
|
|
@@ -32,7 +24,7 @@ interface McpServerPickerProps {
|
|
|
32
24
|
triggerLabel?: string;
|
|
33
25
|
}
|
|
34
26
|
type McpServerPickerItemsProps = Omit<McpServerPickerProps, "sideOffset" | "triggerLabel">;
|
|
35
|
-
interface McpServerPickerGroupProps extends Omit<
|
|
27
|
+
interface McpServerPickerGroupProps extends Omit<React.ComponentProps<typeof Menu.Group>, "children"> {
|
|
36
28
|
/** Quiet visible heading for a related set of picker actions. */
|
|
37
29
|
label: React.ReactNode;
|
|
38
30
|
children: React.ReactNode;
|
|
@@ -8,7 +8,6 @@ import { Menu } from "../foundations/Menu.js";
|
|
|
8
8
|
import { PromptInputActionMenu, PromptInputActionMenuContent, PromptInputActionMenuTrigger } from "../ai-sdk/PromptInput.js";
|
|
9
9
|
import { n as getMcpServerConnectionKind, t as McpServerIcon } from "../../mcp-server-U71zhxFF.js";
|
|
10
10
|
import { McpConnectorForm } from "./McpConnectorForm.js";
|
|
11
|
-
import { t as MenuDisclosureGroup } from "../../MenuDisclosureGroup-yJRq7YXa.js";
|
|
12
11
|
import * as React from "react";
|
|
13
12
|
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
14
13
|
//#region src/components/agents-sdk/McpServerPicker.tsx
|
|
@@ -128,12 +127,13 @@ function McpServerPickerItems({ servers, onConnect, mcp, onDisconnect, actions,
|
|
|
128
127
|
] });
|
|
129
128
|
}
|
|
130
129
|
function McpServerPickerGroup({ label, children, className, ...props }) {
|
|
131
|
-
return /* @__PURE__ */
|
|
130
|
+
return /* @__PURE__ */ jsxs(Menu.Group, {
|
|
132
131
|
className: mergeBaseClassName("mcp-server-picker__group", className),
|
|
133
|
-
label,
|
|
134
|
-
triggerClassName: "mcp-server-picker__group-trigger",
|
|
135
132
|
...props,
|
|
136
|
-
children
|
|
133
|
+
children: [/* @__PURE__ */ jsx(Menu.GroupLabel, {
|
|
134
|
+
className: "mcp-server-picker__group-label",
|
|
135
|
+
children: label
|
|
136
|
+
}), children]
|
|
137
137
|
});
|
|
138
138
|
}
|
|
139
139
|
function McpServerPickerAction({ icon, label, description, className, ...props }) {
|
|
@@ -1,9 +1,35 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { n as mergeBaseClassName } from "../../class-names-BiMDVpUo.js";
|
|
2
|
+
import { H as PlusIcon, d as CheckIcon, f as ChevronDownIcon, tt as WarningIcon } from "../../icons-B1Qw05te.js";
|
|
2
3
|
import { Button } from "../foundations/Button.js";
|
|
3
4
|
import { Menu } from "../foundations/Menu.js";
|
|
4
|
-
import
|
|
5
|
-
import "react";
|
|
5
|
+
import * as React from "react";
|
|
6
6
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
7
|
+
//#region src/components/_internal/MenuDisclosureGroup.tsx
|
|
8
|
+
/**
|
|
9
|
+
* A menu-native disclosure: its trigger stays in the menu roving-focus model,
|
|
10
|
+
* while its rows mount only after the user expands the section.
|
|
11
|
+
*/
|
|
12
|
+
function MenuDisclosureGroup({ children, className, defaultOpen = false, label, triggerClassName, ...props }) {
|
|
13
|
+
const [open, setOpen] = React.useState(defaultOpen);
|
|
14
|
+
return /* @__PURE__ */ jsxs(Menu.Group, {
|
|
15
|
+
className: mergeBaseClassName("menu-disclosure-group", className),
|
|
16
|
+
...props,
|
|
17
|
+
children: [/* @__PURE__ */ jsxs(Menu.Item, {
|
|
18
|
+
"aria-expanded": open,
|
|
19
|
+
className: mergeBaseClassName("menu-disclosure-group__trigger", triggerClassName),
|
|
20
|
+
closeOnClick: false,
|
|
21
|
+
onClick: () => setOpen((current) => !current),
|
|
22
|
+
children: [/* @__PURE__ */ jsx("span", {
|
|
23
|
+
className: "sigvelo-truncate-grow",
|
|
24
|
+
children: label
|
|
25
|
+
}), /* @__PURE__ */ jsx(ChevronDownIcon, { "aria-hidden": "true" })]
|
|
26
|
+
}), open ? /* @__PURE__ */ jsx("div", {
|
|
27
|
+
className: "menu-disclosure-group__items",
|
|
28
|
+
children
|
|
29
|
+
}) : null]
|
|
30
|
+
});
|
|
31
|
+
}
|
|
32
|
+
//#endregion
|
|
7
33
|
//#region src/components/general-purpose/SetupChecklist.tsx
|
|
8
34
|
/** Checklist rows for any Menu surface (composer plus menu, tray menu). */
|
|
9
35
|
function SetupChecklistGroup({ label, entries, defaultOpen = false, onSelect }) {
|
|
@@ -174,6 +174,13 @@ declare const DCR_MCP_SERVER_CARDS: readonly [{
|
|
|
174
174
|
readonly description: "Work with scheduling links and events";
|
|
175
175
|
readonly category: "Auto";
|
|
176
176
|
readonly icon: "https://cdn.simpleicons.org/calendly/006BFF";
|
|
177
|
+
}, {
|
|
178
|
+
readonly id: "clay";
|
|
179
|
+
readonly name: "Clay";
|
|
180
|
+
readonly url: "https://api.clay.com/v3/mcp";
|
|
181
|
+
readonly description: "Find and enrich contacts and companies";
|
|
182
|
+
readonly category: "Auto";
|
|
183
|
+
readonly icon: "https://cdn.prod.website-files.com/61477f2c24a826836f969afe/6a3a92ab841a6313dc068fb8_dot-com_favicon_2026_512.png";
|
|
177
184
|
}, {
|
|
178
185
|
readonly id: "clickup";
|
|
179
186
|
readonly name: "ClickUp";
|
|
@@ -289,7 +296,7 @@ declare const DCR_MCP_SERVER_CARDS: readonly [{
|
|
|
289
296
|
}, {
|
|
290
297
|
readonly id: "paypal";
|
|
291
298
|
readonly name: "PayPal";
|
|
292
|
-
readonly url: "https://mcp.paypal.com/
|
|
299
|
+
readonly url: "https://mcp.paypal.com/mcp";
|
|
293
300
|
readonly description: "Use PayPal merchant tools";
|
|
294
301
|
readonly category: "Auto";
|
|
295
302
|
readonly icon: "https://cdn.simpleicons.org/paypal/003087";
|
|
@@ -2,13 +2,6 @@
|
|
|
2
2
|
margin-block-start: var(--sigvelo-spacing-0-5);
|
|
3
3
|
}
|
|
4
4
|
|
|
5
|
-
.mcp-server-picker__group-trigger {
|
|
6
|
-
color: var(--sigvelo-color-text);
|
|
7
|
-
font-size: var(--sigvelo-text-xs);
|
|
8
|
-
font-weight: var(--sigvelo-font-weight-normal);
|
|
9
|
-
line-height: var(--sigvelo-leading-tight);
|
|
10
|
-
}
|
|
11
|
-
|
|
12
5
|
.mcp-server-picker__action-error {
|
|
13
6
|
display: flex;
|
|
14
7
|
align-items: flex-start;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
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-
|
|
1
|
+
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-CCj2ItkV.js";
|
|
2
2
|
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 };
|
|
@@ -164,6 +164,14 @@ const DCR_MCP_SERVER_CARDS = [
|
|
|
164
164
|
category: DCR_CATEGORY,
|
|
165
165
|
icon: "https://cdn.simpleicons.org/calendly/006BFF"
|
|
166
166
|
},
|
|
167
|
+
{
|
|
168
|
+
id: "clay",
|
|
169
|
+
name: "Clay",
|
|
170
|
+
url: "https://api.clay.com/v3/mcp",
|
|
171
|
+
description: "Find and enrich contacts and companies",
|
|
172
|
+
category: DCR_CATEGORY,
|
|
173
|
+
icon: "https://cdn.prod.website-files.com/61477f2c24a826836f969afe/6a3a92ab841a6313dc068fb8_dot-com_favicon_2026_512.png"
|
|
174
|
+
},
|
|
167
175
|
{
|
|
168
176
|
id: "clickup",
|
|
169
177
|
name: "ClickUp",
|
|
@@ -295,7 +303,7 @@ const DCR_MCP_SERVER_CARDS = [
|
|
|
295
303
|
{
|
|
296
304
|
id: "paypal",
|
|
297
305
|
name: "PayPal",
|
|
298
|
-
url: "https://mcp.paypal.com/
|
|
306
|
+
url: "https://mcp.paypal.com/mcp",
|
|
299
307
|
description: "Use PayPal merchant tools",
|
|
300
308
|
category: DCR_CATEGORY,
|
|
301
309
|
icon: "https://cdn.simpleicons.org/paypal/003087"
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mcp-b/react-components",
|
|
3
|
-
"version": "0.31.
|
|
3
|
+
"version": "0.31.5",
|
|
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": {
|
|
@@ -58,7 +58,7 @@
|
|
|
58
58
|
"streamdown": "^2.5.0",
|
|
59
59
|
"unist-util-visit": "^5.1.0",
|
|
60
60
|
"yet-another-react-lightbox": "^3.32.1",
|
|
61
|
-
"@mcp-b/design-tokens": "0.31.
|
|
61
|
+
"@mcp-b/design-tokens": "0.31.5"
|
|
62
62
|
},
|
|
63
63
|
"devDependencies": {
|
|
64
64
|
"@ai-sdk/react": "^3.0.230",
|
|
@@ -1,32 +0,0 @@
|
|
|
1
|
-
import { n as mergeBaseClassName } from "./class-names-BiMDVpUo.js";
|
|
2
|
-
import { f as ChevronDownIcon } from "./icons-B1Qw05te.js";
|
|
3
|
-
import { Menu } from "./components/foundations/Menu.js";
|
|
4
|
-
import * as React from "react";
|
|
5
|
-
import { jsx, jsxs } from "react/jsx-runtime";
|
|
6
|
-
//#region src/components/_internal/MenuDisclosureGroup.tsx
|
|
7
|
-
/**
|
|
8
|
-
* A menu-native disclosure: its trigger stays in the menu roving-focus model,
|
|
9
|
-
* while its rows mount only after the user expands the section.
|
|
10
|
-
*/
|
|
11
|
-
function MenuDisclosureGroup({ children, className, defaultOpen = false, label, triggerClassName, ...props }) {
|
|
12
|
-
const [open, setOpen] = React.useState(defaultOpen);
|
|
13
|
-
return /* @__PURE__ */ jsxs(Menu.Group, {
|
|
14
|
-
className: mergeBaseClassName("menu-disclosure-group", className),
|
|
15
|
-
...props,
|
|
16
|
-
children: [/* @__PURE__ */ jsxs(Menu.Item, {
|
|
17
|
-
"aria-expanded": open,
|
|
18
|
-
className: mergeBaseClassName("menu-disclosure-group__trigger", triggerClassName),
|
|
19
|
-
closeOnClick: false,
|
|
20
|
-
onClick: () => setOpen((current) => !current),
|
|
21
|
-
children: [/* @__PURE__ */ jsx("span", {
|
|
22
|
-
className: "sigvelo-truncate-grow",
|
|
23
|
-
children: label
|
|
24
|
-
}), /* @__PURE__ */ jsx(ChevronDownIcon, { "aria-hidden": "true" })]
|
|
25
|
-
}), open ? /* @__PURE__ */ jsx("div", {
|
|
26
|
-
className: "menu-disclosure-group__items",
|
|
27
|
-
children
|
|
28
|
-
}) : null]
|
|
29
|
-
});
|
|
30
|
-
}
|
|
31
|
-
//#endregion
|
|
32
|
-
export { MenuDisclosureGroup as t };
|