import { ComponentProps } from 'react';
import { FlowDiagramProps } from '../molecules/flow-diagram';
import { McpClientId } from '../../../metadata/mcp-clients';
/**
 * Default client IDs shown on the left when none are provided. These map
 * into `MCP_CLIENT_METADATA` for label + icon resolution.
 */
export declare const DEFAULT_MCP_CLIENT_IDS: readonly McpClientId[];
/**
 * Default toolkit IDs shown on the right when none are provided. These
 * map into `TOOLKIT_ICON_MAP` (for the icon) and `TOOLKITS` (for the
 * label).
 */
export declare const DEFAULT_MCP_SERVER_IDS: readonly string[];
type GatewayDiagramProps = {
    /** MCP client identifiers shown on the left. */
    mcpClientIds?: readonly McpClientId[];
    /** Toolkit identifiers shown on the right (MCP servers). */
    mcpServerIds?: readonly string[];
    animate?: FlowDiagramProps["animate"];
    animation?: FlowDiagramProps["animation"];
    lineStyle?: FlowDiagramProps["lineStyle"];
    size?: FlowDiagramProps["size"];
} & Omit<ComponentProps<"div">, "children">;
declare function GatewayDiagram({ mcpClientIds, mcpServerIds, animate, animation, lineStyle, size, "aria-label": ariaLabel, ...props }: GatewayDiagramProps): import("react").JSX.Element;
export { GatewayDiagram };
export type { GatewayDiagramProps };
//# sourceMappingURL=gateway-diagram.d.ts.map