Skip to content
fabrials/ ui

MCP

Connection panel

An endpoint, an auth method, and a clear connection state.

Server connection

disconnected

Direct connections stay in your browser. The endpoint must allow CORS. Use the optional server connector for private credentials.

Installation

Terminal
bunx shadcn@latest add https://ui.fabrials.com/r/connection-panel.json

API

Prop / exportTypeDescription
statusstringConnection lifecycle state.
onConnect(ConnectionOptions) => Promise<void>Connect with the selected method.
onDisconnect() => Promise<void>Release the connection.
defaultEndpointstring?Initial endpoint URL.

Behavior & compatibility

Bearer tokens stay in memory. OAuth requires callback and client metadata routes; see the authentication guide. CORS is controlled by the destination server.

Accessibility

Keep visible labels, keyboard focus and status announcements when customizing. These components inherit your theme; maintain sufficient contrast in both color modes. The preview is fully keyboard operable.