@mcp-b/react-components 0.1.1 → 0.1.2

package/dist/components/WebPreview.js

@@ -0,0 +1,280 @@
+import { n as ArrowLeftIcon, r as ArrowRightIcon, s as ChevronDownIcon, x as RefreshIcon } from "../icons-BsWc8g4E.js";
+import { t as cx } from "../class-names-9UtZwb0J.js";
+import { Button } from "./Button.js";
+import { Tooltip, TooltipPopup, TooltipPortal, TooltipPositioner, TooltipTrigger } from "./Tooltip.js";
+import { Badge } from "./Badge.js";
+import { Input } from "./Input.js";
+import { ScrollArea } from "./ScrollArea.js";
+import * as React from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/WebPreview.tsx
+const WebPreviewContext = React.createContext(null);
+function useWebPreviewContext() {
+	const ctx = React.useContext(WebPreviewContext);
+	if (!ctx) throw new Error("WebPreview subcomponents must be used inside <WebPreview>.");
+	return ctx;
+}
+/**
+* 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.
+*
+* 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
+* embedding that needs custom iframe permissions; add those explicitly here.
+*
+* Sigvelo changes: composes Button, Input, ScrollArea, Tooltip, and Badge;
+* keeps a conservative sandbox; maps navigation and console UI to Sigvelo CSS
+* tokens.
+*
+* The iframe has a fixed title and sandbox. Navigation buttons provide
+* accessible labels and tooltips. Add new permissions or console behaviors
+* here when multiple apps need them.
+*
+* @example
+* ```tsx
+* <WebPreview defaultUrl="https://example.com">
+*   <WebPreviewNavigation>
+*     <WebPreviewNavigationButton action="back" />
+*     <WebPreviewNavigationButton action="forward" />
+*     <WebPreviewNavigationButton action="reload" />
+*     <WebPreviewUrl />
+*   </WebPreviewNavigation>
+*   <WebPreviewBody />
+*   <WebPreviewConsole logs={logs} />
+* </WebPreview>
+* ```
+*/
+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 [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 setUrl = React.useCallback((next) => {
+		setHistory((prev) => [...prev.slice(0, index + 1), next]);
+		setIndex((prev) => prev + 1);
+		onUrlChangeRef.current?.(next);
+	}, [index]);
+	const goBack = React.useCallback(() => {
+		setIndex((prev) => Math.max(0, prev - 1));
+	}, []);
+	const goForward = React.useCallback(() => {
+		setIndex((prev) => Math.min(history.length - 1, prev + 1));
+	}, [history.length]);
+	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,
+		goBack,
+		goForward,
+		reload,
+		reloadToken
+	}), [
+		url,
+		setUrl,
+		consoleOpen,
+		index,
+		history.length,
+		goBack,
+		goForward,
+		reload,
+		reloadToken
+	]);
+	return /* @__PURE__ */ jsx(WebPreviewContext.Provider, {
+		value: ctxValue,
+		children: /* @__PURE__ */ jsx("div", {
+			ref,
+			className: cx("web-preview", className),
+			...props,
+			children
+		})
+	});
+}
+function WebPreviewNavigation({ className, children, ref, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		ref,
+		className: cx("web-preview__nav", className),
+		...props,
+		children
+	});
+}
+function WebPreviewNavigationButton({ className, action, label, tooltip, children, onClick, ...props }) {
+	const { canGoBack, canGoForward, goBack, goForward, reload } = useWebPreviewContext();
+	const def = action ? {
+		back: {
+			label: "Back",
+			icon: /* @__PURE__ */ jsx(ArrowLeftIcon, {}),
+			disabled: !canGoBack,
+			onAction: goBack
+		},
+		forward: {
+			label: "Forward",
+			icon: /* @__PURE__ */ jsx(ArrowRightIcon, {}),
+			disabled: !canGoForward,
+			onAction: goForward
+		},
+		reload: {
+			label: "Reload",
+			icon: /* @__PURE__ */ jsx(RefreshIcon, {}),
+			disabled: false,
+			onAction: reload
+		}
+	}[action] : null;
+	const resolvedLabel = label ?? tooltip ?? def?.label;
+	const handleClick = (e) => {
+		def?.onAction();
+		onClick?.(e);
+	};
+	const button = /* @__PURE__ */ jsx(Button, {
+		variant: "ghost",
+		size: "icon",
+		"aria-label": resolvedLabel,
+		disabled: def?.disabled,
+		className: cx("web-preview__nav-button", action && `web-preview__nav-button--${action}`, className),
+		...props,
+		onClick: handleClick,
+		children: children ?? def?.icon
+	});
+	if (!resolvedLabel) return button;
+	return /* @__PURE__ */ jsxs(Tooltip, { children: [/* @__PURE__ */ jsx(TooltipTrigger, { render: button }), /* @__PURE__ */ jsx(TooltipPortal, { children: /* @__PURE__ */ jsx(TooltipPositioner, { children: /* @__PURE__ */ jsx(TooltipPopup, { children: resolvedLabel }) }) })] });
+}
+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]);
+	return /* @__PURE__ */ jsx("form", {
+		className: "web-preview__url-form",
+		onSubmit: (e) => {
+			e.preventDefault();
+			const next = Array.isArray(inputValue) ? inputValue[0] : String(inputValue ?? "");
+			if (next) setUrl(next);
+		},
+		children: /* @__PURE__ */ jsx(Input, {
+			ref,
+			type: "text",
+			value: inputValue,
+			onChange: (e) => {
+				setDraft(e.target.value);
+				onChange?.(e);
+			},
+			onKeyDown: (e) => {
+				onKeyDown?.(e);
+				if (!e.defaultPrevented && e.key === "Enter") setUrl(e.currentTarget.value);
+			},
+			placeholder,
+			className: cx("web-preview__url", className),
+			...props
+		})
+	});
+}
+function WebPreviewBody({ className, loading, src, ref, interactive = true, ...props }) {
+	const { url, reloadToken } = useWebPreviewContext();
+	const effectiveSrc = src ?? url;
+	const iframeSrc = effectiveSrc ? `${effectiveSrc}${reloadToken ? `#reload-${reloadToken}` : ""}` : void 0;
+	if (!iframeSrc) return /* @__PURE__ */ jsx("div", {
+		className: cx("web-preview__body", "web-preview__body--empty", className),
+		children: loading ?? "Enter a URL above to preview a site."
+	});
+	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("iframe", {
+		ref,
+		src: iframeSrc,
+		sandbox: "allow-scripts allow-same-origin allow-forms allow-popups allow-presentation",
+		title: "Web preview",
+		className: cx("web-preview__body", !interactive && "web-preview__body--readonly", className),
+		...props
+	}, iframeSrc), loading] });
+}
+const LEVEL_COLOR = {
+	log: "neutral",
+	info: "primary",
+	warn: "warning",
+	error: "destructive"
+};
+function WebPreviewConsole({ className, logs = [], children, ref, ...props }) {
+	const { consoleOpen, setConsoleOpen } = useWebPreviewContext();
+	return /* @__PURE__ */ jsxs("div", {
+		ref,
+		className: cx("web-preview__console", className),
+		...props,
+		children: [/* @__PURE__ */ jsxs("button", {
+			type: "button",
+			className: "web-preview__console-header",
+			"aria-expanded": consoleOpen,
+			onClick: () => setConsoleOpen(!consoleOpen),
+			children: [/* @__PURE__ */ jsx("span", { children: "Console" }), /* @__PURE__ */ jsx(ChevronDownIcon, { "aria-hidden": "true" })]
+		}), consoleOpen ? /* @__PURE__ */ jsxs(ScrollArea.Root, {
+			className: "web-preview__console-scroll",
+			children: [/* @__PURE__ */ jsxs(ScrollArea.Viewport, {
+				className: "web-preview__console-viewport",
+				children: [/* @__PURE__ */ jsx("ul", {
+					className: "web-preview__console-list",
+					children: logs.length === 0 ? /* @__PURE__ */ jsx("li", {
+						className: "web-preview__console-empty",
+						children: "No console output"
+					}) : logs.map((log, i) => /* @__PURE__ */ jsxs("li", {
+						className: cx("web-preview__console-item", `web-preview__console-item--${log.level}`),
+						children: [
+							/* @__PURE__ */ jsx(Badge, {
+								color: LEVEL_COLOR[log.level],
+								size: "sm",
+								children: log.level
+							}),
+							/* @__PURE__ */ jsx("span", {
+								className: "web-preview__console-message",
+								children: log.message
+							}),
+							/* @__PURE__ */ jsx("span", {
+								className: "web-preview__console-time",
+								children: log.timestamp.toLocaleTimeString()
+							})
+						]
+					}, i))
+				}), children]
+			}), /* @__PURE__ */ jsx(ScrollArea.Scrollbar, {
+				orientation: "vertical",
+				children: /* @__PURE__ */ jsx(ScrollArea.Thumb, {})
+			})]
+		}) : null]
+	});
+}
+//#endregion
+export { WebPreview, WebPreviewBody, WebPreviewConsole, WebPreviewNavigation, WebPreviewNavigationButton, WebPreviewUrl };

package/dist/components/useStickToBottom.d.ts

@@ -0,0 +1,30 @@
+//#region src/components/useStickToBottom.d.ts
+interface UseStickToBottomOptions {
+  /**
+   * How close to the bottom (in pixels) still counts as "at bottom" for the
+   * sticky behavior. Larger values keep the viewport pinned through small
+   * scroll jitter.
+   */
+  slackPx?: number;
+}
+interface UseStickToBottomResult {
+  /** Attach to the scrolling element. */
+  viewportRef: (element: HTMLElement | null) => void;
+  /**
+   * Attach to the element whose size determines whether the viewport
+   * overflows. Typically the immediate child of the viewport.
+   */
+  contentRef: (element: HTMLElement | null) => void;
+  /** True while the viewport is pinned within `slackPx` of the bottom. */
+  isAtBottom: boolean;
+  /** Imperatively scroll the viewport to its bottom. */
+  scrollToBottom: (behavior?: ScrollBehavior) => void;
+}
+/**
+ * Pin a scrollable viewport to the bottom as its content grows, unless the
+ * user has scrolled up. Used by the conversation log and the workspace code
+ * inspector to keep streaming output in view without fighting user intent.
+ */
+declare function useStickToBottom(options?: UseStickToBottomOptions): UseStickToBottomResult;
+//#endregion
+export { UseStickToBottomOptions, UseStickToBottomResult, useStickToBottom };

package/dist/components/useStickToBottom.js

@@ -0,0 +1,95 @@
+import * as React from "react";
+//#region src/components/useStickToBottom.ts
+const DEFAULT_STICK_SLACK_PX = 160;
+/**
+* Pin a scrollable viewport to the bottom as its content grows, unless the
+* user has scrolled up. Used by the conversation log and the workspace code
+* inspector to keep streaming output in view without fighting user intent.
+*/
+function useStickToBottom(options = {}) {
+	const slackPx = options.slackPx ?? DEFAULT_STICK_SLACK_PX;
+	const viewportElementRef = React.useRef(null);
+	const contentElementRef = React.useRef(null);
+	const [viewportElement, setViewportElement] = React.useState(null);
+	const [contentElement, setContentElement] = React.useState(null);
+	const [isAtBottom, setIsAtBottom] = React.useState(true);
+	const isAtBottomRef = React.useRef(true);
+	const didInitialScrollRef = React.useRef(false);
+	const viewportRef = React.useCallback((element) => {
+		viewportElementRef.current = element;
+		setViewportElement((prev) => prev === element ? prev : element);
+	}, []);
+	const contentRef = React.useCallback((element) => {
+		contentElementRef.current = element;
+		setContentElement((prev) => prev === element ? prev : element);
+	}, []);
+	React.useLayoutEffect(() => {
+		const el = viewportElement;
+		const observed = contentElement ?? el?.firstElementChild;
+		if (!el || !observed) return;
+		if (!didInitialScrollRef.current) {
+			el.scrollTo({
+				top: el.scrollHeight,
+				behavior: "auto"
+			});
+			didInitialScrollRef.current = true;
+		}
+		const readIsAtBottom = () => el.scrollHeight - el.scrollTop - el.clientHeight < slackPx;
+		const updateIsAtBottom = () => {
+			const next = readIsAtBottom();
+			if (isAtBottomRef.current === next) return;
+			isAtBottomRef.current = next;
+			setIsAtBottom(next);
+		};
+		let resizeFrameId = null;
+		const flushResize = () => {
+			resizeFrameId = null;
+			if (!isAtBottomRef.current) {
+				updateIsAtBottom();
+				return;
+			}
+			el.scrollTo({
+				top: el.scrollHeight,
+				behavior: "auto"
+			});
+			updateIsAtBottom();
+		};
+		const scheduleResize = () => {
+			if (resizeFrameId !== null) return;
+			resizeFrameId = window.requestAnimationFrame(flushResize);
+		};
+		const handleScroll = () => {
+			updateIsAtBottom();
+		};
+		handleScroll();
+		el.addEventListener("scroll", handleScroll, { passive: true });
+		const observer = new ResizeObserver(() => {
+			scheduleResize();
+		});
+		observer.observe(observed);
+		return () => {
+			if (resizeFrameId !== null) window.cancelAnimationFrame(resizeFrameId);
+			el.removeEventListener("scroll", handleScroll);
+			observer.disconnect();
+		};
+	}, [
+		contentElement,
+		viewportElement,
+		slackPx
+	]);
+	return {
+		viewportRef,
+		contentRef,
+		isAtBottom,
+		scrollToBottom: React.useCallback((behavior = "smooth") => {
+			const el = viewportElementRef.current;
+			if (!el) return;
+			el.scrollTo({
+				top: el.scrollHeight,
+				behavior
+			});
+		}, [])
+	};
+}
+//#endregion
+export { useStickToBottom };

package/dist/copy-button-BIATcZWZ.d.ts

@@ -0,0 +1,16 @@
+import { r as ButtonProps } from "./Button-QCM8ZKgR.js";
+import * as React from "react";
+
+//#region src/components/_internal/copy-button.d.ts
+interface CopyButtonProps extends Omit<ButtonProps, "children" | "variant" | "size" | "color" | "className" | "onClick" | "onError"> {
+  className?: string;
+  label: string;
+  text: string;
+  timeout?: number;
+  stopPropagation?: boolean;
+  onCopy?: () => void;
+  onError?: (error: Error) => void;
+  onClick?: React.MouseEventHandler<HTMLButtonElement>;
+}
+//#endregion
+export { CopyButtonProps as t };

package/dist/copy-button-BNgclDrO.js

@@ -0,0 +1,43 @@
+import { l as CopyIcon, o as CheckIcon } from "./icons-BsWc8g4E.js";
+import { Button } from "./components/Button.js";
+import { Tooltip, TooltipPopup, TooltipPortal, TooltipPositioner, TooltipTrigger } from "./components/Tooltip.js";
+import * as React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/_internal/copy-button.tsx
+function CopyButton({ label, text, timeout = 1500, stopPropagation = false, onCopy, onError, onClick, ...props }) {
+	const [copied, setCopied] = React.useState(false);
+	const timeoutRef = React.useRef(null);
+	React.useEffect(() => () => {
+		if (timeoutRef.current !== null) window.clearTimeout(timeoutRef.current);
+	}, []);
+	const handleClick = React.useCallback(async (event) => {
+		if (stopPropagation) event.stopPropagation();
+		try {
+			await navigator.clipboard.writeText(text);
+			setCopied(true);
+			onCopy?.();
+			if (timeoutRef.current !== null) window.clearTimeout(timeoutRef.current);
+			timeoutRef.current = window.setTimeout(() => setCopied(false), timeout);
+		} catch (error) {
+			onError?.(error);
+		}
+		onClick?.(event);
+	}, [
+		onClick,
+		onCopy,
+		onError,
+		stopPropagation,
+		text,
+		timeout
+	]);
+	return /* @__PURE__ */ jsxs(Tooltip, { children: [/* @__PURE__ */ jsx(TooltipTrigger, { render: /* @__PURE__ */ jsx(Button, {
+		variant: "ghost",
+		size: "icon",
+		"aria-label": label,
+		...props,
+		onClick: handleClick,
+		children: copied ? /* @__PURE__ */ jsx(CheckIcon, {}) : /* @__PURE__ */ jsx(CopyIcon, {})
+	}) }), /* @__PURE__ */ jsx(TooltipPortal, { children: /* @__PURE__ */ jsx(TooltipPositioner, { children: /* @__PURE__ */ jsx(TooltipPopup, { children: copied ? "Copied" : label }) }) })] });
+}
+//#endregion
+export { CopyButton as t };

package/dist/icons-BsWc8g4E.js

@@ -0,0 +1,221 @@
+import "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/_internal/icons.tsx
+function Icon({ children, size = 16, strokeWidth = 1.75, ...props }) {
+	return /* @__PURE__ */ jsx("svg", {
+		width: size,
+		height: size,
+		viewBox: "0 0 16 16",
+		fill: "none",
+		stroke: "currentColor",
+		strokeWidth,
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		"aria-hidden": "true",
+		focusable: "false",
+		...props,
+		children
+	});
+}
+const ChevronRightIcon = (props) => /* @__PURE__ */ jsx(Icon, {
+	...props,
+	children: /* @__PURE__ */ jsx("path", { d: "M6 3.5L10.5 8L6 12.5" })
+});
+const ChevronDownIcon = (props) => /* @__PURE__ */ jsx(Icon, {
+	...props,
+	children: /* @__PURE__ */ jsx("path", { d: "M3.5 6L8 10.5L12.5 6" })
+});
+const BrainIcon = (props) => /* @__PURE__ */ jsxs(Icon, {
+	viewBox: "0 0 24 24",
+	...props,
+	children: [
+		/* @__PURE__ */ jsx("path", { d: "M12 18V5" }),
+		/* @__PURE__ */ jsx("path", { d: "M15 13a4.17 4.17 0 0 1-3-4 4.17 4.17 0 0 1-3 4" }),
+		/* @__PURE__ */ jsx("path", { d: "M17.598 6.5A3 3 0 1 0 12 5a3 3 0 1 0-5.598 1.5" }),
+		/* @__PURE__ */ jsx("path", { d: "M17.997 5.125a4 4 0 0 1 2.526 5.77" }),
+		/* @__PURE__ */ jsx("path", { d: "M18 18a4 4 0 0 0 2-7.464" }),
+		/* @__PURE__ */ jsx("path", { d: "M19.967 17.483A4 4 0 1 1 12 18a4 4 0 1 1-7.967-.517" }),
+		/* @__PURE__ */ jsx("path", { d: "M6 18a4 4 0 0 1-2-7.464" }),
+		/* @__PURE__ */ jsx("path", { d: "M6.003 5.125a4 4 0 0 0-2.526 5.77" })
+	]
+});
+const CheckIcon = (props) => /* @__PURE__ */ jsx(Icon, {
+	...props,
+	children: /* @__PURE__ */ jsx("path", { d: "M3 8.5L6.5 12L13 4.5" })
+});
+const XIcon = (props) => /* @__PURE__ */ jsx(Icon, {
+	...props,
+	children: /* @__PURE__ */ jsx("path", { d: "M4 4L12 12M12 4L4 12" })
+});
+const CopyIcon = (props) => /* @__PURE__ */ jsxs(Icon, {
+	...props,
+	children: [/* @__PURE__ */ jsx("rect", {
+		x: "5",
+		y: "5",
+		width: "8",
+		height: "8",
+		rx: "1.5"
+	}), /* @__PURE__ */ jsx("path", { d: "M11 5V4a1.5 1.5 0 0 0-1.5-1.5h-5A1.5 1.5 0 0 0 3 4v5A1.5 1.5 0 0 0 4.5 10.5H5" })]
+});
+const EyeIcon = (props) => /* @__PURE__ */ jsxs(Icon, {
+	...props,
+	children: [/* @__PURE__ */ jsx("path", { d: "M1.5 8S4 3 8 3s6.5 5 6.5 5-2.5 5-6.5 5S1.5 8 1.5 8Z" }), /* @__PURE__ */ jsx("circle", {
+		cx: "8",
+		cy: "8",
+		r: "2"
+	})]
+});
+const EyeOffIcon = (props) => /* @__PURE__ */ jsxs(Icon, {
+	...props,
+	children: [
+		/* @__PURE__ */ jsx("path", { d: "M2 2l12 12" }),
+		/* @__PURE__ */ jsx("path", { d: "M6.5 4A7.5 7.5 0 0 1 8 3.75c4 0 6.5 5 6.5 5a13 13 0 0 1-1.75 2.5" }),
+		/* @__PURE__ */ jsx("path", { d: "M9.85 10.08A2 2 0 0 1 6.08 6.15" }),
+		/* @__PURE__ */ jsx("path", { d: "M4.5 5.5C2.5 7 1.5 8 1.5 8s2.5 5 6.5 5c.8 0 1.55-.15 2.25-.42" })
+	]
+});
+const FolderIcon = (props) => /* @__PURE__ */ jsx(Icon, {
+	...props,
+	children: /* @__PURE__ */ jsx("path", { d: "M1.5 4A1.5 1.5 0 0 1 3 2.5h3l1.5 1.5H13A1.5 1.5 0 0 1 14.5 5.5v6A1.5 1.5 0 0 1 13 13H3a1.5 1.5 0 0 1-1.5-1.5V4Z" })
+});
+const FolderOpenIcon = (props) => /* @__PURE__ */ jsxs(Icon, {
+	...props,
+	children: [/* @__PURE__ */ jsx("path", { d: "M1.5 11.5v-7A1.5 1.5 0 0 1 3 3h3l1.5 1.5H13A1.5 1.5 0 0 1 14.5 6v1" }), /* @__PURE__ */ jsx("path", { d: "M1.5 11.5 3.5 7H15l-2 4.5H1.5Z" })]
+});
+const FileIcon = (props) => /* @__PURE__ */ jsxs(Icon, {
+	...props,
+	children: [/* @__PURE__ */ jsx("path", { d: "M9 1.5H4A1.5 1.5 0 0 0 2.5 3v10A1.5 1.5 0 0 0 4 14.5h8A1.5 1.5 0 0 0 13.5 13V6L9 1.5Z" }), /* @__PURE__ */ jsx("path", { d: "M9 1.5V6h4.5" })]
+});
+const PlusIcon = (props) => /* @__PURE__ */ jsx(Icon, {
+	...props,
+	children: /* @__PURE__ */ jsx("path", { d: "M8 3v10M3 8h10" })
+});
+const SquareIcon = (props) => /* @__PURE__ */ jsx(Icon, {
+	...props,
+	children: /* @__PURE__ */ jsx("rect", {
+		x: "3.5",
+		y: "3.5",
+		width: "9",
+		height: "9",
+		rx: "1"
+	})
+});
+const ArrowLeftIcon = (props) => /* @__PURE__ */ jsx(Icon, {
+	...props,
+	children: /* @__PURE__ */ jsx("path", { d: "M13 8H3M7 4L3 8l4 4" })
+});
+const ArrowRightIcon = (props) => /* @__PURE__ */ jsx(Icon, {
+	...props,
+	children: /* @__PURE__ */ jsx("path", { d: "M3 8h10M9 4l4 4-4 4" })
+});
+const ArrowDownIcon = (props) => /* @__PURE__ */ jsx(Icon, {
+	...props,
+	children: /* @__PURE__ */ jsx("path", { d: "M8 3v10M4 9l4 4 4-4" })
+});
+const ArrowUpIcon = (props) => /* @__PURE__ */ jsx(Icon, {
+	...props,
+	children: /* @__PURE__ */ jsx("path", { d: "M8 13V3M4 7l4-4 4 4" })
+});
+const DownloadIcon = (props) => /* @__PURE__ */ jsxs(Icon, {
+	...props,
+	children: [/* @__PURE__ */ jsx("path", { d: "M8 2v8M4 7l4 4 4-4" }), /* @__PURE__ */ jsx("path", { d: "M2.5 13.5h11" })]
+});
+const RefreshIcon = (props) => /* @__PURE__ */ jsxs(Icon, {
+	...props,
+	children: [
+		/* @__PURE__ */ jsx("path", { d: "M13.5 3v3h-3" }),
+		/* @__PURE__ */ jsx("path", { d: "M2.5 13v-3h3" }),
+		/* @__PURE__ */ jsx("path", { d: "M3.5 7a5 5 0 0 1 8.5-2L13.5 6" }),
+		/* @__PURE__ */ jsx("path", { d: "M12.5 9a5 5 0 0 1-8.5 2L2.5 10" })
+	]
+});
+const DotIcon = (props) => /* @__PURE__ */ jsx(Icon, {
+	...props,
+	children: /* @__PURE__ */ jsx("circle", {
+		cx: "8",
+		cy: "8",
+		r: "2.5",
+		fill: "currentColor",
+		stroke: "none"
+	})
+});
+const SpinnerIcon = (props) => /* @__PURE__ */ jsx(Icon, {
+	...props,
+	children: /* @__PURE__ */ jsx("path", { d: "M8 1.5A6.5 6.5 0 1 1 1.5 8" })
+});
+const SearchIcon = (props) => /* @__PURE__ */ jsxs(Icon, {
+	...props,
+	children: [/* @__PURE__ */ jsx("circle", {
+		cx: "7",
+		cy: "7",
+		r: "4.5"
+	}), /* @__PURE__ */ jsx("path", { d: "M13.5 13.5 10.5 10.5" })]
+});
+const TerminalIcon = (props) => /* @__PURE__ */ jsxs(Icon, {
+	...props,
+	children: [
+		/* @__PURE__ */ jsx("rect", {
+			x: "1.5",
+			y: "2.5",
+			width: "13",
+			height: "11",
+			rx: "1.5"
+		}),
+		/* @__PURE__ */ jsx("path", { d: "M4 6l2 2-2 2" }),
+		/* @__PURE__ */ jsx("path", { d: "M8.5 10h3" })
+	]
+});
+const LinkIcon = (props) => /* @__PURE__ */ jsxs(Icon, {
+	...props,
+	children: [/* @__PURE__ */ jsx("path", { d: "M7 9a2.5 2.5 0 0 0 3.5 0l2-2a2.5 2.5 0 0 0-3.5-3.5L8 4.5" }), /* @__PURE__ */ jsx("path", { d: "M9 7a2.5 2.5 0 0 0-3.5 0l-2 2a2.5 2.5 0 0 0 3.5 3.5L8 11.5" })]
+});
+const WarningIcon = (props) => /* @__PURE__ */ jsxs(Icon, {
+	...props,
+	children: [
+		/* @__PURE__ */ jsx("path", { d: "M7.13 2.4 1.3 12a1 1 0 0 0 .87 1.5h11.66a1 1 0 0 0 .87-1.5L8.87 2.4a1 1 0 0 0-1.74 0Z" }),
+		/* @__PURE__ */ jsx("path", { d: "M8 6v3.5" }),
+		/* @__PURE__ */ jsx("path", { d: "M8 11.5v.01" })
+	]
+});
+const WrenchIcon = (props) => /* @__PURE__ */ jsx(Icon, {
+	viewBox: "0 0 24 24",
+	...props,
+	children: /* @__PURE__ */ jsx("path", { d: "M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.106-3.105c.32-.322.863-.22.983.218a6 6 0 0 1-8.259 7.057l-7.91 7.91a1 1 0 0 1-2.999-3l7.91-7.91a6 6 0 0 1 7.057-8.259c.438.12.54.662.219.984z" })
+});
+const ImageIcon = (props) => /* @__PURE__ */ jsxs(Icon, {
+	viewBox: "0 0 24 24",
+	...props,
+	children: [
+		/* @__PURE__ */ jsx("rect", {
+			width: "18",
+			height: "18",
+			x: "3",
+			y: "3",
+			rx: "2",
+			ry: "2"
+		}),
+		/* @__PURE__ */ jsx("circle", {
+			cx: "9",
+			cy: "9",
+			r: "2"
+		}),
+		/* @__PURE__ */ jsx("path", { d: "m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21" })
+	]
+});
+const MonitorIcon = (props) => /* @__PURE__ */ jsxs(Icon, {
+	viewBox: "0 0 24 24",
+	...props,
+	children: [
+		/* @__PURE__ */ jsx("rect", {
+			width: "20",
+			height: "14",
+			x: "2",
+			y: "3",
+			rx: "2"
+		}),
+		/* @__PURE__ */ jsx("path", { d: "M8 21h8" }),
+		/* @__PURE__ */ jsx("path", { d: "M12 17v4" })
+	]
+});
+//#endregion
+export { SpinnerIcon as C, WrenchIcon as D, WarningIcon as E, XIcon as O, SearchIcon as S, TerminalIcon as T, ImageIcon as _, BrainIcon as a, PlusIcon as b, ChevronRightIcon as c, DownloadIcon as d, EyeIcon as f, FolderOpenIcon as g, FolderIcon as h, ArrowUpIcon as i, CopyIcon as l, FileIcon as m, ArrowLeftIcon as n, CheckIcon as o, EyeOffIcon as p, ArrowRightIcon as r, ChevronDownIcon as s, ArrowDownIcon as t, DotIcon as u, LinkIcon as v, SquareIcon as w, RefreshIcon as x, MonitorIcon as y };