@arcadeai/design-system 3.46.1 → 3.49.0

package/dist/components/ui/molecules/mcp-server-picker/tool-card.d.ts

@@ -0,0 +1,22 @@
+import * as React from "react";
+export type McpToolCardProps = {
+    /**
+     * Friendly, human-readable tool title (e.g. "Send email"). The consumer is
+     * responsible for humanizing; the card renders this verbatim, so passing a
+     * raw id shows the id.
+     */
+    name: string;
+    /** Fully-qualified tool id (e.g. "Gmail.SendEmail"), surfaced in the tooltip. */
+    rawName?: string;
+    /** Optional tool version, shown muted next to the name (e.g. "1.2.4"). */
+    version?: string;
+    description?: string;
+    selected?: boolean;
+    destructive?: boolean;
+    readOnly?: boolean;
+    onToggle?: () => void;
+} & Omit<React.ComponentProps<"button">, "onClick" | "onToggle" | "name">;
+declare function McpToolCardImpl({ name, rawName, version, description, selected, destructive, readOnly, onToggle, className, ...rest }: McpToolCardProps): React.JSX.Element;
+export declare const McpToolCard: React.MemoExoticComponent<typeof McpToolCardImpl>;
+export {};
+//# sourceMappingURL=tool-card.d.ts.map

package/dist/components/ui/molecules/mcp-server-picker/tool-card.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tool-card.d.ts","sourceRoot":"","sources":["../../../../../lib/components/ui/molecules/mcp-server-picker/tool-card.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAS/B,MAAM,MAAM,gBAAgB,GAAG;IAC7B;;;;OAIG;IACH,IAAI,EAAE,MAAM,CAAC;IACb,iFAAiF;IACjF,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,0EAA0E;IAC1E,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;CACvB,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,EAAE,SAAS,GAAG,UAAU,GAAG,MAAM,CAAC,CAAC;AAE1E,iBAAS,eAAe,CAAC,EACvB,IAAI,EACJ,OAAO,EACP,OAAO,EACP,WAAW,EACX,QAAgB,EAChB,WAAmB,EACnB,QAAgB,EAChB,QAAQ,EACR,SAAS,EACT,GAAG,IAAI,EACR,EAAE,gBAAgB,qBAkFlB;AAED,eAAO,MAAM,WAAW,mDAA8B,CAAC"}

package/dist/components/ui/molecules/mcp-server-picker/tool-card.js

@@ -0,0 +1,62 @@
+"use client";
+"use client";
+import { cn as e } from "../../../../lib/utils.js";
+import { i as t, n, r, t as i } from "../../../../tooltip-34vRSwJG.js";
+import * as a from "react";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
+import { Check as c } from "lucide-react";
+//#region lib/components/ui/molecules/mcp-server-picker/tool-card.tsx
+function l({ name: a, rawName: l, version: u, description: d, selected: f = !1, destructive: p = !1, readOnly: m = !1, onToggle: h, className: g, ..._ }) {
+	let v = /* @__PURE__ */ s("button", {
+		..._,
+		"aria-pressed": f,
+		className: e("flex cursor-pointer items-start gap-2.5 rounded-lg border p-3 text-left transition-[background-color,border-color,box-shadow,transform] duration-[var(--duration-normal)] ease-[var(--ease-smooth)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring/60 active:scale-[0.98] motion-reduce:transition-colors motion-reduce:active:scale-100", f ? "border-foreground/45 bg-muted/20 shadow-[var(--shadow-card)]" : "border-border hover:border-foreground/40 hover:shadow-[var(--shadow-card-hover)]", g),
+		"data-slot": "mcp-tool-card",
+		"data-status": f ? "selected" : "none",
+		onClick: h,
+		type: "button",
+		children: [/* @__PURE__ */ o("span", {
+			"aria-hidden": !0,
+			className: e("mt-0.5 flex size-4 shrink-0 items-center justify-center rounded-[4px] border transition-colors", f ? "border-primary bg-primary text-primary-foreground" : "border-input"),
+			children: f ? /* @__PURE__ */ o(c, { className: "size-3" }) : null
+		}), /* @__PURE__ */ s("span", {
+			className: "min-w-0 flex-1",
+			children: [/* @__PURE__ */ s("span", {
+				className: "flex items-start justify-between gap-3",
+				children: [/* @__PURE__ */ s("span", {
+					className: "flex min-w-0 items-baseline gap-1.5",
+					children: [/* @__PURE__ */ o("span", {
+						className: "truncate font-medium text-sm",
+						children: a
+					}), u ? /* @__PURE__ */ s("span", {
+						className: "shrink-0 font-normal text-muted-foreground text-xs tabular-nums",
+						children: ["v", u]
+					}) : null]
+				}), /* @__PURE__ */ s("span", {
+					className: "flex shrink-0 items-center gap-1.5 self-start",
+					children: [p ? /* @__PURE__ */ o("span", {
+						className: "ds-focus-in rounded-full bg-destructive/10 px-1.5 py-0.5 font-medium text-[10px] text-destructive uppercase tracking-wide",
+						children: "Destructive"
+					}) : null, m ? /* @__PURE__ */ o("span", {
+						className: "ds-focus-in rounded-full bg-muted px-1.5 py-0.5 font-medium text-[10px] text-muted-foreground uppercase tracking-wide",
+						children: "Read-only"
+					}) : null]
+				})]
+			}), d ? /* @__PURE__ */ o("span", {
+				className: "mt-0.5 line-clamp-1 text-muted-foreground text-xs leading-snug",
+				children: d
+			}) : null]
+		})]
+	});
+	return d ? /* @__PURE__ */ o(r, { children: /* @__PURE__ */ s(i, { children: [/* @__PURE__ */ o(t, { render: v }), /* @__PURE__ */ s(n, {
+		className: "max-w-xs flex-col items-start gap-0.5 text-left text-xs",
+		side: "bottom",
+		children: [l && l !== a ? /* @__PURE__ */ o("span", {
+			className: "font-medium",
+			children: l
+		}) : null, /* @__PURE__ */ o("span", { children: d })]
+	})] }) }) : v;
+}
+var u = a.memo(l);
+//#endregion
+export { u as McpToolCard };

package/dist/components/ui/molecules/mcp-server-picker/tool-search-band.d.ts

@@ -0,0 +1,8 @@
+import type * as React from "react";
+export type McpToolSearchState = "on" | "off";
+export type McpToolSearchBandProps = {
+    state: McpToolSearchState;
+    onToggle?: (checked: boolean) => void;
+} & Omit<React.ComponentProps<"div">, "children" | "onToggle">;
+export declare function McpToolSearchBand({ state, onToggle, className, ...rest }: McpToolSearchBandProps): React.JSX.Element;
+//# sourceMappingURL=tool-search-band.d.ts.map

package/dist/components/ui/molecules/mcp-server-picker/tool-search-band.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tool-search-band.d.ts","sourceRoot":"","sources":["../../../../../lib/components/ui/molecules/mcp-server-picker/tool-search-band.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAIpC,MAAM,MAAM,kBAAkB,GAAG,IAAI,GAAG,KAAK,CAAC;AAE9C,MAAM,MAAM,sBAAsB,GAAG;IACnC,KAAK,EAAE,kBAAkB,CAAC;IAC1B,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;CACvC,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,UAAU,GAAG,UAAU,CAAC,CAAC;AAE/D,wBAAgB,iBAAiB,CAAC,EAChC,KAAK,EACL,QAAQ,EACR,SAAS,EACT,GAAG,IAAI,EACR,EAAE,sBAAsB,qBAmCxB"}

package/dist/components/ui/molecules/mcp-server-picker/tool-search-band.js

@@ -0,0 +1,41 @@
+"use client";
+"use client";
+import { cn as e } from "../../../../lib/utils.js";
+import { t } from "../../../../switch-CP9j-8px.js";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+//#region lib/components/ui/molecules/mcp-server-picker/tool-search-band.tsx
+function i({ state: i, onToggle: a, className: o, ...s }) {
+	let c = i === "on";
+	return /* @__PURE__ */ n("div", {
+		...s,
+		className: e("rounded-lg border border-border/60 bg-muted/25 px-3.5 py-3", o),
+		"data-slot": "mcp-tool-search-band",
+		"data-status": i,
+		children: /* @__PURE__ */ r("div", {
+			className: "flex items-center justify-between gap-4",
+			children: [/* @__PURE__ */ r("div", {
+				className: "min-w-0",
+				children: [/* @__PURE__ */ n("p", {
+					className: "font-semibold text-[15px] text-foreground leading-snug",
+					children: "Personalized Tool Search"
+				}), /* @__PURE__ */ n("p", {
+					className: "mt-1.5 text-[13px] text-muted-foreground leading-snug",
+					children: "Your agent fetches only the tools relevant to each task, saving tokens and keeping responses focused."
+				})]
+			}), /* @__PURE__ */ r("div", {
+				className: "flex shrink-0 items-center gap-2 text-muted-foreground text-sm",
+				children: [/* @__PURE__ */ n("span", {
+					className: "tabular-nums",
+					children: c ? "On" : "Off"
+				}), /* @__PURE__ */ n(t, {
+					"aria-label": `Personalized Tool Search ${c ? "on" : "off"}`,
+					checked: c,
+					onCheckedChange: a,
+					size: "default"
+				})]
+			})]
+		})
+	});
+}
+//#endregion
+export { i as McpToolSearchBand };

package/dist/components/ui/molecules/mcp-server-picker/toolkit-avatar.d.ts

@@ -0,0 +1,16 @@
+import { VariantProps } from 'class-variance-authority';
+import { ClassProp } from 'class-variance-authority/types';
+import * as React from "react";
+declare const avatarVariants: (props?: ({
+    size?: "xs" | "sm" | "lg" | "md" | null | undefined;
+} & ClassProp) | undefined) => string;
+export type McpToolkitAvatarProps = {
+    /** Toolkit display name — used for the letter fallback. */
+    name: string;
+    /** Toolkit ID — used to look up the brand icon. Omit to force fallback. */
+    toolkitId?: string;
+} & VariantProps<typeof avatarVariants> & Omit<React.ComponentProps<"span">, "children">;
+declare function McpToolkitAvatarImpl({ name, toolkitId, size, className, ...rest }: McpToolkitAvatarProps): React.JSX.Element;
+export declare const McpToolkitAvatar: React.MemoExoticComponent<typeof McpToolkitAvatarImpl>;
+export { avatarVariants as mcpToolkitAvatarVariants };
+//# sourceMappingURL=toolkit-avatar.d.ts.map

package/dist/components/ui/molecules/mcp-server-picker/toolkit-avatar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"toolkit-avatar.d.ts","sourceRoot":"","sources":["../../../../../lib/components/ui/molecules/mcp-server-picker/toolkit-avatar.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AA4B/B,QAAA,MAAM,cAAc;;8EAenB,CAAC;AASF,MAAM,MAAM,qBAAqB,GAAG;IAClC,2DAA2D;IAC3D,IAAI,EAAE,MAAM,CAAC;IACb,2EAA2E;IAC3E,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GAAG,YAAY,CAAC,OAAO,cAAc,CAAC,GACrC,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,EAAE,UAAU,CAAC,CAAC;AAEjD,iBAAS,oBAAoB,CAAC,EAC5B,IAAI,EACJ,SAAS,EACT,IAAW,EACX,SAAS,EACT,GAAG,IAAI,EACR,EAAE,qBAAqB,qBAsCvB;AAED,eAAO,MAAM,gBAAgB,wDAAmC,CAAC;AACjE,OAAO,EAAE,cAAc,IAAI,wBAAwB,EAAE,CAAC"}

package/dist/components/ui/molecules/mcp-server-picker/toolkit-avatar.js

@@ -0,0 +1,56 @@
+"use client";
+"use client";
+import { cn as e } from "../../../../lib/utils.js";
+import { t } from "../../../../dist-Ber_p4PA.js";
+import { resolveToolkitIcon as n } from "../../../../metadata/toolkit-icons.js";
+import * as r from "react";
+import { jsx as i } from "react/jsx-runtime";
+//#region lib/components/ui/molecules/mcp-server-picker/toolkit-avatar.tsx
+var a = [
+	"text-brand-text",
+	"text-brand-fuchsia",
+	"text-brand-red",
+	"text-brand-purple",
+	"text-brand-navy",
+	"text-brand-green"
+];
+function o(e) {
+	let t = 0;
+	for (let n of e) t = (t * 31 + n.charCodeAt(0)) % 1000003;
+	return a[t % a.length] ?? a[0];
+}
+var s = t("inline-flex shrink-0 items-center justify-center font-semibold uppercase", {
+	variants: { size: {
+		xs: "size-4 rounded-sm text-[10px]",
+		sm: "size-5 rounded-sm text-[10px]",
+		md: "size-7 rounded-md text-xs",
+		lg: "size-9 rounded-md text-sm"
+	} },
+	defaultVariants: { size: "md" }
+}), c = {
+	xs: "size-3",
+	sm: "size-3.5",
+	md: "size-4",
+	lg: "size-5"
+};
+function l({ name: t, toolkitId: r, size: a = "md", className: l, ...u }) {
+	let { Icon: d, hasBrandIcon: f } = n(r), p = a ?? "md";
+	return f ? /* @__PURE__ */ i("span", {
+		...u,
+		"aria-hidden": !0,
+		className: e(s({ size: p }), "bg-muted/40", l),
+		"data-slot": "mcp-toolkit-avatar",
+		"data-variant": "brand",
+		children: /* @__PURE__ */ i(d, { className: c[p] })
+	}) : /* @__PURE__ */ i("span", {
+		...u,
+		"aria-hidden": !0,
+		className: e(s({ size: p }), "bg-muted/40", o(t), l),
+		"data-slot": "mcp-toolkit-avatar",
+		"data-variant": "fallback",
+		children: t.charAt(0)
+	});
+}
+var u = r.memo(l);
+//#endregion
+export { u as McpToolkitAvatar, s as mcpToolkitAvatarVariants };

package/dist/components/ui/molecules/mcp-server-picker/toolkit-chip.d.ts

@@ -0,0 +1,38 @@
+import type * as React from "react";
+export type McpToolkitChipProps = {
+    /** Toolkit display name — rendered with `capitalize` styling. */
+    name: string;
+    /** Branded-icon lookup key passed through to `McpToolkitAvatar`. */
+    toolkitId?: string;
+    /**
+     * Total tools the toolkit exposes. Only rendered when `isPartial`, paired
+     * with `selectedCount` to show the partial fraction.
+     */
+    total?: number;
+    /** Selected tools from this toolkit. */
+    selectedCount?: number;
+    /**
+     * The toolkit was added beyond the recommended set. Surfaced in the
+     * aggregate "+N added" count rather than per-chip; here it only sets
+     * `data-status`.
+     */
+    added?: boolean;
+    /**
+     * Some, but not all, tools selected — surfaces the `N/M` fraction and
+     * sharpens the remove label so screen-reader users know how many tools
+     * the action will drop.
+     */
+    isPartial?: boolean;
+    /** Open this toolkit's tools to adjust the selection. */
+    onOpen?: () => void;
+    /** Remove the toolkit (and all of its selected tools). */
+    onRemove?: () => void;
+} & Omit<React.ComponentProps<"div">, "children">;
+/**
+ * Removable toolkit chip with two affordances: the body opens that server's
+ * tools (to adjust the selection); the trailing × removes it. Built on
+ * `RemovableChip`, which owns the shared shell, divider, and remove button.
+ * Used inside the picker's selection summary bar.
+ */
+export declare function McpToolkitChip({ name, toolkitId, total, selectedCount, added, isPartial, onOpen, onRemove, ...rest }: McpToolkitChipProps): React.JSX.Element;
+//# sourceMappingURL=toolkit-chip.d.ts.map

package/dist/components/ui/molecules/mcp-server-picker/toolkit-chip.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"toolkit-chip.d.ts","sourceRoot":"","sources":["../../../../../lib/components/ui/molecules/mcp-server-picker/toolkit-chip.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAOpC,MAAM,MAAM,mBAAmB,GAAG;IAChC,iEAAiE;IACjE,IAAI,EAAE,MAAM,CAAC;IACb,oEAAoE;IACpE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,wCAAwC;IACxC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,yDAAyD;IACzD,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;CACvB,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC,CAAC;AAElD;;;;;GAKG;AACH,wBAAgB,cAAc,CAAC,EAC7B,IAAI,EACJ,SAAS,EACT,KAAK,EACL,aAAa,EACb,KAAa,EACb,SAAiB,EACjB,MAAM,EACN,QAAQ,EACR,GAAG,IAAI,EACR,EAAE,mBAAmB,qBAoCrB"}

package/dist/components/ui/molecules/mcp-server-picker/toolkit-chip.js

@@ -0,0 +1,42 @@
+"use client";
+"use client";
+import { RemovableChip as e, RemovableChipButton as t } from "../../atoms/removable-chip.js";
+import { McpToolkitAvatar as n } from "./toolkit-avatar.js";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+//#region lib/components/ui/molecules/mcp-server-picker/toolkit-chip.tsx
+function a({ name: a, toolkitId: o, total: s, selectedCount: c, added: l = !1, isPartial: u = !1, onOpen: d, onRemove: f, ...p }) {
+	let m = u && c != null ? `Remove all ${c} selected ${a} tools` : `Remove ${a}`, h = `Open ${a} tools`, g = "selected";
+	return l ? g = "added" : u && (g = "partial"), /* @__PURE__ */ r(e, {
+		...p,
+		"data-slot": "mcp-toolkit-chip",
+		"data-status": g,
+		onRemove: f,
+		removeLabel: m,
+		children: /* @__PURE__ */ i(t, {
+			"aria-label": h,
+			onClick: d,
+			title: h,
+			children: [
+				/* @__PURE__ */ r(n, {
+					name: a,
+					size: "sm",
+					toolkitId: o
+				}),
+				/* @__PURE__ */ r("span", {
+					className: "max-w-44 truncate font-medium capitalize",
+					children: a
+				}),
+				u && c != null && s != null ? /* @__PURE__ */ i("span", {
+					className: "shrink-0 text-[10px] text-muted-foreground tabular-nums",
+					children: [
+						c,
+						"/",
+						s
+					]
+				}) : null
+			]
+		})
+	});
+}
+//#endregion
+export { a as McpToolkitChip };

package/dist/components/ui/molecules/mcp-server-picker/toolkit-group-header.d.ts

@@ -0,0 +1,33 @@
+import { McpToolkitAvatarProps } from './toolkit-avatar';
+import type * as React from "react";
+export type McpToolkitGroupHeaderProps = {
+    /** Toolkit display name — rendered with `capitalize` styling. */
+    name: string;
+    /** Branded-icon lookup key passed through to `McpToolkitAvatar`. */
+    toolkitId?: string;
+    /** Avatar size. Defaults to `"sm"` to match in-line section headers. */
+    avatarSize?: McpToolkitAvatarProps["size"];
+    /**
+     * Heading element used for the name. Choose based on document outline —
+     * default `h4` fits inside a section nested under the picker's `h3`.
+     */
+    headingAs?: "h2" | "h3" | "h4" | "h5";
+    /**
+     * Right-of-name count line — typically "N selected" or just a raw tool
+     * count. Wrap free-form text in a `<span>` for consistent styling.
+     */
+    count?: React.ReactNode;
+    /**
+     * Optional trailing slot rendered after the count (e.g. an inline "Add N
+     * more" expander button).
+     */
+    trailing?: React.ReactNode;
+} & Omit<React.ComponentProps<"div">, "children">;
+/**
+ * Section header for a toolkit group: branded avatar, name, count, and an
+ * optional trailing slot for inline actions. Used at the top of every
+ * "tools grouped under their server" list — search results, the drill-in
+ * view's identity strip, and the grouped selection review.
+ */
+export declare function McpToolkitGroupHeader({ name, toolkitId, avatarSize, headingAs: Heading, count, trailing, className, ...rest }: McpToolkitGroupHeaderProps): React.JSX.Element;
+//# sourceMappingURL=toolkit-group-header.d.ts.map

package/dist/components/ui/molecules/mcp-server-picker/toolkit-group-header.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"toolkit-group-header.d.ts","sourceRoot":"","sources":["../../../../../lib/components/ui/molecules/mcp-server-picker/toolkit-group-header.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAEpC,OAAO,EAAoB,KAAK,qBAAqB,EAAE,MAAM,kBAAkB,CAAC;AAEhF,MAAM,MAAM,0BAA0B,GAAG;IACvC,iEAAiE;IACjE,IAAI,EAAE,MAAM,CAAC;IACb,oEAAoE;IACpE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,wEAAwE;IACxE,UAAU,CAAC,EAAE,qBAAqB,CAAC,MAAM,CAAC,CAAC;IAC3C;;;OAGG;IACH,SAAS,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IACtC;;;OAGG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB;;;OAGG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC,CAAC;AAElD;;;;;GAKG;AACH,wBAAgB,qBAAqB,CAAC,EACpC,IAAI,EACJ,SAAS,EACT,UAAiB,EACjB,SAAS,EAAE,OAAc,EACzB,KAAK,EACL,QAAQ,EACR,SAAS,EACT,GAAG,IAAI,EACR,EAAE,0BAA0B,qBAwB5B"}

package/dist/components/ui/molecules/mcp-server-picker/toolkit-group-header.js

@@ -0,0 +1,36 @@
+"use client";
+"use client";
+import { cn as e } from "../../../../lib/utils.js";
+import { McpToolkitAvatar as t } from "./toolkit-avatar.js";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+//#region lib/components/ui/molecules/mcp-server-picker/toolkit-group-header.tsx
+function i({ name: i, toolkitId: a, avatarSize: o = "sm", headingAs: s = "h4", count: c, trailing: l, className: u, ...d }) {
+	return /* @__PURE__ */ r("div", {
+		...d,
+		className: e("flex flex-wrap items-center justify-between gap-x-3 gap-y-1", u),
+		"data-slot": "mcp-toolkit-group-header",
+		children: [/* @__PURE__ */ r("div", {
+			className: "flex min-w-0 items-center gap-2",
+			children: [
+				/* @__PURE__ */ n(t, {
+					name: i,
+					size: o,
+					toolkitId: a
+				}),
+				/* @__PURE__ */ n(s, {
+					className: "truncate font-semibold text-base capitalize",
+					children: i
+				}),
+				c === void 0 ? null : /* @__PURE__ */ n("span", {
+					className: "shrink-0 text-muted-foreground text-xs tabular-nums",
+					children: c
+				})
+			]
+		}), l ? /* @__PURE__ */ n("div", {
+			className: "flex items-center",
+			children: l
+		}) : null]
+	});
+}
+//#endregion
+export { i as McpToolkitGroupHeader };

package/dist/components/ui/molecules/mcp-server-picker/unoptimized-callout.d.ts

@@ -0,0 +1,10 @@
+import type * as React from "react";
+export type McpUnoptimizedCalloutProps = Omit<React.ComponentProps<"div">, "children">;
+/**
+ * Inline explainer shown when the Unoptimized filter is active — the canonical
+ * copy for what "unoptimized" means, rendered with the shared flat
+ * `McpSectionCallout` layout (no card chrome, just a title and a short
+ * description above the results).
+ */
+export declare function McpUnoptimizedCallout(props: McpUnoptimizedCalloutProps): React.JSX.Element;
+//# sourceMappingURL=unoptimized-callout.d.ts.map

package/dist/components/ui/molecules/mcp-server-picker/unoptimized-callout.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"unoptimized-callout.d.ts","sourceRoot":"","sources":["../../../../../lib/components/ui/molecules/mcp-server-picker/unoptimized-callout.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAGpC,MAAM,MAAM,0BAA0B,GAAG,IAAI,CAC3C,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,EAC3B,UAAU,CACX,CAAC;AAEF;;;;;GAKG;AACH,wBAAgB,qBAAqB,CAAC,KAAK,EAAE,0BAA0B,qBAStE"}

package/dist/components/ui/molecules/mcp-server-picker/unoptimized-callout.js

@@ -0,0 +1,15 @@
+"use client";
+"use client";
+import { McpSectionCallout as e } from "./section-callout.js";
+import { jsx as t } from "react/jsx-runtime";
+//#region lib/components/ui/molecules/mcp-server-picker/unoptimized-callout.tsx
+function n(n) {
+	return /* @__PURE__ */ t(e, {
+		...n,
+		"data-slot": "mcp-unoptimized-callout",
+		description: "Tools built around individual actions rather than full tasks. Useful when you need something specific, but your agent often has to combine a few to complete a task.",
+		title: "Unoptimized MCP servers"
+	});
+}
+//#endregion
+export { n as McpUnoptimizedCallout };

package/dist/components/ui/molecules/scroll-fade-area.d.ts

@@ -0,0 +1,26 @@
+import { ReactNode } from 'react';
+export type ScrollFadeAreaProps = {
+    children: ReactNode;
+    /** Classes for the outer sizing context. Defaults fill a flex column. */
+    className?: string;
+    /** Classes for the inner scroll viewport (padding, child spacing). */
+    viewportClassName?: string;
+};
+/**
+ * Vertical scroll area with "there's more" affordances on whichever edge still
+ * has hidden content: a fade-to-background gradient plus a soft inset shadow.
+ * Both appear per edge and only when that edge can actually scroll.
+ *
+ * This draws gradient overlays from `useScrollFade`'s `edges` rather than
+ * spreading the hook's `maskImage` style. A mask fades content to fully
+ * transparent, which reads too strongly in dark mode; gradient overlays fade to
+ * the surface color and let us dial the intensity per theme (see the
+ * `dark:from-background/40` stops below). Horizontal scrollers that want the
+ * lighter mask treatment should consume `useScrollFade("x").style` directly.
+ *
+ * The overlays fade to the `background` token, so place this on a
+ * background-colored surface; on a `card`/`muted` surface the gradient seams.
+ * Such callers want the mask treatment instead.
+ */
+export declare function ScrollFadeArea({ children, className, viewportClassName, }: ScrollFadeAreaProps): import("react").JSX.Element;
+//# sourceMappingURL=scroll-fade-area.d.ts.map

package/dist/components/ui/molecules/scroll-fade-area.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"scroll-fade-area.d.ts","sourceRoot":"","sources":["../../../../lib/components/ui/molecules/scroll-fade-area.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIvC,MAAM,MAAM,mBAAmB,GAAG;IAChC,QAAQ,EAAE,SAAS,CAAC;IACpB,yEAAyE;IACzE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,sEAAsE;IACtE,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B,CAAC;AAEF;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,cAAc,CAAC,EAC7B,QAAQ,EACR,SAAS,EACT,iBAAiB,GAClB,EAAE,mBAAmB,+BAiCrB"}

package/dist/components/ui/molecules/scroll-fade-area.js

@@ -0,0 +1,25 @@
+"use client";
+"use client";
+import { cn as e } from "../../../lib/utils.js";
+import { useScrollFade as t } from "../../../hooks/use-scroll-fade.js";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+//#region lib/components/ui/molecules/scroll-fade-area.tsx
+function i({ children: i, className: a, viewportClassName: o }) {
+	let s = t("y"), c = [s.edges.start && "inset 0 8px 12px -10px color-mix(in oklch, var(--shadow-color) 3%, transparent)", s.edges.end && "inset 0 -12px 16px -10px color-mix(in oklch, var(--shadow-color) 6%, transparent)"].filter(Boolean).join(", ") || void 0;
+	return /* @__PURE__ */ r("div", {
+		className: e("relative min-h-0 flex-1", a),
+		children: [
+			s.edges.start ? /* @__PURE__ */ n("div", { className: "pointer-events-none absolute inset-x-0 top-0 z-10 h-8 bg-gradient-to-b from-background to-transparent dark:from-background/40" }) : null,
+			s.edges.end ? /* @__PURE__ */ n("div", { className: "pointer-events-none absolute inset-x-0 bottom-0 z-10 h-10 bg-gradient-to-t from-background to-transparent dark:from-background/40" }) : null,
+			/* @__PURE__ */ n("div", {
+				className: e("h-full overflow-y-auto transition-shadow duration-200", o),
+				onScroll: s.onScroll,
+				ref: s.ref,
+				style: { boxShadow: c },
+				children: i
+			})
+		]
+	});
+}
+//#endregion
+export { i as ScrollFadeArea };

package/dist/components/ui/molecules/user-nav.js

@@ -1,7 +1,7 @@
 import { cn as e } from "../../../lib/utils.js";
 import { t } from "../../../button-BNOmhdpM.js";
 import { o as n, r, t as i } from "../../../avatar-BSYWkGGc.js";
-import { h as a, o, r as s, t as c, u as l } from "../../../dropdown-menu-DCFuLDwH.js";
+import { h as a, o, r as s, t as c, u as l } from "../../../dropdown-menu-dsg43mOw.js";
 import { Fragment as u, jsx as d, jsxs as f } from "react/jsx-runtime";
 import { ChevronsUpDownIcon as p } from "lucide-react";
 //#region lib/components/ui/molecules/user-nav.tsx

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

@@ -0,0 +1,5 @@
+/** biome-ignore-all lint/performance/noBarrelFile: Barrel files are acceptable for atomic component folders */
+export type { McpSelectionSummaryBarProps, McpSelectionSummaryMcpServer, } from './mcp-selection-summary-bar';
+export { McpSelectionSummaryBar } from './mcp-selection-summary-bar';
+export { McpServerPicker, McpServerPickerGrid, McpServerPickerHeader, McpServerPickerToolGrid, } from './mcp-server-picker';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../lib/components/ui/organisms/index.ts"],"names":[],"mappings":"AAAA,+GAA+G;AAE/G,YAAY,EACV,2BAA2B,EAC3B,4BAA4B,GAC7B,MAAM,6BAA6B,CAAC;AACrC,OAAO,EAAE,sBAAsB,EAAE,MAAM,6BAA6B,CAAC;AACrE,OAAO,EACL,eAAe,EACf,mBAAmB,EACnB,qBAAqB,EACrB,uBAAuB,GACxB,MAAM,qBAAqB,CAAC"}

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

@@ -0,0 +1,3 @@
+import { McpSelectionSummaryBar as e } from "./mcp-selection-summary-bar.js";
+import { McpServerPicker as t, McpServerPickerGrid as n, McpServerPickerHeader as r, McpServerPickerToolGrid as i } from "./mcp-server-picker.js";
+export { e as McpSelectionSummaryBar, t as McpServerPicker, n as McpServerPickerGrid, r as McpServerPickerHeader, i as McpServerPickerToolGrid };

package/dist/components/ui/organisms/mcp-selection-summary-bar.d.ts

@@ -0,0 +1,71 @@
+import { McpRecommendedMcpServer } from '../molecules/mcp-server-picker/recommended-toolkits-chip';
+import { McpReviewCountChipProps } from '../molecules/mcp-server-picker/review-count-chip';
+import { McpToolkitChipProps } from '../molecules/mcp-server-picker/toolkit-chip';
+import type * as React from "react";
+export type McpSelectionSummaryMcpServer = {
+    /** Stable React key — typically the MCP server name or id. */
+    id: string;
+} & Omit<McpToolkitChipProps, "onOpen" | "onRemove">;
+export type McpSelectionSummaryBarProps = {
+    /**
+     * Selected MCP servers, in display order. An empty array renders the idle
+     * placeholder; the bar keeps its height so the surrounding layout doesn't
+     * shift on first selection.
+     *
+     * Servers in `recommendedMcpServers` are NOT also included here — the
+     * consumer separates the two lists so this bar always renders the
+     * grouped recommended chip first, with the rest of the per-server chips
+     * trailing.
+     */
+    mcpServers: McpSelectionSummaryMcpServer[];
+    /**
+     * Recommended MCP servers collapsed into a single grouped chip. When this
+     * array is non-empty the bar renders one "Recommended tools" chip in
+     * front of the per-server chips; the chip's popover lists every entry.
+     */
+    recommendedMcpServers?: McpRecommendedMcpServer[];
+    /**
+     * Total selected tools across all MCP servers. Drives the count chip's
+     * primary number.
+     */
+    toolCount: number;
+    /**
+     * Whether the grouped review is currently open — flips the count chip to
+     * its pressed state so the user can see where the click landed.
+     */
+    reviewing?: boolean;
+    /**
+     * Whether the grouped review is currently filtered to recommended servers —
+     * flips the recommended chip into its active ring state.
+     */
+    reviewingRecommended?: boolean;
+    /** Custom aria-label for the count chip. */
+    reviewLabel?: McpReviewCountChipProps["aria-label"];
+    /** Open the grouped selected-tools view. */
+    onReview?: () => void;
+    /** Open the grouped review scoped to the recommended set. */
+    onReviewRecommended?: () => void;
+    /** Open this MCP server's tools to adjust selection. */
+    onOpenMcpServer?: (id: string) => void;
+    /** Remove this MCP server (and all of its selected tools). */
+    onRemoveMcpServer?: (id: string) => void;
+    /** Remove the entire recommended set in one go. */
+    onRemoveRecommended?: () => void;
+    /** Clear the entire selection. */
+    onClear?: () => void;
+    /** Copy override for the empty / no-selection-yet placeholder. */
+    emptyMessage?: string;
+} & Omit<React.ComponentProps<"div">, "children" | "onReview">;
+/**
+ * Persistent selection summary used inside the MCP picker shell: the total
+ * tool count (clickable — opens the grouped selected-tools view), the
+ * grouped recommended chip (if any), one removable chip per other selected
+ * MCP server, and a clear-all on the right. Sits above the results so the
+ * selection is obvious at a glance and easy to prune.
+ *
+ * Pure presentational — the consumer supplies the ordered server list and
+ * the callbacks. Domain-specific ordering (e.g. "newest-selected first")
+ * belongs in the consumer.
+ */
+export declare function McpSelectionSummaryBar({ mcpServers, recommendedMcpServers, toolCount, reviewing, reviewingRecommended, reviewLabel, onReview, onReviewRecommended, onOpenMcpServer, onRemoveMcpServer, onRemoveRecommended, onClear, emptyMessage, className, ...rest }: McpSelectionSummaryBarProps): React.JSX.Element;
+//# sourceMappingURL=mcp-selection-summary-bar.d.ts.map

package/dist/components/ui/organisms/mcp-selection-summary-bar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"mcp-selection-summary-bar.d.ts","sourceRoot":"","sources":["../../../../lib/components/ui/organisms/mcp-selection-summary-bar.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAEpC,OAAO,EACL,KAAK,uBAAuB,EAE7B,MAAM,uEAAuE,CAAC;AAC/E,OAAO,EAEL,KAAK,uBAAuB,EAC7B,MAAM,+DAA+D,CAAC;AACvE,OAAO,EAEL,KAAK,mBAAmB,EACzB,MAAM,0DAA0D,CAAC;AAIlE,MAAM,MAAM,4BAA4B,GAAG;IACzC,8DAA8D;IAC9D,EAAE,EAAE,MAAM,CAAC;CACZ,GAAG,IAAI,CAAC,mBAAmB,EAAE,QAAQ,GAAG,UAAU,CAAC,CAAC;AAErD,MAAM,MAAM,2BAA2B,GAAG;IACxC;;;;;;;;;OASG;IACH,UAAU,EAAE,4BAA4B,EAAE,CAAC;IAC3C;;;;OAIG;IACH,qBAAqB,CAAC,EAAE,uBAAuB,EAAE,CAAC;IAClD;;;OAGG;IACH,SAAS,EAAE,MAAM,CAAC;IAClB;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;OAGG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,4CAA4C;IAC5C,WAAW,CAAC,EAAE,uBAAuB,CAAC,YAAY,CAAC,CAAC;IACpD,4CAA4C;IAC5C,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,6DAA6D;IAC7D,mBAAmB,CAAC,EAAE,MAAM,IAAI,CAAC;IACjC,wDAAwD;IACxD,eAAe,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,8DAA8D;IAC9D,iBAAiB,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,mDAAmD;IACnD,mBAAmB,CAAC,EAAE,MAAM,IAAI,CAAC;IACjC,kCAAkC;IAClC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,kEAAkE;IAClE,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,UAAU,GAAG,UAAU,CAAC,CAAC;AAE/D;;;;;;;;;;GAUG;AACH,wBAAgB,sBAAsB,CAAC,EACrC,UAAU,EACV,qBAA0B,EAC1B,SAAS,EACT,SAAiB,EACjB,oBAA4B,EAC5B,WAAW,EACX,QAAQ,EACR,mBAAmB,EACnB,eAAe,EACf,iBAAiB,EACjB,mBAAmB,EACnB,OAAO,EACP,YAAsC,EACtC,SAAS,EACT,GAAG,IAAI,EACR,EAAE,2BAA2B,qBA2E7B"}