@mcp-b/react-components 0.17.0 → 0.19.0

package/dist/components/WebPreview.js

@@ -1,5 +1,5 @@
-import { t as cx } from "../class-names-Bk-QLWWI.js";
-import { R as RefreshIcon, c as ChevronDownIcon, n as ArrowLeftIcon, r as ArrowRightIcon } from "../icons--FqCZEc3.js";
+import { t as cx } from "../class-names-BiMDVpUo.js";
+import { U as RefreshIcon, d as ChevronDownIcon, i as ArrowRightIcon, r as ArrowLeftIcon } from "../icons-DKXiSepE.js";
 import { Button } from "./Button.js";
 import { Tooltip } from "./Tooltip.js";
 import { Badge } from "./Badge.js";
@@ -16,8 +16,8 @@ function useWebPreviewContext() {
 }
 /**
 * An iframe preview with a navigation bar, URL input, and optional console
-* panel. Tracks browsing history internally so back/forward buttons work
-* without depending on the iframe's own history.
+* panel. Uncontrolled previews track browsing history internally; controlled
+* previews leave history and back/forward behavior to their caller.
 *
 * Built internally for agent/browser preview surfaces. Use it to display a
 * known URL with local navigation controls. Do not use it for trusted app
@@ -46,61 +46,65 @@ function useWebPreviewContext() {
 * ```
 */
 function WebPreview({ className, defaultUrl = "", url: controlledUrl, onUrlChange, children, ref, ...props }) {
-	const initialUrl = controlledUrl ?? defaultUrl;
-	const [history, setHistory] = React.useState(() => initialUrl ? [initialUrl] : []);
-	const [index, setIndex] = React.useState(initialUrl ? 0 : -1);
+	const [navigation, setNavigation] = React.useState(() => ({
+		history: defaultUrl ? [defaultUrl] : [],
+		index: defaultUrl ? 0 : -1
+	}));
 	const [reloadToken, setReloadToken] = React.useState(0);
 	const [consoleOpen, setConsoleOpen] = React.useState(false);
-	const url = index >= 0 ? history[index] ?? "" : "";
-	const onUrlChangeRef = React.useRef(onUrlChange);
-	onUrlChangeRef.current = onUrlChange;
-	const historyRef = React.useRef(history);
-	historyRef.current = history;
-	const indexRef = React.useRef(index);
-	indexRef.current = index;
-	const prevControlledUrlRef = React.useRef(controlledUrl);
-	React.useEffect(() => {
-		if (controlledUrl === void 0) return;
-		if (controlledUrl === prevControlledUrlRef.current) return;
-		prevControlledUrlRef.current = controlledUrl;
-		if (!controlledUrl) {
-			setHistory([]);
-			setIndex(-1);
-			return;
-		}
-		const currentHistory = historyRef.current;
-		const currentIndex = indexRef.current;
-		if (currentIndex >= 0 && currentHistory[currentIndex] === controlledUrl) return;
-		setHistory([...currentHistory.slice(0, currentIndex + 1), controlledUrl]);
-		setIndex(currentIndex + 1);
-	}, [controlledUrl]);
+	const { history, index } = navigation;
+	const isControlled = controlledUrl !== void 0;
+	const url = controlledUrl ?? (index >= 0 ? history[index] ?? "" : "");
 	const setUrl = React.useCallback((next) => {
-		setHistory((prev) => [...prev.slice(0, index + 1), next]);
-		setIndex((prev) => prev + 1);
-		onUrlChangeRef.current?.(next);
-	}, [index]);
+		if (!isControlled) setNavigation((current) => {
+			const history = [...current.history.slice(0, current.index + 1), next];
+			return {
+				history,
+				index: history.length - 1
+			};
+		});
+		onUrlChange?.(next);
+	}, [isControlled, onUrlChange]);
 	const goBack = React.useCallback(() => {
-		setIndex((prev) => Math.max(0, prev - 1));
-	}, []);
+		if (isControlled) return;
+		const nextIndex = Math.max(0, index - 1);
+		if (nextIndex === index) return;
+		setNavigation((current) => ({
+			...current,
+			index: nextIndex
+		}));
+		onUrlChange?.(history[nextIndex] ?? "");
+	}, [
+		history,
+		index,
+		isControlled,
+		onUrlChange
+	]);
 	const goForward = React.useCallback(() => {
-		setIndex((prev) => Math.min(history.length - 1, prev + 1));
-	}, [history.length]);
+		if (isControlled) return;
+		const nextIndex = Math.min(history.length - 1, index + 1);
+		if (nextIndex === index) return;
+		setNavigation((current) => ({
+			...current,
+			index: nextIndex
+		}));
+		onUrlChange?.(history[nextIndex] ?? "");
+	}, [
+		history,
+		index,
+		isControlled,
+		onUrlChange
+	]);
 	const reload = React.useCallback(() => {
 		setReloadToken((n) => n + 1);
 	}, []);
-	const prevIndexRef = React.useRef(index);
-	React.useEffect(() => {
-		if (index === prevIndexRef.current) return;
-		prevIndexRef.current = index;
-		if (index >= 0) onUrlChangeRef.current?.(history[index] ?? "");
-	}, [index, history]);
 	const ctxValue = React.useMemo(() => ({
 		url,
 		setUrl,
 		consoleOpen,
 		setConsoleOpen,
-		canGoBack: index > 0,
-		canGoForward: index >= 0 && index < history.length - 1,
+		canGoBack: !isControlled && index > 0,
+		canGoForward: !isControlled && index >= 0 && index < history.length - 1,
 		goBack,
 		goForward,
 		reload,
@@ -109,6 +113,7 @@ function WebPreview({ className, defaultUrl = "", url: controlledUrl, onUrlChang
 		url,
 		setUrl,
 		consoleOpen,
+		isControlled,
 		index,
 		history.length,
 		goBack,
@@ -164,7 +169,8 @@ function WebPreviewNavigationButton({ className, action, label, tooltip, childre
 	};
 	const button = /* @__PURE__ */ jsx(Button, {
 		variant: "ghost",
-		size: "icon",
+		size: "sm",
+		iconOnly: true,
 		"aria-label": resolvedLabel,
 		disabled: def?.disabled,
 		className: cx("web-preview__nav-button", action && `web-preview__nav-button--${action}`, className),
@@ -177,11 +183,16 @@ function WebPreviewNavigationButton({ className, action, label, tooltip, childre
 }
 function WebPreviewUrl({ className, placeholder = "Enter URL…", value, onChange, onKeyDown, ref, ...props }) {
 	const { url, setUrl } = useWebPreviewContext();
-	const [draft, setDraft] = React.useState(url);
-	const inputValue = value ?? draft;
-	React.useEffect(() => {
-		setDraft(url);
-	}, [url]);
+	const [draft, setDraft] = React.useState(() => ({
+		url,
+		value: url
+	}));
+	if (draft.url !== url) setDraft({
+		url,
+		value: url
+	});
+	const derivedDraft = draft.url === url ? draft.value : url;
+	const inputValue = value ?? derivedDraft;
 	return /* @__PURE__ */ jsx("form", {
 		className: "web-preview__url-form",
 		onSubmit: (e) => {
@@ -194,7 +205,10 @@ function WebPreviewUrl({ className, placeholder = "Enter URL…", value, onChang
 			type: "text",
 			value: inputValue,
 			onChange: (e) => {
-				setDraft(e.target.value);
+				setDraft({
+					url,
+					value: e.target.value
+				});
 				onChange?.(e);
 			},
 			onKeyDown: (e) => {
@@ -218,7 +232,7 @@ function WebPreviewBody({ className, loading, src, ref, interactive = true, ...p
 	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("iframe", {
 		ref,
 		src: iframeSrc,
-		sandbox: "allow-scripts allow-same-origin allow-forms allow-popups allow-presentation",
+		sandbox: "allow-scripts allow-forms allow-popups allow-presentation",
 		title: "Web preview",
 		className: cx("web-preview__body", !interactive && "web-preview__body--readonly", className),
 		...props

package/dist/components/Workspace.d.ts

@@ -1,2 +1,2 @@
-import { a as useWorkspace, i as WorkspaceState, n as WorkspaceInfo, r as WorkspaceSource, t as UseWorkspaceOptions } from "../Workspace-C9RFoxcu.js";
-export { UseWorkspaceOptions, WorkspaceInfo, WorkspaceSource, WorkspaceState, useWorkspace };
+import { a as WorkspaceSource, c as workspaceBinaryFileQueryOptions, d as workspaceFileStatQueryOptions, f as workspaceInfoQueryOptions, i as WorkspaceQueryKey, l as workspaceDirectoryQueryOptions, m as workspaceTextFileQueryOptions, n as WorkspaceFileReadTarget, o as WorkspaceState, p as workspaceQueryKey, r as WorkspaceInfo, s as useWorkspace, t as UseWorkspaceOptions, u as workspaceFileAssetQueryOptions } from "../Workspace-Jez8ffUj.js";
+export { UseWorkspaceOptions, WorkspaceFileReadTarget, WorkspaceInfo, WorkspaceQueryKey, WorkspaceSource, WorkspaceState, useWorkspace, workspaceBinaryFileQueryOptions, workspaceDirectoryQueryOptions, workspaceFileAssetQueryOptions, workspaceFileStatQueryOptions, workspaceInfoQueryOptions, workspaceQueryKey, workspaceTextFileQueryOptions };