import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
// (C) 2025 GoodData Corporation
import { useState } from "react";
import cx from "classnames";
import { v4 as uuid } from "uuid";
import { Message } from "../Message.js";
export function ToastsCenterMessage({ message, onRemove }) {
    const [isExpanded, setIsExpanded] = useState(false);
    const { component: Component, type, contrast, intensive } = message;
    return (_jsx(Message, { className: "gd-message-overlay", type: type, onClose: onRemove, contrast: contrast, intensive: intensive, children: Component ? (_jsx(Component, {})) : (_jsxs(_Fragment, { children: [
                _jsx(MessageWithShowMore, { message: message, shouldShowMore: !isExpanded, handleShowMore: () => setIsExpanded((wasExpanded) => !wasExpanded) }), _jsx(MessageSimple, { message: message })
            ] })) }));
}
export function MessageWithShowMore({ message, shouldShowMore, handleShowMore }) {
    const { showMore, showLess, errorDetail, type } = message;
    if (!showMore) {
        return null;
    }
    const contentClassNames = cx("gd-message-text-content", "s-message-text-content", type, {
        off: shouldShowMore,
        on: !shouldShowMore,
    });
    const showMoreLinkClassNames = cx("gd-message-text-showmorelink", "s-message-text-showmorelink", type);
    const accessibilityId = uuid();
    return (_jsxs("div", { className: "gd-message-text-showmore", children: [
            _jsx(MessageElement, { message: message, type: "span" }), _jsx("button", { "aria-expanded": shouldShowMore ? "false" : "true", "aria-controls": accessibilityId, className: showMoreLinkClassNames, onClick: handleShowMore, children: shouldShowMore ? showMore : showLess }), _jsx("div", { id: accessibilityId, className: contentClassNames, children: errorDetail })
        ] }));
}
export function MessageSimple({ message }) {
    const { showMore } = message;
    if (showMore) {
        return null;
    }
    return _jsx(MessageElement, { message: message, type: "div" });
}
export function MessageElement({ message, type }) {
    const { text, node } = message;
    const Component = type;
    if (node) {
        return _jsx(Component, { className: "s-message-text-header-value", children: node });
    }
    return (_jsx(Component, { className: "s-message-text-header-value", dangerouslySetInnerHTML: { __html: text || "" } }));
}
/**
 * @internal
 */
export function ToastMessageList({ messages, onRemoveMessage, }) {
    return (_jsx(_Fragment, { children: messages.map((message) => (_jsx(ToastsCenterMessage, { message: message, onRemove: () => onRemoveMessage?.(message.id) }, message.id))) }));
}
