@websolutespa/ask-ui 1.0.2 → 1.0.4

package/dist/components/ai-elements/prompt-input.mjs

@@ -0,0 +1,703 @@
+"use client";
+import { cn } from "../../lib/utils.mjs";
+import { HoverCard, HoverCardContent, HoverCardTrigger } from "../hover-card.mjs";
+import { Tooltip, TooltipContent, TooltipTrigger } from "../tooltip.mjs";
+import { InputGroup, InputGroupAddon, InputGroupButton, InputGroupTextarea } from "../input-group.mjs";
+import { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator } from "../command.mjs";
+import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from "../dropdown-menu.mjs";
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "../select.mjs";
+import { Spinner } from "../spinner.mjs";
+import { ArrowUpIcon, ImageIcon, Monitor, PlusIcon, SquareIcon, XIcon } from "lucide-react";
+import { Children, createContext, useCallback, useContext, useEffect, useMemo, useRef, useState } from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { nanoid } from "nanoid";
+//#region src/components/ai-elements/prompt-input.tsx
+const convertBlobUrlToDataUrl = async (url) => {
+	try {
+		const blob = await (await fetch(url)).blob();
+		return new Promise((resolve) => {
+			const reader = new FileReader();
+			reader.onloadend = () => resolve(reader.result);
+			reader.onerror = () => resolve(null);
+			reader.readAsDataURL(blob);
+		});
+	} catch {
+		return null;
+	}
+};
+const captureScreenshot = async () => {
+	if (typeof navigator === "undefined" || !navigator.mediaDevices?.getDisplayMedia) return null;
+	let stream = null;
+	const video = document.createElement("video");
+	video.muted = true;
+	video.playsInline = true;
+	try {
+		stream = await navigator.mediaDevices.getDisplayMedia({
+			audio: false,
+			video: true
+		});
+		video.srcObject = stream;
+		await new Promise((resolve, reject) => {
+			video.onloadedmetadata = () => resolve();
+			video.onerror = () => reject(/* @__PURE__ */ new Error("Failed to load screen stream"));
+		});
+		await video.play();
+		const width = video.videoWidth;
+		const height = video.videoHeight;
+		if (!width || !height) return null;
+		const canvas = document.createElement("canvas");
+		canvas.width = width;
+		canvas.height = height;
+		const context = canvas.getContext("2d");
+		if (!context) return null;
+		context.drawImage(video, 0, 0, width, height);
+		const blob = await new Promise((resolve) => {
+			canvas.toBlob(resolve, "image/png");
+		});
+		if (!blob) return null;
+		const timestamp = (/* @__PURE__ */ new Date()).toISOString().replaceAll(/[:.]/g, "-").replace("T", "_").replace("Z", "");
+		return new File([blob], `screenshot-${timestamp}.png`, {
+			lastModified: Date.now(),
+			type: "image/png"
+		});
+	} finally {
+		if (stream) for (const track of stream.getTracks()) track.stop();
+		video.pause();
+		video.srcObject = null;
+	}
+};
+const PromptInputController = createContext(null);
+const ProviderAttachmentsContext = createContext(null);
+const usePromptInputController = () => {
+	const ctx = useContext(PromptInputController);
+	if (!ctx) throw new Error("Wrap your component inside <PromptInputProvider> to use usePromptInputController().");
+	return ctx;
+};
+const useOptionalPromptInputController = () => useContext(PromptInputController);
+const useProviderAttachments = () => {
+	const ctx = useContext(ProviderAttachmentsContext);
+	if (!ctx) throw new Error("Wrap your component inside <PromptInputProvider> to use useProviderAttachments().");
+	return ctx;
+};
+const useOptionalProviderAttachments = () => useContext(ProviderAttachmentsContext);
+/**
+* Optional global provider that lifts PromptInput state outside of PromptInput.
+* If you don't use it, PromptInput stays fully self-managed.
+*/
+const PromptInputProvider = ({ initialInput: initialTextInput = "", children }) => {
+	const [textInput, setTextInput] = useState(initialTextInput);
+	const clearInput = useCallback(() => setTextInput(""), []);
+	const [attachmentFiles, setAttachmentFiles] = useState([]);
+	const fileInputRef = useRef(null);
+	const openRef = useRef(() => {});
+	const add = useCallback((files) => {
+		const incoming = [...files];
+		if (incoming.length === 0) return;
+		setAttachmentFiles((prev) => [...prev, ...incoming.map((file) => ({
+			filename: file.name,
+			id: nanoid(),
+			mediaType: file.type,
+			type: "file",
+			url: URL.createObjectURL(file)
+		}))]);
+	}, []);
+	const remove = useCallback((id) => {
+		setAttachmentFiles((prev) => {
+			const found = prev.find((f) => f.id === id);
+			if (found?.url) URL.revokeObjectURL(found.url);
+			return prev.filter((f) => f.id !== id);
+		});
+	}, []);
+	const clear = useCallback(() => {
+		setAttachmentFiles((prev) => {
+			for (const f of prev) if (f.url) URL.revokeObjectURL(f.url);
+			return [];
+		});
+	}, []);
+	const attachmentsRef = useRef(attachmentFiles);
+	useEffect(() => {
+		attachmentsRef.current = attachmentFiles;
+	}, [attachmentFiles]);
+	useEffect(() => () => {
+		for (const f of attachmentsRef.current) if (f.url) URL.revokeObjectURL(f.url);
+	}, []);
+	const openFileDialog = useCallback(() => {
+		openRef.current?.();
+	}, []);
+	const attachments = useMemo(() => ({
+		add,
+		clear,
+		fileInputRef,
+		files: attachmentFiles,
+		openFileDialog,
+		remove
+	}), [
+		attachmentFiles,
+		add,
+		remove,
+		clear,
+		openFileDialog
+	]);
+	const __registerFileInput = useCallback((ref, open) => {
+		fileInputRef.current = ref.current;
+		openRef.current = open;
+	}, []);
+	const controller = useMemo(() => ({
+		__registerFileInput,
+		attachments,
+		textInput: {
+			clear: clearInput,
+			setInput: setTextInput,
+			value: textInput
+		}
+	}), [
+		textInput,
+		clearInput,
+		attachments,
+		__registerFileInput
+	]);
+	return /* @__PURE__ */ jsx(PromptInputController.Provider, {
+		value: controller,
+		children: /* @__PURE__ */ jsx(ProviderAttachmentsContext.Provider, {
+			value: attachments,
+			children
+		})
+	});
+};
+const LocalAttachmentsContext = createContext(null);
+const usePromptInputAttachments = () => {
+	const provider = useOptionalProviderAttachments();
+	const context = useContext(LocalAttachmentsContext) ?? provider;
+	if (!context) throw new Error("usePromptInputAttachments must be used within a PromptInput or PromptInputProvider");
+	return context;
+};
+const LocalReferencedSourcesContext = createContext(null);
+const usePromptInputReferencedSources = () => {
+	const ctx = useContext(LocalReferencedSourcesContext);
+	if (!ctx) throw new Error("usePromptInputReferencedSources must be used within a LocalReferencedSourcesContext.Provider");
+	return ctx;
+};
+const PromptInputActionAddAttachments = ({ label = "Add photos or files", ...props }) => {
+	const attachments = usePromptInputAttachments();
+	const handleSelect = useCallback((e) => {
+		e.preventDefault();
+		attachments.openFileDialog();
+	}, [attachments]);
+	return /* @__PURE__ */ jsxs(DropdownMenuItem, {
+		...props,
+		onSelect: handleSelect,
+		children: [
+			/* @__PURE__ */ jsx(ImageIcon, { className: "mr-2 size-4" }),
+			" ",
+			label
+		]
+	});
+};
+const PromptInputActionAddScreenshot = ({ label = "Take screenshot", onSelect, ...props }) => {
+	const attachments = usePromptInputAttachments();
+	const handleSelect = useCallback(async (event) => {
+		onSelect?.(event);
+		if (event.defaultPrevented) return;
+		try {
+			const screenshot = await captureScreenshot();
+			if (screenshot) attachments.add([screenshot]);
+		} catch (error) {
+			if (error instanceof DOMException && (error.name === "NotAllowedError" || error.name === "AbortError")) return;
+			throw error;
+		}
+	}, [onSelect, attachments]);
+	return /* @__PURE__ */ jsxs(DropdownMenuItem, {
+		...props,
+		onSelect: handleSelect,
+		children: [/* @__PURE__ */ jsx(Monitor, { className: "mr-2 size-4" }), label]
+	});
+};
+const PromptInput = ({ className, groupClassName, accept, multiple, globalDrop, syncHiddenInput, maxFiles, maxFileSize, onError, onSubmit, children, ...props }) => {
+	const controller = useOptionalPromptInputController();
+	const usingProvider = !!controller;
+	const inputRef = useRef(null);
+	const formRef = useRef(null);
+	const [items, setItems] = useState([]);
+	const files = usingProvider ? controller.attachments.files : items;
+	const [referencedSources, setReferencedSources] = useState([]);
+	const filesRef = useRef(files);
+	useEffect(() => {
+		filesRef.current = files;
+	}, [files]);
+	const openFileDialogLocal = useCallback(() => {
+		inputRef.current?.click();
+	}, []);
+	const matchesAccept = useCallback((f) => {
+		if (!accept || accept.trim() === "") return true;
+		return accept.split(",").map((s) => s.trim()).filter(Boolean).some((pattern) => {
+			if (pattern.endsWith("/*")) {
+				const prefix = pattern.slice(0, -1);
+				return f.type.startsWith(prefix);
+			}
+			return f.type === pattern;
+		});
+	}, [accept]);
+	const addLocal = useCallback((fileList) => {
+		const incoming = [...fileList];
+		const accepted = incoming.filter((f) => matchesAccept(f));
+		if (incoming.length && accepted.length === 0) {
+			onError?.({
+				code: "accept",
+				message: "No files match the accepted types."
+			});
+			return;
+		}
+		const withinSize = (f) => maxFileSize ? f.size <= maxFileSize : true;
+		const sized = accepted.filter(withinSize);
+		if (accepted.length > 0 && sized.length === 0) {
+			onError?.({
+				code: "max_file_size",
+				message: "All files exceed the maximum size."
+			});
+			return;
+		}
+		setItems((prev) => {
+			const capacity = typeof maxFiles === "number" ? Math.max(0, maxFiles - prev.length) : void 0;
+			const capped = typeof capacity === "number" ? sized.slice(0, capacity) : sized;
+			if (typeof capacity === "number" && sized.length > capacity) onError?.({
+				code: "max_files",
+				message: "Too many files. Some were not added."
+			});
+			const next = [];
+			for (const file of capped) next.push({
+				filename: file.name,
+				id: nanoid(),
+				mediaType: file.type,
+				type: "file",
+				url: URL.createObjectURL(file)
+			});
+			return [...prev, ...next];
+		});
+	}, [
+		matchesAccept,
+		maxFiles,
+		maxFileSize,
+		onError
+	]);
+	const removeLocal = useCallback((id) => setItems((prev) => {
+		const found = prev.find((file) => file.id === id);
+		if (found?.url) URL.revokeObjectURL(found.url);
+		return prev.filter((file) => file.id !== id);
+	}), []);
+	const addWithProviderValidation = useCallback((fileList) => {
+		const incoming = [...fileList];
+		const accepted = incoming.filter((f) => matchesAccept(f));
+		if (incoming.length && accepted.length === 0) {
+			onError?.({
+				code: "accept",
+				message: "No files match the accepted types."
+			});
+			return;
+		}
+		const withinSize = (f) => maxFileSize ? f.size <= maxFileSize : true;
+		const sized = accepted.filter(withinSize);
+		if (accepted.length > 0 && sized.length === 0) {
+			onError?.({
+				code: "max_file_size",
+				message: "All files exceed the maximum size."
+			});
+			return;
+		}
+		const currentCount = files.length;
+		const capacity = typeof maxFiles === "number" ? Math.max(0, maxFiles - currentCount) : void 0;
+		const capped = typeof capacity === "number" ? sized.slice(0, capacity) : sized;
+		if (typeof capacity === "number" && sized.length > capacity) onError?.({
+			code: "max_files",
+			message: "Too many files. Some were not added."
+		});
+		if (capped.length > 0) controller?.attachments.add(capped);
+	}, [
+		matchesAccept,
+		maxFileSize,
+		maxFiles,
+		onError,
+		files.length,
+		controller
+	]);
+	const clearAttachments = useCallback(() => usingProvider ? controller?.attachments.clear() : setItems((prev) => {
+		for (const file of prev) if (file.url) URL.revokeObjectURL(file.url);
+		return [];
+	}), [usingProvider, controller]);
+	const clearReferencedSources = useCallback(() => setReferencedSources([]), []);
+	const add = usingProvider ? addWithProviderValidation : addLocal;
+	const remove = usingProvider ? controller.attachments.remove : removeLocal;
+	const openFileDialog = usingProvider ? controller.attachments.openFileDialog : openFileDialogLocal;
+	const clear = useCallback(() => {
+		clearAttachments();
+		clearReferencedSources();
+	}, [clearAttachments, clearReferencedSources]);
+	useEffect(() => {
+		if (!usingProvider) return;
+		controller.__registerFileInput(inputRef, () => inputRef.current?.click());
+	}, [usingProvider, controller]);
+	useEffect(() => {
+		if (syncHiddenInput && inputRef.current && files.length === 0) inputRef.current.value = "";
+	}, [files, syncHiddenInput]);
+	useEffect(() => {
+		const form = formRef.current;
+		if (!form) return;
+		if (globalDrop) return;
+		const onDragOver = (e) => {
+			if (e.dataTransfer?.types?.includes("Files")) e.preventDefault();
+		};
+		const onDrop = (e) => {
+			if (e.dataTransfer?.types?.includes("Files")) e.preventDefault();
+			if (e.dataTransfer?.files && e.dataTransfer.files.length > 0) add(e.dataTransfer.files);
+		};
+		form.addEventListener("dragover", onDragOver);
+		form.addEventListener("drop", onDrop);
+		return () => {
+			form.removeEventListener("dragover", onDragOver);
+			form.removeEventListener("drop", onDrop);
+		};
+	}, [add, globalDrop]);
+	useEffect(() => {
+		if (!globalDrop) return;
+		const onDragOver = (e) => {
+			if (e.dataTransfer?.types?.includes("Files")) e.preventDefault();
+		};
+		const onDrop = (e) => {
+			if (e.dataTransfer?.types?.includes("Files")) e.preventDefault();
+			if (e.dataTransfer?.files && e.dataTransfer.files.length > 0) add(e.dataTransfer.files);
+		};
+		document.addEventListener("dragover", onDragOver);
+		document.addEventListener("drop", onDrop);
+		return () => {
+			document.removeEventListener("dragover", onDragOver);
+			document.removeEventListener("drop", onDrop);
+		};
+	}, [add, globalDrop]);
+	useEffect(() => () => {
+		if (!usingProvider) {
+			for (const f of filesRef.current) if (f.url) URL.revokeObjectURL(f.url);
+		}
+	}, [usingProvider]);
+	const handleChange = useCallback((event) => {
+		if (event.currentTarget.files) add(event.currentTarget.files);
+		event.currentTarget.value = "";
+	}, [add]);
+	const attachmentsCtx = useMemo(() => ({
+		add,
+		clear: clearAttachments,
+		fileInputRef: inputRef,
+		files: files.map((item) => ({
+			...item,
+			id: item.id
+		})),
+		openFileDialog,
+		remove
+	}), [
+		files,
+		add,
+		remove,
+		clearAttachments,
+		openFileDialog
+	]);
+	const refsCtx = useMemo(() => ({
+		add: (incoming) => {
+			const array = Array.isArray(incoming) ? incoming : [incoming];
+			setReferencedSources((prev) => [...prev, ...array.map((s) => ({
+				...s,
+				id: nanoid()
+			}))]);
+		},
+		clear: clearReferencedSources,
+		remove: (id) => {
+			setReferencedSources((prev) => prev.filter((s) => s.id !== id));
+		},
+		sources: referencedSources
+	}), [referencedSources, clearReferencedSources]);
+	const handleSubmit = useCallback(async (event) => {
+		event.preventDefault();
+		const form = event.currentTarget;
+		const text = usingProvider ? controller.textInput.value : new FormData(form).get("message") || "";
+		if (!usingProvider) form.reset();
+		try {
+			const result = onSubmit({
+				files: await Promise.all(files.map(async ({ id: _id, ...item }) => {
+					if (item.url?.startsWith("blob:")) {
+						const dataUrl = await convertBlobUrlToDataUrl(item.url);
+						return {
+							...item,
+							url: dataUrl ?? item.url
+						};
+					}
+					return item;
+				})),
+				text
+			}, event);
+			if (result instanceof Promise) try {
+				await result;
+				clear();
+				if (usingProvider) controller.textInput.clear();
+			} catch {}
+			else {
+				clear();
+				if (usingProvider) controller.textInput.clear();
+			}
+		} catch {}
+	}, [
+		usingProvider,
+		controller,
+		files,
+		onSubmit,
+		clear
+	]);
+	const inner = /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("input", {
+		accept,
+		"aria-label": "Upload files",
+		className: "hidden",
+		multiple,
+		onChange: handleChange,
+		ref: inputRef,
+		title: "Upload files",
+		type: "file"
+	}), /* @__PURE__ */ jsx("form", {
+		className: cn("w-full", className),
+		onSubmit: handleSubmit,
+		ref: formRef,
+		...props,
+		children: /* @__PURE__ */ jsx(InputGroup, {
+			className: cn("overflow-hidden bg-white dark:bg-white", groupClassName),
+			children
+		})
+	})] });
+	const withReferencedSources = /* @__PURE__ */ jsx(LocalReferencedSourcesContext.Provider, {
+		value: refsCtx,
+		children: inner
+	});
+	return /* @__PURE__ */ jsx(LocalAttachmentsContext.Provider, {
+		value: attachmentsCtx,
+		children: withReferencedSources
+	});
+};
+const PromptInputBody = ({ className, ...props }) => /* @__PURE__ */ jsx("div", {
+	className: cn("contents", className),
+	...props
+});
+const PromptInputTextarea = ({ onChange, onKeyDown, className, placeholder = "What would you like to know?", ...props }) => {
+	const controller = useOptionalPromptInputController();
+	const attachments = usePromptInputAttachments();
+	const [isComposing, setIsComposing] = useState(false);
+	const handleKeyDown = useCallback((e) => {
+		onKeyDown?.(e);
+		if (e.defaultPrevented) return;
+		if (e.key === "Enter") {
+			if (isComposing || e.nativeEvent.isComposing) return;
+			if (e.shiftKey) return;
+			e.preventDefault();
+			const { form } = e.currentTarget;
+			if ((form?.querySelector("button[type=\"submit\"]"))?.disabled) return;
+			form?.requestSubmit();
+		}
+		if (e.key === "Backspace" && e.currentTarget.value === "" && attachments.files.length > 0) {
+			e.preventDefault();
+			const lastAttachment = attachments.files.at(-1);
+			if (lastAttachment) attachments.remove(lastAttachment.id);
+		}
+	}, [
+		onKeyDown,
+		isComposing,
+		attachments
+	]);
+	const handlePaste = useCallback((event) => {
+		const items = event.clipboardData?.items;
+		if (!items) return;
+		const files = [];
+		for (const item of items) if (item.kind === "file") {
+			const file = item.getAsFile();
+			if (file) files.push(file);
+		}
+		if (files.length > 0) {
+			event.preventDefault();
+			attachments.add(files);
+		}
+	}, [attachments]);
+	const handleCompositionEnd = useCallback(() => setIsComposing(false), []);
+	const handleCompositionStart = useCallback(() => setIsComposing(true), []);
+	const controlledProps = controller ? {
+		onChange: (e) => {
+			controller.textInput.setInput(e.currentTarget.value);
+			onChange?.(e);
+		},
+		value: controller.textInput.value
+	} : { onChange };
+	return /* @__PURE__ */ jsx(InputGroupTextarea, {
+		className: cn("field-sizing-content max-h-48 min-h-16", className),
+		name: "message",
+		onCompositionEnd: handleCompositionEnd,
+		onCompositionStart: handleCompositionStart,
+		onKeyDown: handleKeyDown,
+		onPaste: handlePaste,
+		placeholder,
+		...props,
+		...controlledProps
+	});
+};
+const PromptInputHeader = ({ className, ...props }) => /* @__PURE__ */ jsx(InputGroupAddon, {
+	align: "block-end",
+	className: cn("order-first flex-wrap gap-1", className),
+	...props
+});
+const PromptInputFooter = ({ className, ...props }) => /* @__PURE__ */ jsx(InputGroupAddon, {
+	align: "block-end",
+	className: cn("justify-between gap-1", className),
+	...props
+});
+const PromptInputTools = ({ className, ...props }) => /* @__PURE__ */ jsx("div", {
+	className: cn("flex min-w-0 items-center gap-1", className),
+	...props
+});
+const PromptInputButton = ({ variant = "ghost", className, size, tooltip, ...props }) => {
+	const newSize = size ?? (Children.count(props.children) > 1 ? "sm" : "icon-sm");
+	const button = /* @__PURE__ */ jsx(InputGroupButton, {
+		className: cn(className),
+		size: newSize,
+		type: "button",
+		variant,
+		...props
+	});
+	if (!tooltip) return button;
+	const tooltipContent = typeof tooltip === "string" ? tooltip : tooltip.content;
+	const shortcut = typeof tooltip === "string" ? void 0 : tooltip.shortcut;
+	const side = typeof tooltip === "string" ? "top" : tooltip.side ?? "top";
+	return /* @__PURE__ */ jsxs(Tooltip, { children: [/* @__PURE__ */ jsx(TooltipTrigger, {
+		asChild: true,
+		children: button
+	}), /* @__PURE__ */ jsxs(TooltipContent, {
+		side,
+		children: [tooltipContent, shortcut && /* @__PURE__ */ jsx("span", {
+			className: "ml-2 text-muted-foreground",
+			children: shortcut
+		})]
+	})] });
+};
+const PromptInputActionMenu = (props) => /* @__PURE__ */ jsx(DropdownMenu, { ...props });
+const PromptInputActionMenuTrigger = ({ className, children, ...props }) => /* @__PURE__ */ jsx(DropdownMenuTrigger, {
+	asChild: true,
+	children: /* @__PURE__ */ jsx(PromptInputButton, {
+		className,
+		...props,
+		children: children ?? /* @__PURE__ */ jsx(PlusIcon, { className: "size-4" })
+	})
+});
+const PromptInputActionMenuContent = ({ className, ...props }) => /* @__PURE__ */ jsx(DropdownMenuContent, {
+	align: "start",
+	className: cn(className),
+	...props
+});
+const PromptInputActionMenuItem = ({ className, ...props }) => /* @__PURE__ */ jsx(DropdownMenuItem, {
+	className: cn(className),
+	...props
+});
+const PromptInputSubmit = ({ className, variant = "default", size = "icon-sm", status, onStop, onClick, children, ...props }) => {
+	const isGenerating = status === "submitted" || status === "streaming";
+	let Icon = /* @__PURE__ */ jsx(ArrowUpIcon, { className: "size-4" });
+	if (status === "submitted") Icon = /* @__PURE__ */ jsx(Spinner, {});
+	else if (status === "streaming") Icon = /* @__PURE__ */ jsx(SquareIcon, { className: "size-4" });
+	else if (status === "error") Icon = /* @__PURE__ */ jsx(XIcon, { className: "size-4" });
+	const handleClick = useCallback((e) => {
+		if (isGenerating && onStop) {
+			e.preventDefault();
+			onStop();
+			return;
+		}
+		onClick?.(e);
+	}, [
+		isGenerating,
+		onStop,
+		onClick
+	]);
+	return /* @__PURE__ */ jsx(InputGroupButton, {
+		"aria-label": isGenerating ? "Stop" : "Submit",
+		className: cn(className),
+		onClick: handleClick,
+		size,
+		type: isGenerating && onStop ? "button" : "submit",
+		variant,
+		...props,
+		children: children ?? Icon
+	});
+};
+const PromptInputSelect = (props) => /* @__PURE__ */ jsx(Select, { ...props });
+const PromptInputSelectTrigger = ({ className, ...props }) => /* @__PURE__ */ jsx(SelectTrigger, {
+	className: cn("border-none bg-transparent font-medium text-muted-foreground shadow-none transition-colors", "hover:bg-accent hover:text-foreground aria-expanded:bg-accent aria-expanded:text-foreground", className),
+	...props
+});
+const PromptInputSelectContent = ({ className, ...props }) => /* @__PURE__ */ jsx(SelectContent, {
+	className: cn(className),
+	...props
+});
+const PromptInputSelectItem = ({ className, ...props }) => /* @__PURE__ */ jsx(SelectItem, {
+	className: cn(className),
+	...props
+});
+const PromptInputSelectValue = ({ className, ...props }) => /* @__PURE__ */ jsx(SelectValue, {
+	className: cn(className),
+	...props
+});
+const PromptInputHoverCard = ({ openDelay = 0, closeDelay = 0, ...props }) => /* @__PURE__ */ jsx(HoverCard, {
+	closeDelay,
+	openDelay,
+	...props
+});
+const PromptInputHoverCardTrigger = (props) => /* @__PURE__ */ jsx(HoverCardTrigger, { ...props });
+const PromptInputHoverCardContent = ({ align = "start", ...props }) => /* @__PURE__ */ jsx(HoverCardContent, {
+	align,
+	...props
+});
+const PromptInputTabsList = ({ className, ...props }) => /* @__PURE__ */ jsx("div", {
+	className: cn(className),
+	...props
+});
+const PromptInputTab = ({ className, ...props }) => /* @__PURE__ */ jsx("div", {
+	className: cn(className),
+	...props
+});
+const PromptInputTabLabel = ({ className, ...props }) => /* @__PURE__ */ jsx("h3", {
+	className: cn("mb-2 px-3 font-medium text-muted-foreground text-xs", className),
+	...props
+});
+const PromptInputTabBody = ({ className, ...props }) => /* @__PURE__ */ jsx("div", {
+	className: cn("space-y-1", className),
+	...props
+});
+const PromptInputTabItem = ({ className, ...props }) => /* @__PURE__ */ jsx("div", {
+	className: cn("flex items-center gap-2 px-3 py-2 text-xs hover:bg-accent", className),
+	...props
+});
+const PromptInputCommand = ({ className, ...props }) => /* @__PURE__ */ jsx(Command, {
+	className: cn(className),
+	...props
+});
+const PromptInputCommandInput = ({ className, ...props }) => /* @__PURE__ */ jsx(CommandInput, {
+	className: cn(className),
+	...props
+});
+const PromptInputCommandList = ({ className, ...props }) => /* @__PURE__ */ jsx(CommandList, {
+	className: cn(className),
+	...props
+});
+const PromptInputCommandEmpty = ({ className, ...props }) => /* @__PURE__ */ jsx(CommandEmpty, {
+	className: cn(className),
+	...props
+});
+const PromptInputCommandGroup = ({ className, ...props }) => /* @__PURE__ */ jsx(CommandGroup, {
+	className: cn(className),
+	...props
+});
+const PromptInputCommandItem = ({ className, ...props }) => /* @__PURE__ */ jsx(CommandItem, {
+	className: cn(className),
+	...props
+});
+const PromptInputCommandSeparator = ({ className, ...props }) => /* @__PURE__ */ jsx(CommandSeparator, {
+	className: cn(className),
+	...props
+});
+//#endregion
+export { LocalReferencedSourcesContext, PromptInput, PromptInputActionAddAttachments, PromptInputActionAddScreenshot, PromptInputActionMenu, PromptInputActionMenuContent, PromptInputActionMenuItem, PromptInputActionMenuTrigger, PromptInputBody, PromptInputButton, PromptInputCommand, PromptInputCommandEmpty, PromptInputCommandGroup, PromptInputCommandInput, PromptInputCommandItem, PromptInputCommandList, PromptInputCommandSeparator, PromptInputFooter, PromptInputHeader, PromptInputHoverCard, PromptInputHoverCardContent, PromptInputHoverCardTrigger, PromptInputProvider, PromptInputSelect, PromptInputSelectContent, PromptInputSelectItem, PromptInputSelectTrigger, PromptInputSelectValue, PromptInputSubmit, PromptInputTab, PromptInputTabBody, PromptInputTabItem, PromptInputTabLabel, PromptInputTabsList, PromptInputTextarea, PromptInputTools, usePromptInputAttachments, usePromptInputController, usePromptInputReferencedSources, useProviderAttachments };