@websolutespa/ask-ui 1.0.3 → 1.0.5

package/dist/components/accordion.d.mts

@@ -0,0 +1,25 @@
+import { Accordion } from "radix-ui";
+import * as React from "react";
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/components/accordion.d.ts
+declare function Accordion$1({
+  className,
+  ...props
+}: React.ComponentProps<typeof Accordion.Root>): _$react_jsx_runtime0.JSX.Element;
+declare function AccordionItem({
+  className,
+  ...props
+}: React.ComponentProps<typeof Accordion.Item>): _$react_jsx_runtime0.JSX.Element;
+declare function AccordionTrigger({
+  className,
+  children,
+  ...props
+}: React.ComponentProps<typeof Accordion.Trigger>): _$react_jsx_runtime0.JSX.Element;
+declare function AccordionContent({
+  className,
+  children,
+  ...props
+}: React.ComponentProps<typeof Accordion.Content>): _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { Accordion$1 as Accordion, AccordionContent, AccordionItem, AccordionTrigger };

package/dist/components/accordion.mjs

@@ -0,0 +1,55 @@
+"use client";
+import { cn } from "../lib/utils.mjs";
+import { ChevronDownIcon, ChevronUpIcon } from "lucide-react";
+import { Accordion } from "radix-ui";
+import "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/accordion.tsx
+function Accordion$1({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Accordion.Root, {
+		"data-slot": "accordion",
+		className: cn("flex w-full flex-col", className),
+		...props
+	});
+}
+function AccordionItem({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Accordion.Item, {
+		"data-slot": "accordion-item",
+		className: cn("not-last:border-b", className),
+		...props
+	});
+}
+function AccordionTrigger({ className, children, ...props }) {
+	return /* @__PURE__ */ jsx(Accordion.Header, {
+		className: "flex",
+		children: /* @__PURE__ */ jsxs(Accordion.Trigger, {
+			"data-slot": "accordion-trigger",
+			className: cn("group/accordion-trigger relative flex flex-1 items-start justify-between rounded-md border border-transparent py-4 text-left text-sm font-medium transition-all outline-none hover:underline focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 focus-visible:after:border-ring disabled:pointer-events-none disabled:opacity-50 **:data-[slot=accordion-trigger-icon]:ml-auto **:data-[slot=accordion-trigger-icon]:size-4 **:data-[slot=accordion-trigger-icon]:text-muted-foreground", className),
+			...props,
+			children: [
+				children,
+				/* @__PURE__ */ jsx(ChevronDownIcon, {
+					"data-slot": "accordion-trigger-icon",
+					className: "pointer-events-none shrink-0 group-aria-expanded/accordion-trigger:hidden"
+				}),
+				/* @__PURE__ */ jsx(ChevronUpIcon, {
+					"data-slot": "accordion-trigger-icon",
+					className: "pointer-events-none hidden shrink-0 group-aria-expanded/accordion-trigger:inline"
+				})
+			]
+		})
+	});
+}
+function AccordionContent({ className, children, ...props }) {
+	return /* @__PURE__ */ jsx(Accordion.Content, {
+		"data-slot": "accordion-content",
+		className: "overflow-hidden text-sm data-open:animate-accordion-down data-closed:animate-accordion-up",
+		...props,
+		children: /* @__PURE__ */ jsx("div", {
+			className: cn("h-(--radix-accordion-content-height) pt-0 pb-4 [&_a]:underline [&_a]:underline-offset-3 [&_a]:hover:text-foreground [&_p:not(:last-child)]:mb-4", className),
+			children
+		})
+	});
+}
+//#endregion
+export { Accordion$1 as Accordion, AccordionContent, AccordionItem, AccordionTrigger };

package/dist/components/ai-elements/attachments.d.mts

@@ -0,0 +1,94 @@
+import { Button } from "../button.mjs";
+import { HoverCard, HoverCardContent, HoverCardTrigger } from "../hover-card.mjs";
+import { ComponentProps, HTMLAttributes, ReactNode } from "react";
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+import { FileUIPart, SourceDocumentUIPart } from "ai";
+
+//#region src/components/ai-elements/attachments.d.ts
+type AttachmentData = (FileUIPart & {
+  id: string;
+}) | (SourceDocumentUIPart & {
+  id: string;
+});
+type AttachmentMediaCategory = 'image' | 'video' | 'audio' | 'document' | 'source' | 'unknown';
+type AttachmentVariant = 'grid' | 'inline' | 'list';
+declare const getMediaCategory: (data: AttachmentData) => AttachmentMediaCategory;
+declare const getAttachmentLabel: (data: AttachmentData) => string;
+interface AttachmentsContextValue {
+  variant: AttachmentVariant;
+}
+interface AttachmentContextValue {
+  data: AttachmentData;
+  mediaCategory: AttachmentMediaCategory;
+  onRemove?: () => void;
+  variant: AttachmentVariant;
+}
+declare const useAttachmentsContext: () => AttachmentsContextValue;
+declare const useAttachmentContext: () => AttachmentContextValue;
+type AttachmentsProps = HTMLAttributes<HTMLDivElement> & {
+  variant?: AttachmentVariant;
+};
+declare const Attachments: ({
+  variant,
+  className,
+  children,
+  ...props
+}: AttachmentsProps) => _$react_jsx_runtime0.JSX.Element;
+type AttachmentProps = HTMLAttributes<HTMLDivElement> & {
+  data: AttachmentData;
+  onRemove?: () => void;
+};
+declare const Attachment: ({
+  data,
+  onRemove,
+  className,
+  children,
+  ...props
+}: AttachmentProps) => _$react_jsx_runtime0.JSX.Element;
+type AttachmentPreviewProps = HTMLAttributes<HTMLDivElement> & {
+  fallbackIcon?: ReactNode;
+};
+declare const AttachmentPreview: ({
+  fallbackIcon,
+  className,
+  ...props
+}: AttachmentPreviewProps) => _$react_jsx_runtime0.JSX.Element;
+type AttachmentInfoProps = HTMLAttributes<HTMLDivElement> & {
+  showMediaType?: boolean;
+};
+declare const AttachmentInfo: ({
+  showMediaType,
+  className,
+  ...props
+}: AttachmentInfoProps) => _$react_jsx_runtime0.JSX.Element | null;
+type AttachmentRemoveProps = ComponentProps<typeof Button> & {
+  label?: string;
+};
+declare const AttachmentRemove: ({
+  label,
+  className,
+  children,
+  ...props
+}: AttachmentRemoveProps) => _$react_jsx_runtime0.JSX.Element | null;
+type AttachmentHoverCardProps = ComponentProps<typeof HoverCard>;
+declare const AttachmentHoverCard: ({
+  openDelay,
+  closeDelay,
+  ...props
+}: AttachmentHoverCardProps) => _$react_jsx_runtime0.JSX.Element;
+type AttachmentHoverCardTriggerProps = ComponentProps<typeof HoverCardTrigger>;
+declare const AttachmentHoverCardTrigger: (props: AttachmentHoverCardTriggerProps) => _$react_jsx_runtime0.JSX.Element;
+type AttachmentHoverCardContentProps = ComponentProps<typeof HoverCardContent>;
+declare const AttachmentHoverCardContent: ({
+  align,
+  className,
+  ...props
+}: AttachmentHoverCardContentProps) => _$react_jsx_runtime0.JSX.Element;
+type AttachmentEmptyProps = HTMLAttributes<HTMLDivElement>;
+declare const AttachmentEmpty: ({
+  className,
+  children,
+  ...props
+}: AttachmentEmptyProps) => _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { Attachment, AttachmentData, AttachmentEmpty, AttachmentEmptyProps, AttachmentHoverCard, AttachmentHoverCardContent, AttachmentHoverCardContentProps, AttachmentHoverCardProps, AttachmentHoverCardTrigger, AttachmentHoverCardTriggerProps, AttachmentInfo, AttachmentInfoProps, AttachmentMediaCategory, AttachmentPreview, AttachmentPreviewProps, AttachmentProps, AttachmentRemove, AttachmentRemoveProps, AttachmentVariant, Attachments, AttachmentsProps, getAttachmentLabel, getMediaCategory, useAttachmentContext, useAttachmentsContext };

package/dist/components/ai-elements/attachments.mjs

@@ -0,0 +1,174 @@
+"use client";
+import { cn } from "../../lib/utils.mjs";
+import { Button } from "../button.mjs";
+import { HoverCard, HoverCardContent, HoverCardTrigger } from "../hover-card.mjs";
+import { FileTextIcon, GlobeIcon, ImageIcon, Music2Icon, PaperclipIcon, VideoIcon, XIcon } from "lucide-react";
+import { createContext, useCallback, useContext, useMemo } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/ai-elements/attachments.tsx
+const mediaCategoryIcons = {
+	audio: Music2Icon,
+	document: FileTextIcon,
+	image: ImageIcon,
+	source: GlobeIcon,
+	unknown: PaperclipIcon,
+	video: VideoIcon
+};
+const getMediaCategory = (data) => {
+	if (data.type === "source-document") return "source";
+	const mediaType = data.mediaType ?? "";
+	if (mediaType.startsWith("image/")) return "image";
+	if (mediaType.startsWith("video/")) return "video";
+	if (mediaType.startsWith("audio/")) return "audio";
+	if (mediaType.startsWith("application/") || mediaType.startsWith("text/")) return "document";
+	return "unknown";
+};
+const getAttachmentLabel = (data) => {
+	if (data.type === "source-document") return data.title || data.filename || "Source";
+	const category = getMediaCategory(data);
+	return data.filename || (category === "image" ? "Image" : "Attachment");
+};
+const renderAttachmentImage = (url, filename, isGrid) => isGrid ? /* @__PURE__ */ jsx("img", {
+	alt: filename || "Image",
+	className: "size-full object-cover",
+	height: 96,
+	src: url,
+	width: 96
+}) : /* @__PURE__ */ jsx("img", {
+	alt: filename || "Image",
+	className: "size-full rounded object-cover",
+	height: 20,
+	src: url,
+	width: 20
+});
+const AttachmentsContext = createContext(null);
+const AttachmentContext = createContext(null);
+const useAttachmentsContext = () => useContext(AttachmentsContext) ?? { variant: "grid" };
+const useAttachmentContext = () => {
+	const ctx = useContext(AttachmentContext);
+	if (!ctx) throw new Error("Attachment components must be used within <Attachment>");
+	return ctx;
+};
+const Attachments = ({ variant = "grid", className, children, ...props }) => {
+	const contextValue = useMemo(() => ({ variant }), [variant]);
+	return /* @__PURE__ */ jsx(AttachmentsContext.Provider, {
+		value: contextValue,
+		children: /* @__PURE__ */ jsx("div", {
+			className: cn("flex items-start", variant === "list" ? "flex-col gap-2" : "flex-wrap gap-2", variant === "grid" && "ml-auto w-fit", className),
+			...props,
+			children
+		})
+	});
+};
+const Attachment = ({ data, onRemove, className, children, ...props }) => {
+	const { variant } = useAttachmentsContext();
+	const mediaCategory = getMediaCategory(data);
+	const contextValue = useMemo(() => ({
+		data,
+		mediaCategory,
+		onRemove,
+		variant
+	}), [
+		data,
+		mediaCategory,
+		onRemove,
+		variant
+	]);
+	return /* @__PURE__ */ jsx(AttachmentContext.Provider, {
+		value: contextValue,
+		children: /* @__PURE__ */ jsx("div", {
+			className: cn("group relative", variant === "grid" && "size-24 overflow-hidden rounded-lg", variant === "inline" && [
+				"flex h-8 cursor-pointer select-none items-center gap-1.5",
+				"rounded-md border border-border px-1.5",
+				"font-medium text-sm transition-all",
+				"hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50"
+			], variant === "list" && ["flex w-full items-center gap-3 rounded-lg border p-3", "hover:bg-accent/50"], className),
+			...props,
+			children
+		})
+	});
+};
+const AttachmentPreview = ({ fallbackIcon, className, ...props }) => {
+	const { data, mediaCategory, variant } = useAttachmentContext();
+	const iconSize = variant === "inline" ? "size-3" : "size-4";
+	const renderIcon = (Icon) => /* @__PURE__ */ jsx(Icon, { className: cn(iconSize, "text-muted-foreground") });
+	const renderContent = () => {
+		if (mediaCategory === "image" && data.type === "file" && data.url) return renderAttachmentImage(data.url, data.filename, variant === "grid");
+		if (mediaCategory === "video" && data.type === "file" && data.url) return /* @__PURE__ */ jsx("video", {
+			className: "size-full object-cover",
+			muted: true,
+			src: data.url
+		});
+		const Icon = mediaCategoryIcons[mediaCategory];
+		return fallbackIcon ?? renderIcon(Icon);
+	};
+	return /* @__PURE__ */ jsx("div", {
+		className: cn("flex shrink-0 items-center justify-center overflow-hidden", variant === "grid" && "size-full bg-muted", variant === "inline" && "size-5 rounded bg-background", variant === "list" && "size-12 rounded bg-muted", className),
+		...props,
+		children: renderContent()
+	});
+};
+const AttachmentInfo = ({ showMediaType = false, className, ...props }) => {
+	const { data, variant } = useAttachmentContext();
+	const label = getAttachmentLabel(data);
+	if (variant === "grid") return null;
+	return /* @__PURE__ */ jsxs("div", {
+		className: cn("min-w-0 flex-1", className),
+		...props,
+		children: [/* @__PURE__ */ jsx("span", {
+			className: "block truncate",
+			children: label
+		}), showMediaType && data.mediaType && /* @__PURE__ */ jsx("span", {
+			className: "block truncate text-muted-foreground text-xs",
+			children: data.mediaType
+		})]
+	});
+};
+const AttachmentRemove = ({ label = "Remove", className, children, ...props }) => {
+	const { onRemove, variant } = useAttachmentContext();
+	const handleClick = useCallback((e) => {
+		e.stopPropagation();
+		onRemove?.();
+	}, [onRemove]);
+	if (!onRemove) return null;
+	return /* @__PURE__ */ jsxs(Button, {
+		"aria-label": label,
+		className: cn(variant === "grid" && [
+			"absolute top-2 right-2 size-6 rounded-full p-0",
+			"bg-background/80 backdrop-blur-sm",
+			"opacity-0 transition-opacity group-hover:opacity-100",
+			"hover:bg-background",
+			"[&>svg]:size-3"
+		], variant === "inline" && [
+			"size-5 rounded p-0",
+			"opacity-0 transition-opacity group-hover:opacity-100",
+			"[&>svg]:size-2.5"
+		], variant === "list" && ["size-8 shrink-0 rounded p-0", "[&>svg]:size-4"], className),
+		onClick: handleClick,
+		type: "button",
+		variant: "ghost",
+		...props,
+		children: [children ?? /* @__PURE__ */ jsx(XIcon, {}), /* @__PURE__ */ jsx("span", {
+			className: "sr-only",
+			children: label
+		})]
+	});
+};
+const AttachmentHoverCard = ({ openDelay = 0, closeDelay = 0, ...props }) => /* @__PURE__ */ jsx(HoverCard, {
+	closeDelay,
+	openDelay,
+	...props
+});
+const AttachmentHoverCardTrigger = (props) => /* @__PURE__ */ jsx(HoverCardTrigger, { ...props });
+const AttachmentHoverCardContent = ({ align = "start", className, ...props }) => /* @__PURE__ */ jsx(HoverCardContent, {
+	align,
+	className: cn("w-auto p-2", className),
+	...props
+});
+const AttachmentEmpty = ({ className, children, ...props }) => /* @__PURE__ */ jsx("div", {
+	className: cn("flex items-center justify-center p-4 text-muted-foreground text-sm", className),
+	...props,
+	children: children ?? "No attachments"
+});
+//#endregion
+export { Attachment, AttachmentEmpty, AttachmentHoverCard, AttachmentHoverCardContent, AttachmentHoverCardTrigger, AttachmentInfo, AttachmentPreview, AttachmentRemove, Attachments, getAttachmentLabel, getMediaCategory, useAttachmentContext, useAttachmentsContext };

package/dist/components/ai-elements/conversation.d.mts

@@ -0,0 +1,51 @@
+import { Button } from "../button.mjs";
+import { ComponentProps } from "react";
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+import { StickToBottom } from "use-stick-to-bottom";
+import { UIMessage } from "ai";
+
+//#region src/components/ai-elements/conversation.d.ts
+type ConversationProps = ComponentProps<typeof StickToBottom>;
+declare const Conversation: ({
+  className,
+  ...props
+}: ConversationProps) => _$react_jsx_runtime0.JSX.Element;
+type ConversationContentProps = ComponentProps<typeof StickToBottom.Content>;
+declare const ConversationContent: ({
+  className,
+  ...props
+}: ConversationContentProps) => _$react_jsx_runtime0.JSX.Element;
+type ConversationEmptyStateProps = ComponentProps<'div'> & {
+  title?: string;
+  description?: string;
+  icon?: React.ReactNode;
+};
+declare const ConversationEmptyState: ({
+  className,
+  title,
+  description,
+  icon,
+  children,
+  ...props
+}: ConversationEmptyStateProps) => _$react_jsx_runtime0.JSX.Element;
+type ConversationScrollButtonProps = ComponentProps<typeof Button>;
+declare const ConversationScrollButton: ({
+  className,
+  ...props
+}: ConversationScrollButtonProps) => false | _$react_jsx_runtime0.JSX.Element;
+type ConversationDownloadProps = Omit<ComponentProps<typeof Button>, 'onClick'> & {
+  messages: UIMessage[];
+  filename?: string;
+  formatMessage?: (message: UIMessage, index: number) => string;
+};
+declare const messagesToMarkdown: (messages: UIMessage[], formatMessage?: (message: UIMessage, index: number) => string) => string;
+declare const ConversationDownload: ({
+  messages,
+  filename,
+  formatMessage,
+  className,
+  children,
+  ...props
+}: ConversationDownloadProps) => _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { Conversation, ConversationContent, ConversationContentProps, ConversationDownload, ConversationDownloadProps, ConversationEmptyState, ConversationEmptyStateProps, ConversationProps, ConversationScrollButton, ConversationScrollButtonProps, messagesToMarkdown };

package/dist/components/ai-elements/conversation.mjs

@@ -0,0 +1,85 @@
+"use client";
+import { cn } from "../../lib/utils.mjs";
+import { Button } from "../button.mjs";
+import { ArrowDownIcon, DownloadIcon } from "lucide-react";
+import { useCallback } from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { StickToBottom, useStickToBottomContext } from "use-stick-to-bottom";
+//#region src/components/ai-elements/conversation.tsx
+const Conversation = ({ className, ...props }) => /* @__PURE__ */ jsx(StickToBottom, {
+	className: cn("relative flex-1 overflow-y-hidden", className),
+	initial: "smooth",
+	resize: "smooth",
+	role: "log",
+	...props
+});
+const ConversationContent = ({ className, ...props }) => /* @__PURE__ */ jsx(StickToBottom.Content, {
+	className: cn("flex flex-col gap-8 p-4", className),
+	...props
+});
+const ConversationEmptyState = ({ className, title = "No messages yet", description = "Start a conversation to see messages here", icon, children, ...props }) => /* @__PURE__ */ jsx("div", {
+	className: cn("flex size-full flex-col items-center justify-center gap-3 p-8 text-center", className),
+	...props,
+	children: children ?? /* @__PURE__ */ jsxs(Fragment, { children: [icon && /* @__PURE__ */ jsx("div", {
+		className: "text-muted-foreground",
+		children: icon
+	}), /* @__PURE__ */ jsxs("div", {
+		className: "space-y-1",
+		children: [/* @__PURE__ */ jsx("h3", {
+			className: "font-medium text-sm",
+			children: title
+		}), description && /* @__PURE__ */ jsx("p", {
+			className: "text-muted-foreground text-sm",
+			children: description
+		})]
+	})] })
+});
+const ConversationScrollButton = ({ className, ...props }) => {
+	const { isAtBottom, scrollToBottom } = useStickToBottomContext();
+	const handleScrollToBottom = useCallback(() => {
+		scrollToBottom();
+	}, [scrollToBottom]);
+	return !isAtBottom && /* @__PURE__ */ jsx(Button, {
+		className: cn("absolute bottom-4 left-[50%] translate-x-[-50%] rounded-full dark:bg-background dark:hover:bg-muted", className),
+		onClick: handleScrollToBottom,
+		size: "icon",
+		type: "button",
+		variant: "outline",
+		...props,
+		children: /* @__PURE__ */ jsx(ArrowDownIcon, { className: "size-4" })
+	});
+};
+const getMessageText = (message) => message.parts.filter((part) => part.type === "text").map((part) => part.text).join("");
+const defaultFormatMessage = (message) => {
+	return `**${message.role.charAt(0).toUpperCase() + message.role.slice(1)}:** ${getMessageText(message)}`;
+};
+const messagesToMarkdown = (messages, formatMessage = defaultFormatMessage) => messages.map((msg, i) => formatMessage(msg, i)).join("\n\n");
+const ConversationDownload = ({ messages, filename = "conversation.md", formatMessage = defaultFormatMessage, className, children, ...props }) => {
+	const handleDownload = useCallback(() => {
+		const markdown = messagesToMarkdown(messages, formatMessage);
+		const blob = new Blob([markdown], { type: "text/markdown" });
+		const url = URL.createObjectURL(blob);
+		const link = document.createElement("a");
+		link.href = url;
+		link.download = filename;
+		document.body.append(link);
+		link.click();
+		link.remove();
+		URL.revokeObjectURL(url);
+	}, [
+		messages,
+		filename,
+		formatMessage
+	]);
+	return /* @__PURE__ */ jsx(Button, {
+		className: cn("absolute top-4 right-4 rounded-full dark:bg-background dark:hover:bg-muted", className),
+		onClick: handleDownload,
+		size: "icon",
+		type: "button",
+		variant: "outline",
+		...props,
+		children: children ?? /* @__PURE__ */ jsx(DownloadIcon, { className: "size-4" })
+	});
+};
+//#endregion
+export { Conversation, ConversationContent, ConversationDownload, ConversationEmptyState, ConversationScrollButton, messagesToMarkdown };

package/dist/components/ai-elements/message.d.mts

@@ -0,0 +1,89 @@
+import { Button } from "../button.mjs";
+import { ButtonGroup } from "../button-group.mjs";
+import * as _$react from "react";
+import { ComponentProps, HTMLAttributes } from "react";
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+import { Streamdown } from "streamdown";
+import { UIMessage } from "ai";
+
+//#region src/components/ai-elements/message.d.ts
+type MessageProps = HTMLAttributes<HTMLDivElement> & {
+  from: UIMessage['role'];
+};
+declare const Message: ({
+  className,
+  from,
+  ...props
+}: MessageProps) => _$react_jsx_runtime0.JSX.Element;
+type MessageContentProps = HTMLAttributes<HTMLDivElement>;
+declare const MessageContent: ({
+  children,
+  className,
+  ...props
+}: MessageContentProps) => _$react_jsx_runtime0.JSX.Element;
+type MessageActionsProps = ComponentProps<'div'>;
+declare const MessageActions: ({
+  className,
+  children,
+  ...props
+}: MessageActionsProps) => _$react_jsx_runtime0.JSX.Element;
+type MessageActionProps = ComponentProps<typeof Button> & {
+  tooltip?: string;
+  label?: string;
+};
+declare const MessageAction: ({
+  tooltip,
+  children,
+  label,
+  variant,
+  size,
+  ...props
+}: MessageActionProps) => _$react_jsx_runtime0.JSX.Element;
+type MessageBranchProps = HTMLAttributes<HTMLDivElement> & {
+  defaultBranch?: number;
+  onBranchChange?: (branchIndex: number) => void;
+};
+declare const MessageBranch: ({
+  defaultBranch,
+  onBranchChange,
+  className,
+  ...props
+}: MessageBranchProps) => _$react_jsx_runtime0.JSX.Element;
+type MessageBranchContentProps = HTMLAttributes<HTMLDivElement>;
+declare const MessageBranchContent: ({
+  children,
+  ...props
+}: MessageBranchContentProps) => _$react_jsx_runtime0.JSX.Element[];
+type MessageBranchSelectorProps = ComponentProps<typeof ButtonGroup>;
+declare const MessageBranchSelector: ({
+  className,
+  ...props
+}: MessageBranchSelectorProps) => _$react_jsx_runtime0.JSX.Element | null;
+type MessageBranchPreviousProps = ComponentProps<typeof Button>;
+declare const MessageBranchPrevious: ({
+  children,
+  ...props
+}: MessageBranchPreviousProps) => _$react_jsx_runtime0.JSX.Element;
+type MessageBranchNextProps = ComponentProps<typeof Button>;
+declare const MessageBranchNext: ({
+  children,
+  ...props
+}: MessageBranchNextProps) => _$react_jsx_runtime0.JSX.Element;
+type MessageBranchPageProps = HTMLAttributes<HTMLSpanElement>;
+declare const MessageBranchPage: ({
+  className,
+  ...props
+}: MessageBranchPageProps) => _$react_jsx_runtime0.JSX.Element;
+type MessageResponseProps = ComponentProps<typeof Streamdown>;
+declare const MessageResponse: _$react.MemoExoticComponent<({
+  className,
+  ...props
+}: MessageResponseProps) => _$react_jsx_runtime0.JSX.Element>;
+type MessageToolbarProps = ComponentProps<'div'>;
+declare const MessageToolbar: ({
+  className,
+  children,
+  ...props
+}: MessageToolbarProps) => _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { Message, MessageAction, MessageActionProps, MessageActions, MessageActionsProps, MessageBranch, MessageBranchContent, MessageBranchContentProps, MessageBranchNext, MessageBranchNextProps, MessageBranchPage, MessageBranchPageProps, MessageBranchPrevious, MessageBranchPreviousProps, MessageBranchProps, MessageBranchSelector, MessageBranchSelectorProps, MessageContent, MessageContentProps, MessageProps, MessageResponse, MessageResponseProps, MessageToolbar, MessageToolbarProps };