//
// Copyright 2024 DXOS.org
//
import React from 'react';
import { Panel } from '../Panel';
import { Duration } from '../util';
export const PerformancePanel = ({ entries, ...props }) => {
    if (!entries?.length) {
        return null;
    }
    return (React.createElement(Panel, { ...props, icon: 'ph--hourglass-simple-low--regular', title: 'Performance', info: React.createElement("span", null, entries?.length.toLocaleString()) },
        React.createElement("table", { className: 'table-fixed is-full text-xs font-mono' },
            React.createElement("tbody", null, entries?.map((entry, i) => (React.createElement("tr", { key: i },
                React.createElement("td", { className: 'p-1 text-right' }, [entry.entryType, entry.name].filter(Boolean).join('/')),
                React.createElement("td", { className: 'p-1 is-[80px]' }),
                React.createElement("td", { className: 'p-1 is-[80px] text-right' },
                    React.createElement(Duration, { duration: entry.duration })))))))));
};
//# sourceMappingURL=PerformancePanel.js.map