import { Arcade as e } from "../atoms/icons/arcade.js";
import { FlowTile as t } from "../atoms/flow-tile.js";
import { FlowDiagram as n } from "../molecules/flow-diagram.js";
import { FlowHub as r } from "../atoms/flow-hub.js";
import { MCP_CLIENT_METADATA as i } from "../../../metadata/mcp-clients.js";
import { TOOLKITS as a } from "../../../metadata/toolkits.js";
import { TOOLKIT_ICON_MAP as o } from "../../../metadata/toolkit-icons.js";
import { jsx as s } from "react/jsx-runtime";
//#region lib/components/ui/templates/gateway-diagram.tsx
var c = [
	"claude_code",
	"cursor",
	"vscode",
	"codex",
	"gemini_cli",
	"claude_desktop",
	"windsurf"
], l = [
	"Gmail",
	"Slack",
	"Github",
	"Linear",
	"Notion",
	"Jira",
	"Hubspot",
	"GoogleCalendar",
	"GoogleDrive",
	"Salesforce",
	"Stripe"
], u = "shadow-amber-950/25 shadow-xl bg-[linear-gradient(135deg,oklch(from_var(--brand-yellow)_l_c_h_/_0.55),oklch(from_var(--brand-green)_l_c_h_/_0.4),oklch(from_var(--brand-fuchsia)_l_c_h_/_0.45))]", d = {
	sm: "md",
	md: "lg",
	lg: "xl"
};
function f({ mcpClientIds: f = c, mcpServerIds: p = l, animate: m = "both", animation: h = "flow", lineStyle: g, size: _ = "md", "aria-label": v = "Arcade MCP gateway diagram", ...y }) {
	let b = _, x = d[_], S = f.map((e) => {
		let n = i[e];
		if (!n) return null;
		let { label: r, Icon: a } = n;
		return /* @__PURE__ */ s(t, {
			label: r,
			size: b,
			children: /* @__PURE__ */ s(a, {})
		}, e);
	}).filter((e) => e !== null), C = p.map((e) => {
		let n = o[e];
		return n ? /* @__PURE__ */ s(t, {
			label: a.find((t) => t.id === e)?.label ?? e,
			size: b,
			children: /* @__PURE__ */ s(n, {})
		}, e) : null;
	}).filter((e) => e !== null);
	return /* @__PURE__ */ s(n, {
		animate: m,
		animation: h,
		"aria-label": v,
		center: /* @__PURE__ */ s(r, {
			className: u,
			size: x,
			children: /* @__PURE__ */ s(e, { "aria-hidden": !0 })
		}),
		left: S,
		lineStyle: g,
		right: C,
		size: _,
		...y
	});
}
//#endregion
export { c as DEFAULT_MCP_CLIENT_IDS, l as DEFAULT_MCP_SERVER_IDS, f as GatewayDiagram };
