'use client';
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { cn } from '@/lib/utils';
import { CardRenderer, isCardMessage } from '../cards';
export function UserMessage({ content, images, cardActions }) {
    if (isCardMessage(content)) {
        return /*#__PURE__*/ _jsx(CardRenderer, {
            content: content,
            actions: cardActions
        });
    }
    const hasImages = images && images.length > 0;
    return /*#__PURE__*/ _jsx("div", {
        className: cn("aui-user-message-root", "fade-in slide-in-from-bottom-1 animate-in duration-150", "mx-auto grid w-full max-w-[var(--thread-max-width)]", "auto-rows-auto grid-cols-[minmax(72px,1fr)_auto] content-start gap-y-2 px-2 py-3", "[&:where(>*)]:col-start-2"),
        "data-role": "user",
        children: /*#__PURE__*/ _jsx("div", {
            className: "aui-user-message-content-wrapper relative col-start-2 min-w-0",
            children: /*#__PURE__*/ _jsxs("div", {
                className: "aui-user-message-content wrap-break-word rounded-2xl bg-muted px-4 py-2.5 text-foreground",
                children: [
                    hasImages && /*#__PURE__*/ _jsx("div", {
                        className: cn("flex flex-wrap gap-2", content && "mb-2"),
                        children: images.map((img, index)=>/*#__PURE__*/ _jsx("img", {
                                src: img.image,
                                alt: `Attached image ${index + 1}`,
                                className: "max-w-[200px] max-h-[200px] object-contain rounded-lg border border-border/50"
                            }, index))
                    }),
                    content && /*#__PURE__*/ _jsx("p", {
                        className: "whitespace-pre-wrap break-words text-sm leading-relaxed",
                        children: content
                    })
                ]
            })
        })
    });
}
