@mcp-b/react-components 0.46.7 → 0.48.0

package/dist/styles/workspace-concepts.css

@@ -0,0 +1,28 @@
+/* Panel shell only. Cards reuse connected-app-card; lists reuse sigvelo-stack. */
+.workspace-concept-panel {
+  box-sizing: border-box;
+  min-inline-size: 0;
+  min-block-size: 0;
+  block-size: 100%;
+  overflow: auto;
+  padding: var(--sigvelo-layout-gutter);
+  color: var(--sigvelo-color-text);
+  background: var(--sigvelo-color-canvas);
+}
+
+/* Session run outcome on the execution card's Last run row. */
+.workspace-execution-outcome {
+  display: inline-flex;
+  align-items: center;
+  gap: var(--sigvelo-spacing-1);
+  font-size: var(--sigvelo-text-xs);
+  line-height: var(--sigvelo-text-xs-leading);
+  white-space: nowrap;
+  color: var(--sigvelo-color-success-text);
+}
+
+@media (forced-colors: active) {
+  .workspace-execution-outcome {
+    color: CanvasText;
+  }
+}

package/dist/workspace-assets-GqsCYxqT.js

@@ -0,0 +1,168 @@
+import { composerLinkHref } from "./utils/composer-link.js";
+import { canRequestFavicon, inferFaviconUrl } from "./utils/favicon.js";
+import { Q as TrashIcon, S as FileIcon } from "./icons-CeGfXO21.js";
+import { Button } from "./components/foundations/Button.js";
+import { Tooltip } from "./components/foundations/Tooltip.js";
+import { IconButton } from "./components/foundations/IconButton.js";
+import { AppIcon } from "./components/foundations/AppIcon.js";
+import { ComposerLink } from "./components/ai-sdk/ComposerLink.js";
+import { AlertDialog } from "./components/foundations/AlertDialog.js";
+import * as React from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/_internal/workspace-delete.tsx
+/**
+* Header trash control for a workspace file. The card owns the confirm dialog;
+* the host deletes the file.
+*/
+function WorkspaceDeleteControl({ name, onDelete }) {
+	const triggerRef = React.useRef(null);
+	const [open, setOpen] = React.useState(false);
+	const [busy, setBusy] = React.useState(false);
+	const [errorMessage, setErrorMessage] = React.useState("");
+	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(IconButton, {
+		ref: triggerRef,
+		type: "button",
+		label: `Delete ${name}`,
+		tooltip: "Delete",
+		variant: "ghost",
+		color: "neutral",
+		disabled: busy,
+		"aria-haspopup": "dialog",
+		onClick: () => {
+			setErrorMessage("");
+			setOpen(true);
+		},
+		children: /* @__PURE__ */ jsx(TrashIcon, {})
+	}), /* @__PURE__ */ jsx(AlertDialog.Root, {
+		open,
+		onOpenChange: (nextOpen, eventDetails) => {
+			if (busy) {
+				eventDetails.cancel();
+				return;
+			}
+			setOpen(nextOpen);
+			if (!nextOpen) setErrorMessage("");
+		},
+		children: /* @__PURE__ */ jsxs(AlertDialog.Portal, { children: [/* @__PURE__ */ jsx(AlertDialog.Backdrop, {}), /* @__PURE__ */ jsx(AlertDialog.Viewport, { children: /* @__PURE__ */ jsxs(AlertDialog.Popup, {
+			finalFocus: triggerRef,
+			children: [
+				/* @__PURE__ */ jsxs(AlertDialog.Title, { children: [
+					"Delete ",
+					name,
+					"?"
+				] }),
+				/* @__PURE__ */ jsx(AlertDialog.Description, { children: "This deletes the file. This cannot be undone." }),
+				errorMessage ? /* @__PURE__ */ jsx("p", {
+					role: "alert",
+					children: errorMessage
+				}) : null,
+				/* @__PURE__ */ jsxs(AlertDialog.Footer, { children: [/* @__PURE__ */ jsx(AlertDialog.Close, {
+					disabled: busy,
+					children: "Cancel"
+				}), /* @__PURE__ */ jsx(Button, {
+					type: "button",
+					color: "destructive",
+					disabled: busy,
+					onClick: () => {
+						if (busy) return;
+						setBusy(true);
+						setErrorMessage("");
+						Promise.resolve(onDelete()).then(() => {
+							setOpen(false);
+						}).catch((error) => {
+							setErrorMessage(error instanceof Error && error.message.trim() ? error.message : "The file could not be deleted. Try again.");
+						}).finally(() => {
+							setBusy(false);
+						});
+					},
+					children: busy ? "Deleting…" : "Delete"
+				})] })
+			]
+		}) })] })
+	})] });
+}
+//#endregion
+//#region src/components/_internal/workspace-assets.tsx
+/** HTTP(S) URL from a field value, or nothing. */
+function httpUrl(value) {
+	try {
+		const url = new URL(value.trim());
+		if (url.protocol === "http:" || url.protocol === "https:") return url.href;
+	} catch {
+		return;
+	}
+}
+/** Site mark for a URL. Decorative — sit it next to visible text. */
+function FaviconMark({ fallback, href }) {
+	const src = href ? inferFaviconUrl(href) : void 0;
+	const allowed = Boolean(src && canRequestFavicon(src));
+	const [failedSrc, setFailedSrc] = React.useState(null);
+	if (!src || !allowed || Boolean(src) && failedSrc === src) {
+		if (fallback == null) return null;
+		return /* @__PURE__ */ jsx(AppIcon.Root, {
+			size: "xs",
+			"aria-hidden": "true",
+			children: /* @__PURE__ */ jsx(AppIcon.Fallback, { children: fallback })
+		});
+	}
+	return /* @__PURE__ */ jsxs(AppIcon.Root, {
+		size: "xs",
+		"aria-hidden": "true",
+		children: [/* @__PURE__ */ jsx(AppIcon.Image, {
+			alt: "",
+			fit: "contain",
+			src,
+			onError: () => {
+				setFailedSrc(src);
+			}
+		}), /* @__PURE__ */ jsx(AppIcon.Fallback, { children: fallback ?? null })]
+	});
+}
+/**
+* Supplementary tooltip on an already-interactive control. Paths, globs, and
+* enable labels belong here — not as persistent body copy.
+*/
+function Hint({ children, content }) {
+	if (content == null || content === false || content === "") return children;
+	return /* @__PURE__ */ jsxs(Tooltip.Root, { children: [/* @__PURE__ */ jsx(Tooltip.Trigger, {
+		render: children,
+		delay: 0
+	}), /* @__PURE__ */ jsx(Tooltip.Portal, { children: /* @__PURE__ */ jsx(Tooltip.Positioner, {
+		side: "top",
+		sideOffset: 6,
+		children: /* @__PURE__ */ jsx(Tooltip.Popup, { children: content })
+	}) })] });
+}
+/** File/thread/site identity, same icon+label mark as the composer. */
+function WorkspaceComposerLink({ hint, icon, kind = "file", label, onOpen, value }) {
+	const resolvedIcon = icon ?? (kind === "file" ? /* @__PURE__ */ jsx(FileIcon, {}) : void 0);
+	if (!onOpen) return /* @__PURE__ */ jsxs("span", {
+		className: "composer-link",
+		"data-composer-link": kind,
+		title: typeof hint === "string" ? hint : void 0,
+		children: [resolvedIcon ? /* @__PURE__ */ jsx("span", {
+			className: "composer-link__icon",
+			"aria-hidden": "true",
+			children: resolvedIcon
+		}) : null, /* @__PURE__ */ jsx("span", {
+			className: "composer-link__label",
+			children: label
+		})]
+	});
+	const link = /* @__PURE__ */ jsx(ComposerLink, {
+		href: composerLinkHref({
+			kind,
+			value,
+			label
+		}),
+		icon: resolvedIcon,
+		onClick: onOpen,
+		children: label
+	});
+	return hint == null || hint === false || hint === "" ? link : /* @__PURE__ */ jsx(Hint, {
+		content: hint,
+		children: link
+	});
+}
+//#endregion
+export { WorkspaceDeleteControl as i, WorkspaceComposerLink as n, httpUrl as r, FaviconMark as t };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mcp-b/react-components",
-  "version": "0.46.7",
+  "version": "0.48.0",
   "description": "MCP-B React components built on Base UI and shared design tokens, including Cloudflare Think chat primitives.",
   "homepage": "https://design-system.sigvelo.com",
   "bugs": {
@@ -54,7 +54,7 @@
     "streamdown": "^2.5.0",
     "unist-util-visit": "^5.1.0",
     "yet-another-react-lightbox": "^3.32.2",
-    "@mcp-b/design-tokens": "0.46.7"
+    "@mcp-b/design-tokens": "0.48.0"
   },
   "devDependencies": {
     "@ai-sdk/react": "^3.0.249",

package/dist/WorkspaceMessageResponse-D66ty4FO.d.ts

@@ -1,24 +0,0 @@
-import { E as MessageResponseProps } from "./Message-D_vCVEGB.js";
-import * as React from "react";
-
-//#region src/components/agents-sdk/WorkspaceMessageResponse.d.ts
-interface WorkspaceHtmlArtifactRenderInput {
-  label: string;
-  path: string;
-  /** Shared workspace link element; hosts pass it through to the preview unchanged. */
-  sourceLink: React.ReactElement;
-}
-type WorkspaceHtmlArtifactRenderer = (artifact: WorkspaceHtmlArtifactRenderInput) => React.ReactNode;
-interface WorkspaceMessageResponseProps extends MessageResponseProps {
-  /** Promotes one standalone workspace HTML link into host-hydrated shared UI. */
-  renderWorkspaceHtmlArtifact?: WorkspaceHtmlArtifactRenderer;
-}
-/** Adds workspace-aware Markdown links when rendered inside a workspace provider. */
-declare const WorkspaceMessageResponse: React.MemoExoticComponent<({
-  components,
-  rehypePlugins,
-  renderWorkspaceHtmlArtifact,
-  ...props
-}: WorkspaceMessageResponseProps) => React.JSX.Element>;
-//#endregion
-export { WorkspaceMessageResponseProps as i, WorkspaceHtmlArtifactRenderer as n, WorkspaceMessageResponse as r, WorkspaceHtmlArtifactRenderInput as t };