@mcp-b/react-components 0.16.1 → 0.18.0

package/dist/components/Accordion.js

@@ -1,3 +1,4 @@
+import { n as mergeBaseClassName } from "../class-names-BiMDVpUo.js";
 import "react";
 import { Accordion as Accordion$1 } from "@base-ui/react/accordion";
 import { jsx } from "react/jsx-runtime";
@@ -21,10 +22,11 @@ import { jsx } from "react/jsx-runtime";
 *
 * @see {@link https://base-ui.com/react/components/accordion | Base UI Accordion}
 */
-function AccordionRoot({ className = "", ref, ...props }) {
-	const classes = ["accordion", className].filter(Boolean).join(" ");
+function AccordionRoot({ className, ref, ...props }) {
+	const classes = mergeBaseClassName(["accordion"].filter(Boolean).join(" "), className);
 	return /* @__PURE__ */ jsx(Accordion$1.Root, {
 		ref,
+		"data-slot": "accordion",
 		className: classes,
 		...props
 	});
@@ -32,18 +34,20 @@ function AccordionRoot({ className = "", ref, ...props }) {
 /**
 * A single item within an Accordion.
 */
-function AccordionItem({ className = "", ref, ...props }) {
-	const classes = ["accordion__item", className].filter(Boolean).join(" ");
+function AccordionItem({ className, ref, ...props }) {
+	const classes = mergeBaseClassName(["accordion__item"].filter(Boolean).join(" "), className);
 	return /* @__PURE__ */ jsx(Accordion$1.Item, {
 		ref,
+		"data-slot": "accordion-item",
 		className: classes,
 		...props
 	});
 }
-function AccordionHeader({ className = "", ref, ...props }) {
-	const classes = ["accordion__header", className].filter(Boolean).join(" ");
+function AccordionHeader({ className, ref, ...props }) {
+	const classes = mergeBaseClassName(["accordion__header"].filter(Boolean).join(" "), className);
 	return /* @__PURE__ */ jsx(Accordion$1.Header, {
 		ref,
+		"data-slot": "accordion-header",
 		className: classes,
 		...props
 	});
@@ -54,10 +58,11 @@ function AccordionHeader({ className = "", ref, ...props }) {
 /**
 * The clickable trigger button within an AccordionItem.
 */
-function AccordionTrigger({ className = "", ref, ...props }) {
-	const classes = ["accordion__trigger", className].filter(Boolean).join(" ");
+function AccordionTrigger({ className, ref, ...props }) {
+	const classes = mergeBaseClassName(["accordion__trigger"].filter(Boolean).join(" "), className);
 	return /* @__PURE__ */ jsx(Accordion$1.Trigger, {
 		ref,
+		"data-slot": "accordion-trigger",
 		className: classes,
 		...props
 	});
@@ -65,10 +70,11 @@ function AccordionTrigger({ className = "", ref, ...props }) {
 /**
 * The collapsible content panel of an AccordionItem.
 */
-function AccordionPanel({ className = "", ref, ...props }) {
-	const classes = ["accordion__panel", className].filter(Boolean).join(" ");
+function AccordionPanel({ className, ref, ...props }) {
+	const classes = mergeBaseClassName("base-ui-disclosure-panel accordion__panel", className);
 	return /* @__PURE__ */ jsx(Accordion$1.Panel, {
 		ref,
+		"data-slot": "accordion-panel",
 		className: classes,
 		...props
 	});

package/dist/components/Activity.d.ts

@@ -1,9 +1,8 @@
-import { Collapsible } from "./Collapsible.js";
+import { t as Collapsible } from "../Collapsible-N64ASIQr.js";
 import * as React from "react";
 
 //#region src/components/Activity.d.ts
-interface ActivityProps extends Omit<React.ComponentProps<typeof Collapsible.Root>, "className" | "unstyled"> {
-  className?: string;
+interface ActivityProps extends Omit<React.ComponentProps<typeof Collapsible.Root>, "unstyled"> {
   /** While true, the trigger label shimmers. */
   isStreaming?: boolean;
 }
@@ -36,8 +35,7 @@ declare function Activity({
 }: ActivityProps & {
   ref?: React.Ref<HTMLDivElement>;
 }): React.JSX.Element;
-interface ActivityTriggerProps extends Omit<React.ComponentProps<typeof Collapsible.Trigger>, "className" | "unstyled"> {
-  className?: string;
+interface ActivityTriggerProps extends Omit<React.ComponentProps<typeof Collapsible.Trigger>, "unstyled"> {
   /** Header text. Defaults to "Working…". */
   label?: React.ReactNode;
   /** Optional leading icon for the header. */
@@ -83,9 +81,7 @@ declare function ActivityTrigger({
 }: ActivityTriggerProps & {
   ref?: React.Ref<HTMLButtonElement>;
 }): React.JSX.Element;
-interface ActivityContentProps extends Omit<React.ComponentProps<typeof Collapsible.Panel>, "className" | "unstyled"> {
-  className?: string;
-}
+interface ActivityContentProps extends Omit<React.ComponentProps<typeof Collapsible.Panel>, "unstyled"> {}
 /** The collapsible log of ActivityItem children. */
 declare function ActivityContent({
   className,
@@ -95,8 +91,7 @@ declare function ActivityContent({
 }: ActivityContentProps & {
   ref?: React.Ref<HTMLDivElement>;
 }): React.JSX.Element;
-interface ActivityItemGroupProps extends Omit<React.ComponentProps<typeof Collapsible.Root>, "className" | "unstyled"> {
-  className?: string;
+interface ActivityItemGroupProps extends Omit<React.ComponentProps<typeof Collapsible.Root>, "unstyled"> {
   /** The row text, e.g. "Ran bash · vp test". */
   label: React.ReactNode;
   /** Optional leading icon for the row. */

package/dist/components/Activity.js

@@ -1,6 +1,6 @@
+import { t as cx } from "../class-names-BiMDVpUo.js";
 import { Collapsible } from "./Collapsible.js";
-import { t as cx } from "../class-names-9UtZwb0J.js";
-import { l as ChevronRightIcon } from "../icons-CpfUer49.js";
+import { f as ChevronRightIcon } from "../icons-CQJ-aMnI.js";
 import "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/Activity.tsx

package/dist/components/AgentActivity.d.ts

@@ -1,2 +1,2 @@
-import { a as AgentActivityIconProps, i as AgentActivityIconKind, n as AgentActivityFaviconProps, o as AgentActivityMode, r as AgentActivityIcon, s as AgentActivitySummary, t as AgentActivityFavicon } from "../AgentActivity-BNUNrP9O.js";
+import { a as AgentActivityIconProps, i as AgentActivityIconKind, n as AgentActivityFaviconProps, o as AgentActivityMode, r as AgentActivityIcon, s as AgentActivitySummary, t as AgentActivityFavicon } from "../AgentActivity-D2SHSGFX.js";
 export { AgentActivityFavicon, AgentActivityFaviconProps, AgentActivityIcon, AgentActivityIconKind, AgentActivityIconProps, AgentActivityMode, AgentActivitySummary };

package/dist/components/AgentActivity.js

@@ -1,4 +1,4 @@
-import { C as LinkIcon, G as TerminalIcon, J as WrenchIcon, N as PencilIcon, R as SearchIcon, S as InfoIcon, k as MonitorIcon, q as WarningIcon, v as FileIcon } from "../icons-CpfUer49.js";
+import { D as LinkIcon, E as InfoIcon, N as MonitorIcon, Q as WrenchIcon, R as PencilIcon, U as SearchIcon, Y as TerminalIcon, Z as WarningIcon, x as FileIcon } from "../icons-CQJ-aMnI.js";
 import * as React from "react";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/AgentActivity.tsx
@@ -19,9 +19,8 @@ function AgentActivityIcon({ kind }) {
 /** Site favicon for URL-backed activity, with the shared icon vocabulary as fallback. */
 function AgentActivityFavicon({ fallbackKind = "web", url }) {
 	const src = faviconHref(url);
-	const [failed, setFailed] = React.useState(false);
-	React.useEffect(() => setFailed(false), [src]);
-	if (!src || failed) return /* @__PURE__ */ jsx(AgentActivityIcon, { kind: fallbackKind });
+	const [failedSrc, setFailedSrc] = React.useState(null);
+	if (!src || failedSrc === src) return /* @__PURE__ */ jsx(AgentActivityIcon, { kind: fallbackKind });
 	return /* @__PURE__ */ jsx("img", {
 		className: "activity__favicon",
 		src,
@@ -29,7 +28,7 @@ function AgentActivityFavicon({ fallbackKind = "web", url }) {
 		loading: "lazy",
 		decoding: "async",
 		referrerPolicy: "no-referrer",
-		onError: () => setFailed(true)
+		onError: () => setFailedSrc(src)
 	});
 }
 function faviconHref(url) {

package/dist/components/AgentActivityPreview.d.ts

@@ -1,5 +1,5 @@
-import { n as WorkspaceDestination } from "../WorkspaceLink-DK1DWMHe.js";
-import { s as AgentActivitySummary } from "../AgentActivity-BNUNrP9O.js";
+import { n as WorkspaceDestination } from "../WorkspaceLink-O-EBKUJ8.js";
+import { s as AgentActivitySummary } from "../AgentActivity-D2SHSGFX.js";
 import * as React from "react";
 
 //#region src/components/AgentActivityPreview.d.ts
@@ -17,12 +17,12 @@ type AgentActivityPreviewItem = Omit<AgentActivitySummary, "mode"> & {
 interface AgentActivityPreviewProps extends Omit<React.HTMLAttributes<HTMLElement>, "children" | "onSelect"> {
   /** Current agent summaries to show in the transient preview. */
   items: readonly AgentActivityPreviewItem[];
-  /** Opens the selected agent by its stable id. */
-  onSelect: (id: string) => void;
-  /** Opens a projected file target in the selected agent's workspace. */
-  onOpenWorkspaceFile?: (id: string, destination: Extract<WorkspaceDestination, {
+  /** App-authored TanStack Router Link for every durable agent destination. */
+  renderAgentLink: (item: AgentActivityPreviewItem) => React.ReactElement;
+  /** App-authored TanStack Router Link for a projected workspace file destination. */
+  renderWorkspaceFileLink?: (item: AgentActivityPreviewItem, destination: Extract<WorkspaceDestination, {
     kind: "file";
-  }>) => void;
+  }>) => React.ReactElement;
   /** Hides the complete preview when the host supports dismissal. */
   onDismiss?: () => void;
   /** Product mark shown beside the agent rows. */
@@ -35,8 +35,8 @@ declare function AgentActivityPreview({
   className,
   items,
   onDismiss,
-  onOpenWorkspaceFile,
-  onSelect,
+  renderAgentLink,
+  renderWorkspaceFileLink,
   ref,
   ...props
 }: AgentActivityPreviewProps & {

package/dist/components/AgentActivityPreview.js

@@ -1,12 +1,13 @@
-import { t as cx } from "../class-names-9UtZwb0J.js";
-import { B as SpinnerIcon, T as McpIcon, Y as XIcon, q as WarningIcon, v as FileIcon } from "../icons-CpfUer49.js";
+import { t as cx } from "../class-names-BiMDVpUo.js";
+import { $ as XIcon, G as SpinnerIcon, Z as WarningIcon, k as McpIcon, x as FileIcon } from "../icons-CQJ-aMnI.js";
 import { ActivityHeader } from "./Activity.js";
 import { AgentActivityFavicon, AgentActivityIcon } from "./AgentActivity.js";
+import { t as NavigationLink } from "../navigation-link-Cob7KBlM.js";
 import "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/AgentActivityPreview.tsx
 /** Compact multi-agent preview for a page overlay or secondary application rail. */
-function AgentActivityPreview({ "aria-label": ariaLabel = "Agent activity", brandIcon = /* @__PURE__ */ jsx(McpIcon, {}), className, items, onDismiss, onOpenWorkspaceFile, onSelect, ref, ...props }) {
+function AgentActivityPreview({ "aria-label": ariaLabel = "Agent activity", brandIcon = /* @__PURE__ */ jsx(McpIcon, {}), className, items, onDismiss, renderAgentLink, renderWorkspaceFileLink, ref, ...props }) {
 	if (items.length === 0) return null;
 	return /* @__PURE__ */ jsxs("section", {
 		ref,
@@ -32,12 +33,11 @@ function AgentActivityPreview({ "aria-label": ariaLabel = "Agent activity", bran
 				role: "list",
 				children: items.map((item) => /* @__PURE__ */ jsxs("li", {
 					className: "agent-activity-preview__item",
-					children: [/* @__PURE__ */ jsx("button", {
-						type: "button",
+					children: [/* @__PURE__ */ jsx(NavigationLink, {
+						render: renderAgentLink(item),
 						className: "agent-activity-preview__row",
 						"aria-label": `${item.label}. ${statusLabel(item.status)}. Open agent.`,
 						"data-status": item.status,
-						onClick: () => onSelect(item.id),
 						children: /* @__PURE__ */ jsx(ActivityHeader, {
 							icon: item.url ? /* @__PURE__ */ jsx(AgentActivityFavicon, {
 								url: item.url,
@@ -61,14 +61,10 @@ function AgentActivityPreview({ "aria-label": ariaLabel = "Agent activity", bran
 								}) : null, /* @__PURE__ */ jsx(StatusIcon, { status: item.status })]
 							})
 						})
-					}), item.workspaceDestination && onOpenWorkspaceFile ? /* @__PURE__ */ jsx("button", {
-						type: "button",
+					}), item.workspaceDestination && renderWorkspaceFileLink ? /* @__PURE__ */ jsx(NavigationLink, {
+						render: renderWorkspaceFileLink(item, item.workspaceDestination),
 						className: "agent-activity-preview__file-action",
 						"aria-label": `Open ${item.workspaceDestination.path} in workspace`,
-						onClick: () => {
-							const destination = item.workspaceDestination;
-							if (destination) onOpenWorkspaceFile(item.id, destination);
-						},
 						children: /* @__PURE__ */ jsx(FileIcon, {})
 					}) : null]
 				}, item.id))

package/dist/components/AgentAttention.d.ts

@@ -1,4 +1,4 @@
-import { r as ButtonProps } from "../Button-FX_hpqxm.js";
+import { r as ButtonProps } from "../Button-DLGzHsjc.js";
 import * as React from "react";
 
 //#region src/components/AgentAttention.d.ts
@@ -37,7 +37,7 @@ declare function AgentAttentionHeader({
 }: AgentAttentionHeaderProps & {
   ref?: React.Ref<HTMLDivElement>;
 }): React.JSX.Element;
-interface AgentAttentionTriggerProps extends Omit<ButtonProps, "children" | "className" | "color" | "size" | "title" | "variant">, AgentAttentionHeadingProps {
+interface AgentAttentionTriggerProps extends Omit<ButtonProps, "children" | "color" | "size" | "title" | "variant">, AgentAttentionHeadingProps {
   className?: string;
 }
 /** Whole-surface trigger for opening the owning agent client or disclosure. */

package/dist/components/AgentAttention.js

@@ -1,4 +1,4 @@
-import { t as cx } from "../class-names-9UtZwb0J.js";
+import { t as cx } from "../class-names-BiMDVpUo.js";
 import { Button } from "./Button.js";
 import "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";

package/dist/components/AgentChat.d.ts

@@ -1,2 +1,2 @@
-import { a as AgentChatRenderMessageContext, i as AgentChatProps, n as AgentChatComposerDraft, o as AgentChatRenderPartContext, r as AgentChatPart, s as PermissionModeControl, t as AgentChat } from "../AgentChat-CrlpbvQJ.js";
-export { AgentChat, AgentChatComposerDraft, AgentChatPart, AgentChatProps, AgentChatRenderMessageContext, AgentChatRenderPartContext, PermissionModeControl };
+import { a as PermissionModeControl, i as AgentChatRenderMessageContext, n as AgentChatComposerDraft, r as AgentChatProps, t as AgentChat } from "../AgentChat-ClxViuUM.js";
+export { AgentChat, AgentChatComposerDraft, AgentChatProps, AgentChatRenderMessageContext, PermissionModeControl };