import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Tooltip, TooltipContent, TooltipTrigger } from '../../ui/tooltip';
import { cn } from '../../../lib/utils';
import { featureStatusConfig, featureStatusOrder, } from '../../common/feature-status-config';
export function FeatureStatusBadges({ counts, className }) {
    const visibleStatuses = featureStatusOrder.filter((s) => counts[s] > 0);
    if (visibleStatuses.length === 0)
        return null;
    return (_jsx("div", { "data-testid": "feature-status-badges", className: cn('flex flex-col items-center gap-1.5 py-1', className), children: visibleStatuses.map((status) => {
            const { icon: Icon, iconClass, bgClass, label } = featureStatusConfig[status];
            return (_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsxs("div", { "data-testid": `feature-status-badge-${status}`, className: cn('flex size-8 items-center justify-center gap-0.5 rounded-md', bgClass), children: [_jsx(Icon, { className: cn('size-3.5 shrink-0', iconClass) }), _jsx("span", { className: "text-[0.6rem] font-semibold tabular-nums", children: counts[status] })] }) }), _jsxs(TooltipContent, { side: "right", children: [label, ": ", counts[status]] })] }, status));
        }) }));
}
