import { cn } from "./index3.js";
import { Avatar } from "./index15.js";
import { createSafeContext } from "./index21.js";
import { FileTypeIcon } from "./index383.js";
import { AIInteractionProvider } from "./index407.js";
import { MarkdownRenderer } from "./index417.js";
import { AITypingIndicator } from "./index418.js";
import { cva } from "class-variance-authority";
import { Check, Copy, List, ThumbsDown, ThumbsUp } from "lucide-react";
import * as React from "react";
import { forwardRef } from "react";
import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
//#region src/components/organisms/ai/AIMessage/AIMessage.tsx
var messageVariants = cva("flex items-start w-full", {
	variants: { type: {
		received: "justify-start",
		sent: "justify-end"
	} },
	defaultVariants: { type: "received" }
});
var messageBubbleVariants = cva("flex flex-col gap-1 overflow-hidden px-4 py-3 rounded-2xl max-w-[720px] min-w-[100px]", {
	variants: { type: {
		received: "bg-muted",
		sent: "bg-[var(--sent-bubble)] text-primary-foreground"
	} },
	defaultVariants: { type: "received" }
});
var [AIMessageContext, useAIMessageContext] = createSafeContext("AIMessage");
function AIMessageBubble({ children, className }) {
	const type = React.useContext(AIMessageContext)?.type ?? "received";
	return /* @__PURE__ */ jsx("div", {
		"data-slot": "ai-message-bubble",
		"data-message-type": type,
		className: cn(messageBubbleVariants({ type }), className),
		children
	});
}
AIMessageBubble.displayName = "AIMessage.Bubble";
function ReactionButton({ icon, onClick, active, count, label, className }) {
	return /* @__PURE__ */ jsxs("button", {
		type: "button",
		onClick,
		"aria-label": label,
		"aria-pressed": active,
		className: cn("flex items-center justify-center gap-1 px-2.5 py-2 min-w-11 min-h-11 rounded-full bg-muted hover:bg-accent delight-click-ripple transition-all duration-150 ease-out hover:scale-110 active:scale-95 motion-reduce:hover:scale-100 motion-reduce:active:scale-100 focus-visible:outline-2 focus-visible:outline-offset-1 focus-visible:outline-ring", active && "bg-primary/10 text-primary delight-check-bounce motion-reduce:!animate-none", className),
		children: [icon, count !== void 0 && count > 0 && /* @__PURE__ */ jsx("span", {
			className: "text-xs font-medium text-muted-foreground",
			children: count
		})]
	});
}
function AIMessageReactions({ reactions, onReactionClick, className }) {
	if (!reactions?.length) return null;
	return /* @__PURE__ */ jsx("div", {
		"data-slot": "ai-message-reactions",
		className: cn("flex items-center gap-1", className),
		children: reactions.map((reaction) => /* @__PURE__ */ jsxs("button", {
			type: "button",
			onClick: () => onReactionClick?.(reaction.emoji),
			"aria-label": `React with ${reaction.emoji}${reaction.count > 1 ? `, ${reaction.count} reactions` : ""}`,
			"aria-pressed": reaction.reacted,
			className: cn("flex items-center gap-1 px-2.5 py-1.5 min-h-11 rounded-full bg-muted hover:bg-accent text-sm transition-colors focus-visible:outline-2 focus-visible:outline-offset-1 focus-visible:outline-ring", reaction.reacted && "bg-primary/10"),
			children: [/* @__PURE__ */ jsx("span", {
				"aria-hidden": "true",
				children: reaction.emoji
			}), reaction.count > 1 && /* @__PURE__ */ jsx("span", {
				className: "text-xs text-muted-foreground",
				children: reaction.count
			})]
		}, reaction.emoji))
	});
}
AIMessageReactions.displayName = "AIMessage.Reactions";
function AIMessageThumbsUp({ onClick, active, className }) {
	return /* @__PURE__ */ jsx(ReactionButton, {
		icon: /* @__PURE__ */ jsx(ThumbsUp, {
			className: "size-4 text-quaternary-foreground",
			"aria-hidden": "true"
		}),
		onClick,
		active,
		label: "Thumbs up",
		className
	});
}
AIMessageThumbsUp.displayName = "AIMessage.ThumbsUp";
function AIMessageThumbsDown({ onClick, active, className }) {
	return /* @__PURE__ */ jsx(ReactionButton, {
		icon: /* @__PURE__ */ jsx(ThumbsDown, {
			className: "size-4 text-quaternary-foreground",
			"aria-hidden": "true"
		}),
		onClick,
		active,
		label: "Thumbs down",
		className
	});
}
AIMessageThumbsDown.displayName = "AIMessage.ThumbsDown";
function AIMessageCopyButton({ onClick, className }) {
	const [copied, setCopied] = React.useState(false);
	const timerRef = React.useRef(void 0);
	React.useEffect(() => () => clearTimeout(timerRef.current), []);
	const handleClick = React.useCallback(() => {
		onClick?.();
		setCopied(true);
		clearTimeout(timerRef.current);
		timerRef.current = setTimeout(() => setCopied(false), 2e3);
	}, [onClick]);
	return /* @__PURE__ */ jsx(ReactionButton, {
		icon: copied ? /* @__PURE__ */ jsx(Check, {
			className: "size-4 text-success delight-bounce-in motion-reduce:animate-none",
			"aria-hidden": "true"
		}) : /* @__PURE__ */ jsx(Copy, {
			className: "size-4 text-secondary-foreground",
			"aria-hidden": "true"
		}),
		onClick: handleClick,
		label: copied ? "Copied to clipboard" : "Copy message",
		className
	});
}
AIMessageCopyButton.displayName = "AIMessage.CopyButton";
function AIMessageListButton({ onClick, className }) {
	return /* @__PURE__ */ jsx(ReactionButton, {
		icon: /* @__PURE__ */ jsx(List, {
			className: "size-4 text-secondary-foreground",
			"aria-hidden": "true"
		}),
		onClick,
		label: "Show list",
		className
	});
}
AIMessageListButton.displayName = "AIMessage.ListButton";
function AIMessageActions({ children, className }) {
	const ctx = React.useContext(AIMessageContext);
	return /* @__PURE__ */ jsx("div", {
		"data-slot": "ai-message-actions",
		role: "toolbar",
		"aria-label": "Message actions",
		className: cn("flex items-center gap-0.5 rounded-full overflow-hidden", className),
		children: children ?? (ctx && /* @__PURE__ */ jsxs(Fragment$1, { children: [
			/* @__PURE__ */ jsx(AIMessageThumbsUp, {
				onClick: ctx.onThumbsUp,
				active: ctx.thumbsUpActive
			}),
			/* @__PURE__ */ jsx(AIMessageThumbsDown, {
				onClick: ctx.onThumbsDown,
				active: ctx.thumbsDownActive
			}),
			/* @__PURE__ */ jsx(AIMessageCopyButton, { onClick: ctx.onCopy }),
			/* @__PURE__ */ jsx(AIMessageListButton, { onClick: ctx.onShowList })
		] }))
	});
}
AIMessageActions.displayName = "AIMessage.Actions";
function AIMessageTypingIndicator({ className }) {
	return /* @__PURE__ */ jsx("div", {
		"data-slot": "ai-message-typing-indicator",
		className: cn("flex items-center gap-1 motion-reduce:animate-none", className),
		children: /* @__PURE__ */ jsx(AITypingIndicator, {
			size: "sm",
			color: "var(--muted-foreground)"
		})
	});
}
AIMessageTypingIndicator.displayName = "AIMessage.TypingIndicator";
function AIMessageAttachmentPreview({ attachment, messageType = "received", onClick, className }) {
	const getExtension = () => {
		if (attachment.extension) return attachment.extension;
		const parts = attachment.name.split(".");
		if (parts.length > 1) return parts[parts.length - 1];
		return "";
	};
	const extension = getExtension();
	const bubbleClasses = messageType === "sent" ? "bg-primary/10 border border-primary-foreground/20 rounded-2xl" : "bg-muted rounded-2xl";
	return /* @__PURE__ */ jsxs("button", {
		type: "button",
		"data-slot": "ai-message-attachment-preview",
		onClick,
		"aria-label": `Attachment: ${attachment.name}, ${attachment.size}`,
		className: cn("flex items-center gap-3 p-3 min-h-11 hover:bg-accent transition-colors w-full max-w-[320px] focus-visible:outline-2 focus-visible:outline-offset-1 focus-visible:outline-ring", bubbleClasses, className),
		children: [attachment.thumbnailUrl ? /* @__PURE__ */ jsx("img", {
			src: attachment.thumbnailUrl,
			alt: attachment.name,
			className: "size-10 rounded-md object-cover"
		}) : /* @__PURE__ */ jsx(FileTypeIcon, {
			extension,
			size: "md",
			className: "shrink-0"
		}), /* @__PURE__ */ jsxs("div", {
			className: "flex flex-col items-start min-w-0",
			children: [/* @__PURE__ */ jsx("span", {
				className: "text-sm font-medium text-secondary-foreground truncate w-full",
				children: attachment.name
			}), /* @__PURE__ */ jsx("span", {
				className: "text-sm text-muted-foreground",
				children: attachment.size
			})]
		})]
	});
}
AIMessageAttachmentPreview.displayName = "AIMessage.AttachmentPreview";
function AIMessageAttachments({ attachments, messageType = "received", onAttachmentClick, className }) {
	if (!attachments?.length) return null;
	return /* @__PURE__ */ jsx("div", {
		"data-slot": "ai-message-attachments",
		className: cn("flex flex-col gap-2 mt-1", className),
		children: attachments.map((attachment) => /* @__PURE__ */ jsx(AIMessageAttachmentPreview, {
			attachment,
			messageType,
			onClick: () => onAttachmentClick?.(attachment)
		}, attachment.id))
	});
}
AIMessageAttachments.displayName = "AIMessage.Attachments";
function AIMessageAvatar({ isAgent, ...props }) {
	return /* @__PURE__ */ jsx(Avatar, {
		"data-slot": "ai-message-avatar",
		...props,
		size: "md",
		indicator: isAgent ? "verified" : props.indicator
	});
}
AIMessageAvatar.displayName = "AIMessage.Avatar";
function AIMessageContent({ children, content, markdown, onInteraction, className }) {
	const type = React.useContext(AIMessageContext)?.type ?? "received";
	const isSent = type === "sent";
	const shouldRenderMarkdown = markdown ?? type === "received";
	const textContent = content ?? (typeof children === "string" ? children : "");
	const variant = isSent ? "inverted" : "default";
	return /* @__PURE__ */ jsx("div", {
		"data-slot": "ai-message-content",
		className: cn("w-full", className),
		children: shouldRenderMarkdown && textContent ? /* @__PURE__ */ jsx(AIInteractionProvider, {
			onInteraction,
			children: /* @__PURE__ */ jsx(MarkdownRenderer, {
				variant,
				className: cn("text-base", isSent ? "text-primary-foreground" : "text-foreground"),
				children: textContent
			})
		}) : textContent ? /* @__PURE__ */ jsx("p", {
			className: cn("text-base whitespace-pre-wrap", isSent ? "text-primary-foreground" : "text-foreground"),
			children: textContent
		}) : children
	});
}
AIMessageContent.displayName = "AIMessage.Content";
function AIMessageHeader({ senderName, timestamp, avatar, className }) {
	const ctx = React.useContext(AIMessageContext);
	const isSent = ctx?.type === "sent";
	if (ctx?.compact ?? false) return null;
	return /* @__PURE__ */ jsxs("div", {
		"data-slot": "ai-message-header",
		className: cn("flex items-center justify-between w-full", className),
		children: [/* @__PURE__ */ jsxs("div", {
			className: "flex items-center gap-2 min-w-0 flex-1",
			children: [avatar && /* @__PURE__ */ jsx("div", {
				className: "shrink-0",
				children: avatar
			}), /* @__PURE__ */ jsx("span", {
				className: cn("text-sm font-medium truncate", isSent ? "text-primary-foreground" : "text-secondary-foreground"),
				children: isSent ? "You" : senderName
			})]
		}), timestamp && /* @__PURE__ */ jsx("span", {
			className: cn("text-xs shrink-0", isSent ? "text-primary-foreground/90" : "text-muted-foreground"),
			children: timestamp
		})]
	});
}
AIMessageHeader.displayName = "AIMessage.Header";
var AIMessageRoot = forwardRef(({ type = "received", isAgent = false, compact = false, isTyping = false, onThumbsUp, onThumbsDown, onCopy, onShowList, thumbsUpActive, thumbsDownActive, children, className, ...props }, ref) => {
	const isSent = type === "sent";
	const contextValue = React.useMemo(() => ({
		type,
		isAgent,
		compact,
		isTyping,
		onThumbsUp,
		onThumbsDown,
		onCopy,
		onShowList,
		thumbsUpActive,
		thumbsDownActive
	}), [
		type,
		isAgent,
		compact,
		isTyping,
		onThumbsUp,
		onThumbsDown,
		onCopy,
		onShowList,
		thumbsUpActive,
		thumbsDownActive
	]);
	return /* @__PURE__ */ jsx(AIMessageContext.Provider, {
		value: contextValue,
		children: /* @__PURE__ */ jsx("div", {
			ref,
			"data-slot": "ai-message",
			className: cn(messageVariants({ type }), isSent ? "pe-2" : "ps-0", isSent ? "delight-slide-in-end" : "delight-slide-up", className),
			...props,
			children: /* @__PURE__ */ jsx("div", {
				className: cn("flex flex-col gap-1.5 items-start", isSent && "items-end"),
				children
			})
		})
	});
});
AIMessageRoot.displayName = "AIMessage.Root";
var AIMessageDefault = forwardRef(({ type = "received", content, senderName, timestamp, avatar, isAgent = false, compact = false, isTyping = false, markdown, onInteraction, attachments, reactions, showActions = false, onThumbsUp, onThumbsDown, onCopy, onShowList, onReactionClick, onAttachmentClick, thumbsUpActive, thumbsDownActive, className, ...props }, ref) => {
	return /* @__PURE__ */ jsxs(AIMessageRoot, {
		ref,
		type,
		isAgent,
		compact,
		isTyping,
		onThumbsUp,
		onThumbsDown,
		onCopy,
		onShowList,
		thumbsUpActive,
		thumbsDownActive,
		className,
		...props,
		children: [
			type !== "sent" && !compact && avatar && (React.isValidElement(avatar) ? avatar : /* @__PURE__ */ jsx(AIMessageAvatar, {
				...avatar,
				isAgent
			})),
			/* @__PURE__ */ jsxs(AIMessageBubble, { children: [type !== "sent" && /* @__PURE__ */ jsx(AIMessageHeader, {
				senderName,
				timestamp
			}), isTyping ? /* @__PURE__ */ jsx(AIMessageTypingIndicator, {}) : content && /* @__PURE__ */ jsx(AIMessageContent, {
				content,
				markdown,
				onInteraction
			})] }),
			!isTyping && attachments && attachments.length > 0 && /* @__PURE__ */ jsx(AIMessageAttachments, {
				attachments,
				messageType: type ?? "received",
				onAttachmentClick
			}),
			!isTyping && (showActions || reactions?.length) && /* @__PURE__ */ jsxs("div", {
				className: "flex items-center gap-1",
				children: [showActions && isAgent && /* @__PURE__ */ jsx(AIMessageActions, {}), reactions && reactions.length > 0 && /* @__PURE__ */ jsx(AIMessageReactions, {
					reactions,
					onReactionClick
				})]
			})
		]
	});
});
AIMessageDefault.displayName = "AIMessage";
/**
* AIMessage - Dual-API component for AI chat messages.
*
* Supports two usage patterns:
*
* 1. **Monolithic API (batteries-included)**:
* ```tsx
* <AIMessage
*   content="Hello!"
*   senderName="Assistant"
*   avatar={{ src: '...' }}
*   isAgent
*   showActions
* />
* ```
*
* 2. **Composable API (full customization)**:
* ```tsx
* <AIMessage.Root type="received" isAgent>
*   <AIMessage.Avatar src="..." isAgent />
*   <AIMessage.Bubble>
*     <AIMessage.Header senderName="Assistant" timestamp="Now" />
*     <AIMessage.Content markdown>
*       Hello!
*     </AIMessage.Content>
*   </AIMessage.Bubble>
*   <AIMessage.Actions>
*     <AIMessage.ThumbsUp onClick={...} />
*     <AIMessage.ThumbsDown onClick={...} />
*     <AIMessage.CopyButton onClick={...} />
*   </AIMessage.Actions>
* </AIMessage.Root>
* ```
*/
var AIMessage = Object.assign(AIMessageDefault, {
	Root: AIMessageRoot,
	Bubble: AIMessageBubble,
	Header: AIMessageHeader,
	Avatar: AIMessageAvatar,
	Content: AIMessageContent,
	Actions: AIMessageActions,
	Reactions: AIMessageReactions,
	Attachments: AIMessageAttachments,
	AttachmentPreview: AIMessageAttachmentPreview,
	TypingIndicator: AIMessageTypingIndicator,
	CopyButton: AIMessageCopyButton,
	ThumbsUp: AIMessageThumbsUp,
	ThumbsDown: AIMessageThumbsDown,
	ListButton: AIMessageListButton
});
//#endregion
export { AIMessage, AIMessageActions, AIMessageAttachmentPreview, AIMessageAttachments, AIMessageAvatar, AIMessageBubble, AIMessageContent, AIMessageCopyButton, AIMessageHeader, AIMessageListButton, AIMessageReactions, AIMessageRoot, AIMessageThumbsDown, AIMessageThumbsUp, AIMessageTypingIndicator, messageBubbleVariants, messageVariants, useAIMessageContext };

//# sourceMappingURL=index419.js.map