import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Icon } from "@powerhousedao/design-system";
import { ConnectTooltip } from "../../tooltip/tooltip.js";
export function Signature(props) {
    const { signatures } = props;
    if (!signatures?.length)
        return null;
    const tooltipContent = (_jsxs("div", { className: "text-xs text-slate-300", children: [_jsx("h3", { className: "mb-2", children: "Signature details:" }), signatures.map((signature, index) => (_jsxs("div", { className: "mb-2 last:mb-0", children: [_jsxs("h4", { children: ["Signature #", index + 1, " -", " ", signature.isVerified ? "verified" : "unverified"] }), _jsx("code", { children: _jsx("pre", { children: JSON.stringify(signature, null, 2) }) })] }, signature.hash)))] }));
    return (_jsx(ConnectTooltip, { content: tooltipContent, children: _jsxs("span", { className: "flex w-fit cursor-pointer items-center gap-1 rounded-lg border border-gray-200 px-2 py-1", children: [_jsx(VerificationStatus, { signatures: signatures }), " ", _jsx(Icon, { className: "text-gray-300", name: "InfoSquare", size: 16 })] }) }));
}
function VerificationStatus(props) {
    const { signatures } = props;
    if (!signatures?.length)
        return null;
    const signatureCount = signatures.length;
    const verifiedSignaturesCount = signatures.filter((signature) => signature.isVerified).length;
    const signatureText = signatureCount === 1 ? "signature" : "signatures";
    const verificationStatusText = `${verifiedSignaturesCount}/${signatureCount} ${signatureText} verified`;
    const color = verifiedSignaturesCount === 0
        ? "text-red-800"
        : verifiedSignaturesCount === signatureCount
            ? "text-green-700"
            : "text-orange-700";
    return _jsx("span", { className: `text-xs ${color}`, children: verificationStatusText });
}
//# sourceMappingURL=signature.js.map