@mcp-b/react-components 0.21.0 → 0.23.0

package/dist/components/BrowserRunPanel.js

@@ -1,6 +1,6 @@
 import { t as cx } from "../class-names-BiMDVpUo.js";
-import { K as SpinnerIcon, et as XIcon } from "../icons-DyOM0EJs.js";
 import { Button } from "./Button.js";
+import { q as SpinnerIcon, tt as XIcon } from "../icons-ua6f_GH3.js";
 import { Tabs } from "./Tabs.js";
 import { BrowserLiveView } from "./BrowserLiveView.js";
 import { WebPreview, WebPreviewNavigation, WebPreviewNavigationButton, WebPreviewUrl } from "./WebPreview.js";

package/dist/components/Button.d.ts

@@ -1,2 +1,2 @@
-import { a as ButtonVariant, i as ButtonSize, n as ButtonColor, o as ButtonVariantsOptions, r as ButtonProps, s as buttonVariants, t as Button } from "../Button-yRInko9u.js";
+import { a as ButtonVariant, i as ButtonSize, n as ButtonColor, o as ButtonVariantsOptions, r as ButtonProps, s as buttonVariants, t as Button } from "../Button-SBIz6Lqi.js";
 export { Button, ButtonColor, ButtonProps, ButtonSize, ButtonVariant, ButtonVariantsOptions, buttonVariants };

package/dist/components/ChainOfThought.d.ts

@@ -1,5 +1,5 @@
 import { t as Collapsible } from "../Collapsible-N64ASIQr.js";
-import { D as IconProps } from "../icons-DkRtZmvT.js";
+import { O as IconProps } from "../icons-wP1yFUXF.js";
 import * as React from "react";
 
 //#region src/components/ChainOfThought.d.ts

package/dist/components/ChainOfThought.js

@@ -1,6 +1,6 @@
 import { t as cx } from "../class-names-BiMDVpUo.js";
 import { Collapsible } from "./Collapsible.js";
-import { K as SpinnerIcon, _ as DotIcon, p as ChevronRightIcon, u as CheckIcon } from "../icons-DyOM0EJs.js";
+import { d as CheckIcon, m as ChevronRightIcon, q as SpinnerIcon, v as DotIcon } from "../icons-ua6f_GH3.js";
 import "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/ChainOfThought.tsx

package/dist/components/ChatGptSignInScreen.js

@@ -1,7 +1,7 @@
 import { t as cx } from "../class-names-BiMDVpUo.js";
-import { K as SpinnerIcon } from "../icons-DyOM0EJs.js";
 import { Button } from "./Button.js";
-import { u as ModelSelectorLogo } from "../ModelSelector-CEd8M9eK.js";
+import { q as SpinnerIcon } from "../icons-ua6f_GH3.js";
+import { u as ModelSelectorLogo } from "../ModelSelector-Brvj9Cab.js";
 import "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/ChatGptSignInScreen.tsx

package/dist/components/Checkbox.js

@@ -1,5 +1,5 @@
 import { n as mergeBaseClassName } from "../class-names-BiMDVpUo.js";
-import { u as CheckIcon } from "../icons-DyOM0EJs.js";
+import { d as CheckIcon } from "../icons-ua6f_GH3.js";
 import { jsx } from "react/jsx-runtime";
 import { Checkbox as Checkbox$1 } from "@base-ui/react/checkbox";
 //#region src/components/Checkbox.tsx

package/dist/components/Checkpoint.js

@@ -1,5 +1,5 @@
 import { t as cx } from "../class-names-BiMDVpUo.js";
-import { o as BookmarkIcon } from "../icons-DyOM0EJs.js";
+import { s as BookmarkIcon } from "../icons-ua6f_GH3.js";
 import { Marker, MarkerIcon } from "./Marker.js";
 import "react";
 import { jsx } from "react/jsx-runtime";

package/dist/components/CodeBlock.d.ts

@@ -1,2 +1,2 @@
-import { A as CodeBlockLanguage, C as CodeBlockLanguageSelectorValueProps, D as TokenizedCode, E as CodeBlockTitleProps, O as highlightCode, S as CodeBlockLanguageSelectorValue, T as CodeBlockTitle, _ as CodeBlockLanguageSelectorItem, a as CodeBlockContainerProps, b as CodeBlockLanguageSelectorTrigger, c as CodeBlockCopyButton, d as CodeBlockFilenameProps, f as CodeBlockHeader, g as CodeBlockLanguageSelectorContentProps, h as CodeBlockLanguageSelectorContent, i as CodeBlockContainer, k as CODE_BLOCK_LANGUAGES, l as CodeBlockCopyButtonProps, m as CodeBlockLanguageSelector, n as CodeBlockActions, o as CodeBlockContent, p as CodeBlockHeaderProps, r as CodeBlockActionsProps, s as CodeBlockContentProps, t as CodeBlock, u as CodeBlockFilename, v as CodeBlockLanguageSelectorItemProps, w as CodeBlockProps, x as CodeBlockLanguageSelectorTriggerProps, y as CodeBlockLanguageSelectorProps } from "../CodeBlock-Bbls1CnA.js";
+import { A as CodeBlockLanguage, C as CodeBlockLanguageSelectorValueProps, D as TokenizedCode, E as CodeBlockTitleProps, O as highlightCode, S as CodeBlockLanguageSelectorValue, T as CodeBlockTitle, _ as CodeBlockLanguageSelectorItem, a as CodeBlockContainerProps, b as CodeBlockLanguageSelectorTrigger, c as CodeBlockCopyButton, d as CodeBlockFilenameProps, f as CodeBlockHeader, g as CodeBlockLanguageSelectorContentProps, h as CodeBlockLanguageSelectorContent, i as CodeBlockContainer, k as CODE_BLOCK_LANGUAGES, l as CodeBlockCopyButtonProps, m as CodeBlockLanguageSelector, n as CodeBlockActions, o as CodeBlockContent, p as CodeBlockHeaderProps, r as CodeBlockActionsProps, s as CodeBlockContentProps, t as CodeBlock, u as CodeBlockFilename, v as CodeBlockLanguageSelectorItemProps, w as CodeBlockProps, x as CodeBlockLanguageSelectorTriggerProps, y as CodeBlockLanguageSelectorProps } from "../CodeBlock-yMpGqScn.js";
 export { CODE_BLOCK_LANGUAGES, CodeBlock, CodeBlockActions, CodeBlockActionsProps, CodeBlockContainer, CodeBlockContainerProps, CodeBlockContent, CodeBlockContentProps, CodeBlockCopyButton, CodeBlockCopyButtonProps, CodeBlockFilename, CodeBlockFilenameProps, CodeBlockHeader, CodeBlockHeaderProps, type CodeBlockLanguage, CodeBlockLanguageSelector, CodeBlockLanguageSelectorContent, CodeBlockLanguageSelectorContentProps, CodeBlockLanguageSelectorItem, CodeBlockLanguageSelectorItemProps, CodeBlockLanguageSelectorProps, CodeBlockLanguageSelectorTrigger, CodeBlockLanguageSelectorTriggerProps, CodeBlockLanguageSelectorValue, CodeBlockLanguageSelectorValueProps, CodeBlockProps, CodeBlockTitle, CodeBlockTitleProps, TokenizedCode, highlightCode };

package/dist/components/CodeBlock.js

@@ -1,2 +1,2 @@
-import { a as CodeBlockCopyButton, c as CodeBlockLanguageSelector, d as CodeBlockLanguageSelectorTrigger, f as CodeBlockLanguageSelectorValue, h as CODE_BLOCK_LANGUAGES, i as CodeBlockContent, l as CodeBlockLanguageSelectorContent, m as highlightCode, n as CodeBlockActions, o as CodeBlockFilename, p as CodeBlockTitle, r as CodeBlockContainer, s as CodeBlockHeader, t as CodeBlock, u as CodeBlockLanguageSelectorItem } from "../CodeBlock-ygtuzqJd.js";
+import { a as CodeBlockCopyButton, c as CodeBlockLanguageSelector, d as CodeBlockLanguageSelectorTrigger, f as CodeBlockLanguageSelectorValue, h as CODE_BLOCK_LANGUAGES, i as CodeBlockContent, l as CodeBlockLanguageSelectorContent, m as highlightCode, n as CodeBlockActions, o as CodeBlockFilename, p as CodeBlockTitle, r as CodeBlockContainer, s as CodeBlockHeader, t as CodeBlock, u as CodeBlockLanguageSelectorItem } from "../CodeBlock-Cp67Njo3.js";
 export { CODE_BLOCK_LANGUAGES, CodeBlock, CodeBlockActions, CodeBlockContainer, CodeBlockContent, CodeBlockCopyButton, CodeBlockFilename, CodeBlockHeader, CodeBlockLanguageSelector, CodeBlockLanguageSelectorContent, CodeBlockLanguageSelectorItem, CodeBlockLanguageSelectorTrigger, CodeBlockLanguageSelectorValue, CodeBlockTitle, highlightCode };

package/dist/components/CodexModelSelector.js

@@ -1,5 +1,5 @@
 import { t as cx } from "../class-names-BiMDVpUo.js";
-import { U as RefreshIcon, c as BrainIcon, d as ChevronDownIcon, p as ChevronRightIcon, u as CheckIcon } from "../icons-DyOM0EJs.js";
+import { W as RefreshIcon, d as CheckIcon, f as ChevronDownIcon, l as BrainIcon, m as ChevronRightIcon } from "../icons-ua6f_GH3.js";
 import { Tooltip } from "./Tooltip.js";
 import { i as titleCase } from "../format-S6uWyoSb.js";
 import { Menu } from "./Menu.js";

package/dist/components/Commit.d.ts

@@ -1,5 +1,5 @@
 import { t as Collapsible } from "../Collapsible-N64ASIQr.js";
-import { t as CopyButtonProps } from "../copy-button-BrvQ7z4W.js";
+import { t as CopyButtonProps } from "../copy-button-EBv_B9F6.js";
 import * as React from "react";
 
 //#region src/components/Commit.d.ts

package/dist/components/Commit.js

@@ -1,9 +1,9 @@
 import { t as cx } from "../class-names-BiMDVpUo.js";
 import { Collapsible } from "./Collapsible.js";
-import { S as FileIcon, p as ChevronRightIcon } from "../icons-DyOM0EJs.js";
-import { t as CopyButton } from "../copy-button-vo1paUSi.js";
-import { Badge } from "./Badge.js";
+import { C as FileIcon, m as ChevronRightIcon } from "../icons-ua6f_GH3.js";
 import { Avatar } from "./Avatar.js";
+import { t as CopyButton } from "../copy-button-TWq8nZhc.js";
+import { Badge } from "./Badge.js";
 import "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/Commit.tsx

package/dist/components/ContextMenu.js

@@ -1,5 +1,5 @@
 import { n as mergeBaseClassName, t as cx } from "../class-names-BiMDVpUo.js";
-import { _ as DotIcon, u as CheckIcon } from "../icons-DyOM0EJs.js";
+import { d as CheckIcon, v as DotIcon } from "../icons-ua6f_GH3.js";
 import "react";
 import { jsx } from "react/jsx-runtime";
 import { ContextMenu as ContextMenu$1 } from "@base-ui/react/context-menu";

package/dist/components/Conversation.d.ts

@@ -1,4 +1,4 @@
-import { t as Button } from "../Button-yRInko9u.js";
+import { n as IconButtonProps } from "../IconButton-CFKhu6OR.js";
 import { MessageScrollerButtonProps, MessageScrollerItemProps } from "./MessageScroller.js";
 import * as React from "react";
 import { UIMessage } from "ai";
@@ -104,7 +104,7 @@ declare function ConversationScrollButton({
  *   `### Role\n\n<text>` blocks joined by blank lines.
  */
 declare function messagesToMarkdown(messages: ConversationMessage[], formatMessage?: (message: ConversationMessage, index: number) => string): string;
-interface ConversationDownloadProps extends Omit<React.ComponentProps<typeof Button>, "onClick" | "children"> {
+interface ConversationDownloadProps extends Omit<IconButtonProps, "onClick" | "children" | "label"> {
   messages: ConversationMessage[];
   /** Filename for the downloaded Markdown file. */
   filename?: string;

package/dist/components/Conversation.js

@@ -1,6 +1,6 @@
 import { t as cx } from "../class-names-BiMDVpUo.js";
-import { n as ArrowDownIcon, v as DownloadIcon } from "../icons-DyOM0EJs.js";
-import { Button } from "./Button.js";
+import { n as ArrowDownIcon, y as DownloadIcon } from "../icons-ua6f_GH3.js";
+import { IconButton } from "./IconButton.js";
 import { t as assignRef } from "../merge-refs-DF_7w2x_.js";
 import { MessageScroller, MessageScrollerButton, MessageScrollerContent, MessageScrollerItem, MessageScrollerProvider, MessageScrollerViewport } from "./MessageScroller.js";
 import * as React from "react";
@@ -136,15 +136,14 @@ function ConversationDownload({ className, messages, filename = "conversation.md
 		anchor.remove();
 		URL.revokeObjectURL(url);
 	};
-	return /* @__PURE__ */ jsx(Button, {
+	return /* @__PURE__ */ jsx(IconButton, {
 		ref,
 		type: "button",
+		label,
 		variant,
 		color,
 		size,
-		iconOnly: true,
 		className: cx("conversation__download-button", className),
-		"aria-label": label,
 		onClick: handleClick,
 		...props,
 		children: children ?? /* @__PURE__ */ jsx(DownloadIcon, {})

package/dist/components/Dialog.d.ts

@@ -1,118 +1,2 @@
-import * as React from "react";
-import { Dialog as Dialog$1 } from "@base-ui/react/dialog";
-
-//#region src/components/Dialog.d.ts
-interface DialogProps extends Dialog$1.Root.Props {}
-interface DialogTriggerProps extends Dialog$1.Trigger.Props {}
-interface DialogPortalProps extends Dialog$1.Portal.Props {}
-interface DialogBackdropProps extends Dialog$1.Backdrop.Props {}
-interface DialogViewportProps extends Dialog$1.Viewport.Props {}
-interface DialogPopupProps extends Dialog$1.Popup.Props {
-  /**
-   * The size of the dialog.
-   * @default 'md'
-   */
-  size?: "sm" | "md" | "lg" | "fullscreen";
-}
-interface DialogTitleProps extends Dialog$1.Title.Props {}
-interface DialogDescriptionProps extends Dialog$1.Description.Props {}
-interface DialogCloseProps extends Dialog$1.Close.Props {}
-interface DialogHeaderProps extends React.HTMLAttributes<HTMLDivElement> {}
-interface DialogFooterProps extends React.HTMLAttributes<HTMLDivElement> {}
-/**
- * A dialog component for modal interactions.
- *
- * @example
- * ```tsx
- * <Dialog.Root open={isOpen} onOpenChange={setIsOpen}>
- *   <Dialog.Trigger render={<Button />}>Open</Dialog.Trigger>
- *   <Dialog.Portal>
- *     <Dialog.Backdrop />
- *     <Dialog.Viewport>
- *       <Dialog.Popup>
- *         <Dialog.Title>Confirm</Dialog.Title>
- *         <Dialog.Description>Are you sure?</Dialog.Description>
- *         <Dialog.Close>Cancel</Dialog.Close>
- *       </Dialog.Popup>
- *     </Dialog.Viewport>
- *   </Dialog.Portal>
- * </Dialog.Root>
- * ```
- *
- * @see {@link https://base-ui.com/react/components/dialog | Base UI Dialog}
- */
-declare function DialogTrigger(props: DialogTriggerProps): React.JSX.Element;
-declare function DialogBackdrop({
-  className,
-  ref,
-  ...props
-}: DialogBackdropProps & {
-  ref?: React.Ref<HTMLDivElement>;
-}): React.JSX.Element;
-declare function DialogViewport({
-  className,
-  ref,
-  ...props
-}: DialogViewportProps & {
-  ref?: React.Ref<HTMLDivElement>;
-}): React.JSX.Element;
-declare function DialogPopup({
-  size,
-  className,
-  ref,
-  ...props
-}: DialogPopupProps & {
-  ref?: React.Ref<HTMLDivElement>;
-}): React.JSX.Element;
-declare function DialogHeader({
-  className,
-  ref,
-  ...props
-}: DialogHeaderProps & {
-  ref?: React.Ref<HTMLDivElement>;
-}): React.JSX.Element;
-declare function DialogFooter({
-  className,
-  ref,
-  ...props
-}: DialogFooterProps & {
-  ref?: React.Ref<HTMLDivElement>;
-}): React.JSX.Element;
-declare function DialogTitle({
-  className,
-  ref,
-  ...props
-}: DialogTitleProps & {
-  ref?: React.Ref<HTMLHeadingElement>;
-}): React.JSX.Element;
-declare function DialogDescription({
-  className,
-  ref,
-  ...props
-}: DialogDescriptionProps & {
-  ref?: React.Ref<HTMLParagraphElement>;
-}): React.JSX.Element;
-declare function DialogClose({
-  render,
-  className,
-  ref,
-  ...props
-}: DialogCloseProps & {
-  ref?: React.Ref<HTMLButtonElement>;
-}): React.JSX.Element;
-declare const Dialog: {
-  Root: typeof Dialog$1.Root;
-  Trigger: typeof DialogTrigger;
-  Portal: React.ForwardRefExoticComponent<Omit<import("@base-ui/react").AlertDialogPortalProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
-  Backdrop: typeof DialogBackdrop;
-  Viewport: typeof DialogViewport;
-  Popup: typeof DialogPopup;
-  Header: typeof DialogHeader;
-  Footer: typeof DialogFooter;
-  Title: typeof DialogTitle;
-  Description: typeof DialogDescription;
-  Close: typeof DialogClose;
-  createHandle: typeof Dialog$1.createHandle;
-};
-//#endregion
+import { a as DialogFooterProps, c as DialogPortalProps, d as DialogTriggerProps, f as DialogViewportProps, i as DialogDescriptionProps, l as DialogProps, n as DialogBackdropProps, o as DialogHeaderProps, r as DialogCloseProps, s as DialogPopupProps, t as Dialog, u as DialogTitleProps } from "../Dialog-BD8NBKaE.js";
 export { Dialog, DialogBackdropProps, DialogCloseProps, DialogDescriptionProps, DialogFooterProps, DialogHeaderProps, DialogPopupProps, DialogPortalProps, DialogProps, DialogTitleProps, DialogTriggerProps, DialogViewportProps };

package/dist/components/Dialog.js

@@ -26,9 +26,17 @@ import { Dialog as Dialog$1 } from "@base-ui/react/dialog";
 *
 * @see {@link https://base-ui.com/react/components/dialog | Base UI Dialog}
 */
-function DialogTrigger(props) {
+function DialogTrigger({ render, className, ...props }) {
+	const classes = mergeBaseClassName(render == null ? buttonVariants({
+		variant: "normal",
+		color: "primary",
+		size: "sm",
+		className: "dialog__trigger"
+	}) : "dialog__trigger", className);
 	return /* @__PURE__ */ jsx(Dialog$1.Trigger, {
 		"data-slot": "dialog-trigger",
+		render,
+		className: classes,
 		...props
 	});
 }

package/dist/components/EnvironmentVariables.d.ts

@@ -1,4 +1,4 @@
-import { t as CopyButtonProps } from "../copy-button-BrvQ7z4W.js";
+import { t as CopyButtonProps } from "../copy-button-EBv_B9F6.js";
 import * as React from "react";
 
 //#region src/components/EnvironmentVariables.d.ts

package/dist/components/EnvironmentVariables.js

@@ -1,6 +1,6 @@
 import { t as cx } from "../class-names-BiMDVpUo.js";
-import { b as EyeIcon, x as EyeOffIcon } from "../icons-DyOM0EJs.js";
-import { t as CopyButton } from "../copy-button-vo1paUSi.js";
+import { S as EyeOffIcon, x as EyeIcon } from "../icons-ua6f_GH3.js";
+import { t as CopyButton } from "../copy-button-TWq8nZhc.js";
 import { Badge } from "./Badge.js";
 import { Switch } from "./Switch.js";
 import * as React from "react";

package/dist/components/FileTree.js

@@ -1,2 +1,2 @@
-import { a as FileTreeIcon, i as FileTreeFolder, n as FileTreeActions, o as FileTreeName, r as FileTreeFile, t as FileTree } from "../FileTree-CdgfccsM.js";
+import { a as FileTreeIcon, i as FileTreeFolder, n as FileTreeActions, o as FileTreeName, r as FileTreeFile, t as FileTree } from "../FileTree-DW60q1w7.js";
 export { FileTree, FileTreeActions, FileTreeFile, FileTreeFolder, FileTreeIcon, FileTreeName };

package/dist/components/IconButton.d.ts

@@ -1,32 +1,2 @@
-import { i as ButtonSize, r as ButtonProps } from "../Button-yRInko9u.js";
-import * as React from "react";
-
-//#region src/components/IconButton.d.ts
-interface IconButtonProps extends Omit<ButtonProps, "aria-label" | "children" | "size"> {
-  /** Decorative icon rendered inside the square button. */
-  children: React.ReactNode;
-  /** Accessible name and default tooltip text for the icon-only control. */
-  label: string;
-  /** Tooltip content when it should differ from the accessible name. */
-  tooltip?: React.ReactNode;
-  /** Preferred side for the tooltip. */
-  tooltipSide?: "top" | "right" | "bottom" | "left";
-  /** Square button size. */
-  size?: ButtonSize;
-}
-/**
- * A square, icon-only button with a required accessible name and matching
- * tooltip. Use text buttons for actions whose consequence an icon cannot make
- * clear on its own.
- */
-declare function IconButton({
-  children,
-  label,
-  size,
-  tooltip,
-  tooltipSide,
-  type,
-  ...props
-}: IconButtonProps): React.JSX.Element;
-//#endregion
+import { n as IconButtonProps, t as IconButton } from "../IconButton-CFKhu6OR.js";
 export { IconButton, IconButtonProps };

package/dist/components/IconButton.js

@@ -8,9 +8,10 @@ import { jsx, jsxs } from "react/jsx-runtime";
 * tooltip. Use text buttons for actions whose consequence an icon cannot make
 * clear on its own.
 */
-function IconButton({ children, label, size = "sm", tooltip = label, tooltipSide = "top", type = "button", ...props }) {
+function IconButton({ children, label, size = "sm", tooltip = label, tooltipSide = "top", type = "button", ref, ...props }) {
 	return /* @__PURE__ */ jsxs(Tooltip.Root, { children: [/* @__PURE__ */ jsx(Tooltip.Trigger, {
 		render: /* @__PURE__ */ jsx(Button, {
+			ref,
 			type,
 			size,
 			iconOnly: true,

package/dist/components/McpConnectionRequest.d.ts

@@ -1,4 +1,4 @@
-import { McpServerCard } from "../utils/mcp-server-catalog.js";
+import { o as McpServerCard } from "../mcp-server-catalog-DycejaJ5.js";
 import * as React from "react";
 import { DynamicToolUIPart, ToolUIPart } from "ai";
 import { MCPServersState } from "agents";

package/dist/components/McpConnectionRequest.js

@@ -1,6 +1,6 @@
 import { t as cx } from "../class-names-BiMDVpUo.js";
-import { A as McpIcon, K as SpinnerIcon, Q as WarningIcon, u as CheckIcon } from "../icons-DyOM0EJs.js";
 import { Button } from "./Button.js";
+import { $ as WarningIcon, d as CheckIcon, j as McpIcon, q as SpinnerIcon } from "../icons-ua6f_GH3.js";
 import { AgentAttention, AgentAttentionActions, AgentAttentionBody, AgentAttentionHeader } from "./AgentAttention.js";
 import { getMcpServerEntry, getMcpServerRuntimeState } from "../utils/mcp-server-catalog.js";
 import { DescriptionList } from "./DescriptionList.js";

package/dist/components/McpPluginCatalog.d.ts

@@ -0,0 +1,86 @@
+import { o as McpServerCard } from "../mcp-server-catalog-DycejaJ5.js";
+import { l as DialogProps } from "../Dialog-BD8NBKaE.js";
+import * as React from "react";
+import { MCPServersState } from "agents";
+
+//#region src/components/McpPluginCatalog.d.ts
+/** Optional plugin-specific copy layered over the canonical MCP server card. */
+interface McpPluginDetails {
+  developerName?: string;
+  marketplaceName?: string;
+  longDescription?: string;
+  capabilities?: readonly string[];
+  skills?: readonly string[];
+}
+interface McpPluginCatalogProps extends Omit<React.HTMLAttributes<HTMLElement>, "onSelect"> {
+  /** Canonical connector cards. The directory does not create a second plugin registry. */
+  servers: readonly McpServerCard[];
+  /** Upstream Agents MCP state used to project connected and recovery states. */
+  mcp?: MCPServersState;
+  /** Optional plugin metadata keyed by the canonical server ID. */
+  detailsByServerId?: Readonly<Record<string, McpPluginDetails | undefined>>;
+  /** Server IDs promoted into the Featured section, in display order. */
+  featuredServerIds?: readonly string[];
+  /** Host product name paired with the plugin in the connection dialog. */
+  brandName?: string;
+  /** Host product mark paired with the plugin in the connection dialog. */
+  brandLogo?: React.ReactNode;
+  /** Product-authored trust and data-sharing copy. Pass null to omit it. */
+  disclosure?: React.ReactNode;
+  /** Starts or recovers the existing MCP connection path. */
+  onConnect?: (server: McpServerCard) => void | Promise<void>;
+  /** Removes the exact upstream MCP entry. */
+  onDisconnect?: (serverId: string) => void | Promise<void>;
+  heading?: React.ReactNode;
+  description?: React.ReactNode;
+  searchLabel?: string;
+  emptyMessage?: React.ReactNode;
+}
+interface McpPluginDetailsDialogProps {
+  /** Selected canonical server card. Passing null closes the dialog. */
+  server: McpServerCard | null;
+  details?: McpPluginDetails;
+  mcp?: MCPServersState;
+  brandName?: string;
+  brandLogo?: React.ReactNode;
+  disclosure?: React.ReactNode;
+  onConnect?: (server: McpServerCard) => void | Promise<void>;
+  onDisconnect?: (serverId: string) => void | Promise<void>;
+  onOpenChange: NonNullable<DialogProps["onOpenChange"]>;
+}
+/**
+ * Searchable plugin directory backed by the same MCP cards and live Agents
+ * state as {@link McpServerPicker}. Selecting a row opens the shared details
+ * dialog; connecting still delegates to the host's existing MCP/OAuth path.
+ */
+declare function McpPluginCatalog({
+  servers,
+  mcp,
+  detailsByServerId,
+  featuredServerIds,
+  brandName,
+  brandLogo,
+  disclosure,
+  onConnect,
+  onDisconnect,
+  heading,
+  description,
+  searchLabel,
+  emptyMessage,
+  className,
+  ...props
+}: McpPluginCatalogProps): React.JSX.Element;
+/** Reference-derived plugin detail surface without a parallel install state. */
+declare function McpPluginDetailsDialog({
+  server,
+  details,
+  mcp,
+  brandName,
+  brandLogo,
+  disclosure,
+  onConnect,
+  onDisconnect,
+  onOpenChange
+}: McpPluginDetailsDialogProps): React.JSX.Element;
+//#endregion
+export { McpPluginCatalog, McpPluginCatalogProps, McpPluginDetails, McpPluginDetailsDialog, McpPluginDetailsDialogProps };