@arcadeai/design-system 3.40.0 → 3.42.3

package/dist/components/ui/templates/gateway-diagram.d.ts

@@ -0,0 +1,28 @@
+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-runtime").JSX.Element;
+export { GatewayDiagram };
+export type { GatewayDiagramProps };
+//# sourceMappingURL=gateway-diagram.d.ts.map

package/dist/components/ui/templates/gateway-diagram.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"gateway-diagram.d.ts","sourceRoot":"","sources":["../../../../lib/components/ui/templates/gateway-diagram.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAI5C,OAAO,EAEL,KAAK,gBAAgB,EACtB,MAAM,wCAAwC,CAAC;AAChD,OAAO,EAAuB,KAAK,WAAW,EAAE,MAAM,wBAAwB,CAAC;AAI/E;;;GAGG;AACH,eAAO,MAAM,sBAAsB,EAAE,SAAS,WAAW,EAQxD,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,sBAAsB,EAAE,SAAS,MAAM,EAYnD,CAAC;AAKF,KAAK,mBAAmB,GAAG;IACzB,gDAAgD;IAChD,YAAY,CAAC,EAAE,SAAS,WAAW,EAAE,CAAC;IACtC,4DAA4D;IAC5D,YAAY,CAAC,EAAE,SAAS,MAAM,EAAE,CAAC;IACjC,OAAO,CAAC,EAAE,gBAAgB,CAAC,SAAS,CAAC,CAAC;IACtC,SAAS,CAAC,EAAE,gBAAgB,CAAC,WAAW,CAAC,CAAC;IAC1C,SAAS,CAAC,EAAE,gBAAgB,CAAC,WAAW,CAAC,CAAC;IAC1C,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;CACjC,GAAG,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC,CAAC;AAsB5C,iBAAS,cAAc,CAAC,EACtB,YAAqC,EACrC,YAAqC,EACrC,OAAgB,EAChB,SAAkB,EAClB,SAAS,EACT,IAAW,EACX,YAAY,EAAE,SAAwC,EACtD,GAAG,KAAK,EACT,EAAE,mBAAmB,2CAmDrB;AAED,OAAO,EAAE,cAAc,EAAE,CAAC;AAC1B,YAAY,EAAE,mBAAmB,EAAE,CAAC"}

package/dist/components/ui/templates/gateway-diagram.js

@@ -0,0 +1,76 @@
+import { jsx as e } from "react/jsx-runtime";
+import { FlowHub as p } from "../atoms/flow-hub.js";
+import { FlowTile as n } from "../atoms/flow-tile.js";
+import { Arcade as S } from "../atoms/icons/arcade.js";
+import { FlowDiagram as T } from "../molecules/flow-diagram.js";
+import { MCP_CLIENT_METADATA as A } from "../../../metadata/mcp-clients.js";
+import { TOOLKIT_ICON_MAP as E } from "../../../metadata/toolkit-icons.js";
+import { TOOLKITS as I } from "../../../metadata/toolkits.js";
+const w = [
+  "claude_code",
+  "cursor",
+  "vscode",
+  "codex",
+  "gemini_cli",
+  "claude_desktop",
+  "windsurf"
+], C = [
+  "Gmail",
+  "Slack",
+  "Github",
+  "Linear",
+  "Notion",
+  "Jira",
+  "Hubspot",
+  "GoogleCalendar",
+  "GoogleDrive",
+  "Salesforce",
+  "Stripe"
+], D = "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))]", L = {
+  sm: "md",
+  md: "lg",
+  lg: "xl"
+};
+function P({
+  mcpClientIds: c = w,
+  mcpServerIds: _ = C,
+  animate: m = "both",
+  animation: s = "flow",
+  lineStyle: d,
+  size: l = "md",
+  "aria-label": f = "Arcade MCP gateway diagram",
+  ...u
+}) {
+  const i = l, h = L[l], b = c.map((r) => {
+    const o = A[r];
+    if (!o)
+      return null;
+    const { label: a, Icon: t } = o;
+    return /* @__PURE__ */ e(n, { label: a, size: i, children: /* @__PURE__ */ e(t, {}) }, r);
+  }).filter((r) => r !== null), g = _.map((r) => {
+    const o = E[r];
+    if (!o)
+      return null;
+    const a = I.find((t) => t.id === r)?.label ?? r;
+    return /* @__PURE__ */ e(n, { label: a, size: i, children: /* @__PURE__ */ e(o, {}) }, r);
+  }).filter((r) => r !== null);
+  return /* @__PURE__ */ e(
+    T,
+    {
+      animate: m,
+      animation: s,
+      "aria-label": f,
+      center: /* @__PURE__ */ e(p, { className: D, size: h, children: /* @__PURE__ */ e(S, { "aria-hidden": !0 }) }),
+      left: b,
+      lineStyle: d,
+      right: g,
+      size: l,
+      ...u
+    }
+  );
+}
+export {
+  w as DEFAULT_MCP_CLIENT_IDS,
+  C as DEFAULT_MCP_SERVER_IDS,
+  P as GatewayDiagram
+};

package/dist/components/ui/templates/index.d.ts

@@ -7,4 +7,6 @@ export type { ChatBodySkeletonProps, ChatContentSkeletonProps, ChatFooterSkeleto
 export { ChatBodySkeleton, ChatContentSkeleton, ChatFooterSkeleton, ChatHeaderSkeleton, ChatSidebarSkeleton, } from './chat-template-skeletons';
 export type { ErrorTemplateActionsProps, ErrorTemplateContentProps, ErrorTemplateDescriptionProps, ErrorTemplateIconProps, ErrorTemplateLogoProps, ErrorTemplateProps, ErrorTemplateTitleProps, ErrorTemplateUrlProps, } from './error-template';
 export { ErrorTemplate, ErrorTemplateActions, ErrorTemplateContent, ErrorTemplateDescription, ErrorTemplateIcon, ErrorTemplateLogo, ErrorTemplateTitle, ErrorTemplateUrl, } from './error-template';
+export type { GatewayDiagramProps } from './gateway-diagram';
+export { DEFAULT_MCP_CLIENT_IDS, DEFAULT_MCP_SERVER_IDS, GatewayDiagram, } from './gateway-diagram';
 //# sourceMappingURL=index.d.ts.map

package/dist/components/ui/templates/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../lib/components/ui/templates/index.ts"],"names":[],"mappings":"AAAA,+GAA+G;AAE/G,YAAY,EACV,qBAAqB,EACrB,wBAAwB,EACxB,kCAAkC,EAClC,4BAA4B,EAC5B,uBAAuB,EACvB,4BAA4B,EAC5B,uBAAuB,EACvB,0BAA0B,EAC1B,sBAAsB,EACtB,qBAAqB,EACrB,2BAA2B,EAC3B,uBAAuB,EACvB,iBAAiB,EACjB,sBAAsB,EACtB,gCAAgC,GACjC,MAAM,iBAAiB,CAAC;AACzB,OAAO,EACL,YAAY,EACZ,gBAAgB,EAChB,mBAAmB,EACnB,6BAA6B,EAC7B,uBAAuB,EACvB,kBAAkB,EAClB,uBAAuB,EACvB,kBAAkB,EAClB,iBAAiB,EACjB,qBAAqB,EACrB,gBAAgB,EAChB,kBAAkB,EAClB,sBAAsB,EACtB,iBAAiB,EACjB,2BAA2B,GAC5B,MAAM,iBAAiB,CAAC;AACzB,YAAY,EACV,qBAAqB,EACrB,uBAAuB,EACvB,4BAA4B,EAC5B,uBAAuB,EACvB,yBAAyB,EACzB,iCAAiC,EACjC,8BAA8B,EAC9B,iBAAiB,EACjB,4BAA4B,GAC7B,MAAM,iBAAiB,CAAC;AACzB,OAAO,EACL,YAAY,EACZ,gBAAgB,EAChB,kBAAkB,EAClB,kBAAkB,EAClB,uBAAuB,EACvB,oBAAoB,EACpB,4BAA4B,EAC5B,yBAAyB,EACzB,uBAAuB,GACxB,MAAM,iBAAiB,CAAC;AACzB,YAAY,EACV,qBAAqB,EACrB,wBAAwB,EACxB,uBAAuB,EACvB,uBAAuB,EACvB,wBAAwB,GACzB,MAAM,2BAA2B,CAAC;AACnC,OAAO,EACL,gBAAgB,EAChB,mBAAmB,EACnB,kBAAkB,EAClB,kBAAkB,EAClB,mBAAmB,GACpB,MAAM,2BAA2B,CAAC;AACnC,YAAY,EACV,yBAAyB,EACzB,yBAAyB,EACzB,6BAA6B,EAC7B,sBAAsB,EACtB,sBAAsB,EACtB,kBAAkB,EAClB,uBAAuB,EACvB,qBAAqB,GACtB,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EACL,aAAa,EACb,oBAAoB,EACpB,oBAAoB,EACpB,wBAAwB,EACxB,iBAAiB,EACjB,iBAAiB,EACjB,kBAAkB,EAClB,gBAAgB,GACjB,MAAM,kBAAkB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../lib/components/ui/templates/index.ts"],"names":[],"mappings":"AAAA,+GAA+G;AAE/G,YAAY,EACV,qBAAqB,EACrB,wBAAwB,EACxB,kCAAkC,EAClC,4BAA4B,EAC5B,uBAAuB,EACvB,4BAA4B,EAC5B,uBAAuB,EACvB,0BAA0B,EAC1B,sBAAsB,EACtB,qBAAqB,EACrB,2BAA2B,EAC3B,uBAAuB,EACvB,iBAAiB,EACjB,sBAAsB,EACtB,gCAAgC,GACjC,MAAM,iBAAiB,CAAC;AACzB,OAAO,EACL,YAAY,EACZ,gBAAgB,EAChB,mBAAmB,EACnB,6BAA6B,EAC7B,uBAAuB,EACvB,kBAAkB,EAClB,uBAAuB,EACvB,kBAAkB,EAClB,iBAAiB,EACjB,qBAAqB,EACrB,gBAAgB,EAChB,kBAAkB,EAClB,sBAAsB,EACtB,iBAAiB,EACjB,2BAA2B,GAC5B,MAAM,iBAAiB,CAAC;AACzB,YAAY,EACV,qBAAqB,EACrB,uBAAuB,EACvB,4BAA4B,EAC5B,uBAAuB,EACvB,yBAAyB,EACzB,iCAAiC,EACjC,8BAA8B,EAC9B,iBAAiB,EACjB,4BAA4B,GAC7B,MAAM,iBAAiB,CAAC;AACzB,OAAO,EACL,YAAY,EACZ,gBAAgB,EAChB,kBAAkB,EAClB,kBAAkB,EAClB,uBAAuB,EACvB,oBAAoB,EACpB,4BAA4B,EAC5B,yBAAyB,EACzB,uBAAuB,GACxB,MAAM,iBAAiB,CAAC;AACzB,YAAY,EACV,qBAAqB,EACrB,wBAAwB,EACxB,uBAAuB,EACvB,uBAAuB,EACvB,wBAAwB,GACzB,MAAM,2BAA2B,CAAC;AACnC,OAAO,EACL,gBAAgB,EAChB,mBAAmB,EACnB,kBAAkB,EAClB,kBAAkB,EAClB,mBAAmB,GACpB,MAAM,2BAA2B,CAAC;AACnC,YAAY,EACV,yBAAyB,EACzB,yBAAyB,EACzB,6BAA6B,EAC7B,sBAAsB,EACtB,sBAAsB,EACtB,kBAAkB,EAClB,uBAAuB,EACvB,qBAAqB,GACtB,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EACL,aAAa,EACb,oBAAoB,EACpB,oBAAoB,EACpB,wBAAwB,EACxB,iBAAiB,EACjB,iBAAiB,EACjB,kBAAkB,EAClB,gBAAgB,GACjB,MAAM,kBAAkB,CAAC;AAC1B,YAAY,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAC7D,OAAO,EACL,sBAAsB,EACtB,sBAAsB,EACtB,cAAc,GACf,MAAM,mBAAmB,CAAC"}

package/dist/components/ui/templates/index.js

@@ -1,7 +1,8 @@
-import { AuthTemplate as a, AuthTemplateCard as r, AuthTemplateContent as o, AuthTemplateDefaultBackground as l, AuthTemplateDescription as p, AuthTemplateFooter as m, AuthTemplateGridOverlay as T, AuthTemplateHeader as h, AuthTemplateLegal as u, AuthTemplateLegalLink as n, AuthTemplateLogo as i, AuthTemplatePrompt as C, AuthTemplatePromptLink as A, AuthTemplateTitle as d, AuthTemplateVideoBackground as k } from "./auth-template.js";
-import { ChatTemplate as E, ChatTemplateBody as S, ChatTemplateFooter as v, ChatTemplateHeader as c, ChatTemplateHeaderGroup as L, ChatTemplateOverview as f, ChatTemplateOverviewSubtitle as s, ChatTemplateOverviewTitle as x, ChatTemplateSuggestions as B } from "./chat-template.js";
-import { ChatBodySkeleton as O, ChatContentSkeleton as w, ChatFooterSkeleton as y, ChatHeaderSkeleton as D, ChatSidebarSkeleton as F } from "./chat-template-skeletons.js";
-import { ErrorTemplate as G, ErrorTemplateActions as P, ErrorTemplateContent as I, ErrorTemplateDescription as U, ErrorTemplateIcon as V, ErrorTemplateLogo as j, ErrorTemplateTitle as q, ErrorTemplateUrl as z } from "./error-template.js";
+import { AuthTemplate as a, AuthTemplateCard as r, AuthTemplateContent as o, AuthTemplateDefaultBackground as l, AuthTemplateDescription as p, AuthTemplateFooter as m, AuthTemplateGridOverlay as T, AuthTemplateHeader as h, AuthTemplateLegal as u, AuthTemplateLegalLink as C, AuthTemplateLogo as n, AuthTemplatePrompt as i, AuthTemplatePromptLink as A, AuthTemplateTitle as E, AuthTemplateVideoBackground as d } from "./auth-template.js";
+import { ChatTemplate as g, ChatTemplateBody as k, ChatTemplateFooter as L, ChatTemplateHeader as D, ChatTemplateHeaderGroup as v, ChatTemplateOverview as c, ChatTemplateOverviewSubtitle as f, ChatTemplateOverviewTitle as _, ChatTemplateSuggestions as s } from "./chat-template.js";
+import { ChatBodySkeleton as F, ChatContentSkeleton as w, ChatFooterSkeleton as y, ChatHeaderSkeleton as B, ChatSidebarSkeleton as H } from "./chat-template-skeletons.js";
+import { ErrorTemplate as O, ErrorTemplateActions as P, ErrorTemplateContent as G, ErrorTemplateDescription as U, ErrorTemplateIcon as b, ErrorTemplateLogo as M, ErrorTemplateTitle as R, ErrorTemplateUrl as V } from "./error-template.js";
+import { DEFAULT_MCP_CLIENT_IDS as j, DEFAULT_MCP_SERVER_IDS as q, GatewayDiagram as z } from "./gateway-diagram.js";
 export {
   a as AuthTemplate,
   r as AuthTemplateCard,
@@ -12,32 +13,35 @@ export {
   T as AuthTemplateGridOverlay,
   h as AuthTemplateHeader,
   u as AuthTemplateLegal,
-  n as AuthTemplateLegalLink,
-  i as AuthTemplateLogo,
-  C as AuthTemplatePrompt,
+  C as AuthTemplateLegalLink,
+  n as AuthTemplateLogo,
+  i as AuthTemplatePrompt,
   A as AuthTemplatePromptLink,
-  d as AuthTemplateTitle,
-  k as AuthTemplateVideoBackground,
-  O as ChatBodySkeleton,
+  E as AuthTemplateTitle,
+  d as AuthTemplateVideoBackground,
+  F as ChatBodySkeleton,
   w as ChatContentSkeleton,
   y as ChatFooterSkeleton,
-  D as ChatHeaderSkeleton,
-  F as ChatSidebarSkeleton,
-  E as ChatTemplate,
-  S as ChatTemplateBody,
-  v as ChatTemplateFooter,
-  c as ChatTemplateHeader,
-  L as ChatTemplateHeaderGroup,
-  f as ChatTemplateOverview,
-  s as ChatTemplateOverviewSubtitle,
-  x as ChatTemplateOverviewTitle,
-  B as ChatTemplateSuggestions,
-  G as ErrorTemplate,
+  B as ChatHeaderSkeleton,
+  H as ChatSidebarSkeleton,
+  g as ChatTemplate,
+  k as ChatTemplateBody,
+  L as ChatTemplateFooter,
+  D as ChatTemplateHeader,
+  v as ChatTemplateHeaderGroup,
+  c as ChatTemplateOverview,
+  f as ChatTemplateOverviewSubtitle,
+  _ as ChatTemplateOverviewTitle,
+  s as ChatTemplateSuggestions,
+  j as DEFAULT_MCP_CLIENT_IDS,
+  q as DEFAULT_MCP_SERVER_IDS,
+  O as ErrorTemplate,
   P as ErrorTemplateActions,
-  I as ErrorTemplateContent,
+  G as ErrorTemplateContent,
   U as ErrorTemplateDescription,
-  V as ErrorTemplateIcon,
-  j as ErrorTemplateLogo,
-  q as ErrorTemplateTitle,
-  z as ErrorTemplateUrl
+  b as ErrorTemplateIcon,
+  M as ErrorTemplateLogo,
+  R as ErrorTemplateTitle,
+  V as ErrorTemplateUrl,
+  z as GatewayDiagram
 };