/** * * MCP (Model Context Protocol) * * Components for managing MCP server connections and displaying server status. * MCP enables agentic workflows by connecting to external tool servers. * * The MCP system integrates with: * - `mcpStore` for server CRUD operations and health checks * - `conversationsStore` for per-conversation server enable/disable * */ /** * **McpServersSettings** - MCP servers configuration section * * Settings section for configuring MCP server connections. * Displays server cards with status, tools, and management actions. * Used within DialogMcpServersSettings. * * **Architecture:** * - Manages add server form state locally * - Delegates server display to McpServerCard components * - Integrates with mcpStore for server operations * - Shows skeleton loading states during health checks * * **Features:** * - Add new MCP servers by URL with validation * - Server cards with connection status indicators * - Health check status (connected/disconnected/error) * - Tools list per server showing available capabilities * - Enable/disable toggle per conversation * - Edit/delete server actions * - Skeleton loading states during connection * - Empty state with helpful message * * @example * ```svelte * * ``` */ export { default as McpServersSettings } from './McpServersSettings.svelte'; /** * **McpActiveServersAvatars** - Active MCP servers indicator * * Compact avatar row showing favicons of active MCP servers. * Displays up to 3 server icons with "+N" counter for additional servers. * Clickable to open MCP settings dialog. * * **Architecture:** * - Filters servers by enabled status and health check * - Fetches favicons from server URLs * - Integrates with conversationsStore for per-chat server state * * **Features:** * - Overlapping favicon avatars (max 3 visible) * - "+N" counter for additional servers * - Click handler for settings navigation * - Disabled state support * - Only shows healthy, enabled servers * * @example * ```svelte * showMcpSettings = true} * /> * ``` */ export { default as McpActiveServersAvatars } from './McpActiveServersAvatars.svelte'; /** * **McpServerSelector** - Quick MCP server toggle dropdown * * Compact dropdown for quickly enabling/disabling MCP servers for the current chat. * Uses McpActiveServersAvatars as trigger and shows searchable server list with switches. * * **Architecture:** * - Uses DropdownMenuSearchable for searchable dropdown UI * - McpActiveServersAvatars as the trigger element * - Integrates with conversationsStore for per-chat toggle * - Runs health checks on dropdown open * * **Features:** * - Searchable server list by name/URL * - Switch toggles matching McpServersSettings behavior * - Error state display for unhealthy servers * - Footer link to full MCP settings dialog * * @example * ```svelte * showMcpSettings = true} * /> * ``` */ export { default as McpServerSelector } from './McpServerSelector.svelte'; /** * **McpCapabilitiesBadges** - Server capabilities display * * Displays MCP server capabilities as colored badges. * Shows which features the server supports (tools, resources, prompts, etc.). * * **Features:** * - Tools badge (green) - server provides callable tools * - Resources badge (blue) - server provides data resources * - Prompts badge (purple) - server provides prompt templates * - Logging badge (orange) - server supports logging * - Completions badge (cyan) - server provides completions * - Tasks badge (pink) - server supports task management */ export { default as McpCapabilitiesBadges } from './McpCapabilitiesBadges.svelte'; /** * **McpConnectionLogs** - Connection log viewer * * Collapsible panel showing MCP server connection logs. * Displays timestamped log entries with level-based styling. * * **Features:** * - Collapsible log list with entry count * - Connection time display in milliseconds * - Log level icons and color coding * - Scrollable log container with max height * - Monospace font for log readability */ export { default as McpConnectionLogs } from './McpConnectionLogs.svelte'; /** * **McpServerForm** - Server URL and headers input form * * Reusable form for entering MCP server connection details. * Used in both add new server and edit server flows. * * **Features:** * - URL input with validation error display * - Custom headers key-value pairs editor * - Controlled component with change callbacks * * @example * ```svelte * serverUrl = v} * onHeadersChange={(v) => serverHeaders = v} * urlError={validationError} * /> * ``` */ export { default as McpServerForm } from './McpServerForm.svelte'; /** * MCP protocol logo SVG component. Renders the official MCP icon * with customizable size via class and style props. */ export { default as McpLogo } from './McpLogo.svelte'; /** * * SERVER CARD * * Components for displaying individual MCP server status and controls. * McpServerCard is the main component, with sub-components for specific sections. * */ /** * **McpServerCard** - Individual server display card * * Main component for displaying a single MCP server with all its details. * Manages edit mode, delete confirmation, and health check actions. * * **Architecture:** * - Composes header, tools list, logs, and actions sub-components * - Manages local edit/delete state * - Reads health state from mcpStore * - Triggers health checks via mcpStore * * **Features:** * - Server header with favicon, name, version, and toggle * - Capabilities badges display * - Tools list with descriptions * - Connection logs viewer * - Edit form for URL and headers * - Delete confirmation dialog * - Skeleton loading states */ export { default as McpServerCard } from './McpServerCard/McpServerCard.svelte'; /** Server card header with favicon, name, version badge, and enable toggle. */ export { default as McpServerCardHeader } from './McpServerCard/McpServerCardHeader.svelte'; /** Action buttons row: edit, refresh, delete. */ export { default as McpServerCardActions } from './McpServerCard/McpServerCardActions.svelte'; /** Collapsible tools list showing available server tools with descriptions. */ export { default as McpServerCardToolsList } from './McpServerCard/McpServerCardToolsList.svelte'; /** Inline edit form for server URL and custom headers. */ export { default as McpServerCardEditForm } from './McpServerCard/McpServerCardEditForm.svelte'; /** Delete confirmation dialog with server name display. */ export { default as McpServerCardDeleteDialog } from './McpServerCard/McpServerCardDeleteDialog.svelte'; /** * **McpServerInfo** - Server instructions display * * Collapsible panel showing server-provided instructions. * Displays guidance text from the MCP server for users. */ export { default as McpServerInfo } from './McpServerInfo.svelte'; /** * **McpResourceBrowser** - MCP resources tree browser * * Tree view component showing resources grouped by server. * Supports resource selection and quick attach actions. * * **Features:** * - Collapsible server sections * - Resource icons based on MIME type * - Resource selection highlighting * - Quick attach button per resource * - Refresh all resources action * - Loading states per server */ export { default as McpResourceBrowser } from './McpResourceBrowser.svelte'; /** * **McpResourcePreview** - MCP resource content preview * * Preview panel showing resource content with metadata. * Supports text and binary content display. * * **Features:** * - Text content display with monospace formatting * - Image preview for image MIME types * - Copy to clipboard action * - Download content action * - Resource metadata display (MIME type, priority, server) * - Loading and error states */ export { default as McpResourcePreview } from './McpResourcePreview.svelte'; /** * **McpResourcePicker** - MCP resource selection dialog * * Full dialog for browsing and attaching MCP resources. * Combines browser and preview panels. * * **Features:** * - Split panel layout (browser + preview) * - Resource selection with preview * - Quick attach from browser * - Attach selected resource action * - Auto-fetch resources on open */ export { default as McpResourcePicker } from './McpResourcePicker.svelte';