import * as react from 'react';
import { ReactNode } from 'react';
import { HostCardProps } from './host-card.js';
import { StatCardProps } from './stat-card.js';
import { ServiceHealthCardProps } from './service-health-card.js';
import { IncidentSeverity } from './incident-card.js';
import { BackupJob } from './backup-status-panel.js';
import './status-dot.js';
import './card.js';

interface BentoDashboardProps {
    title: string;
    hosts?: HostCardProps[];
    metrics?: StatCardProps[];
    services?: ServiceHealthCardProps[];
    incidents?: {
        title: string;
        severity: IncidentSeverity;
        timestamp: string;
        service: string;
        description?: string;
        acknowledged?: boolean;
    }[];
    backupJobs?: BackupJob[];
    className?: string;
    /** Render the incident list footer */
    renderIncidentFooter?: () => ReactNode;
}
declare function BentoDashboard({ title, hosts, metrics, services, incidents, className, }: BentoDashboardProps): react.JSX.Element;

export { BentoDashboard, type BentoDashboardProps };