import { jsx as _jsx } from "react/jsx-runtime";
import { useEditContext } from "../client/editContext";
import { SimpleTable } from "../ui/SimpleTable";
export function Performance() {
    const context = useEditContext();
    if (!context?.timings)
        return null;
    const values = Object.keys(context.timings).map((key) => ({
        key,
        value: Math.round(context.timings[key]),
    }));
    const columns = [
        {
            body: (entry) => {
                if (/[0-9a-fA-F]{8}-[0-9a-fA-F]{4}-[0-9a-fA-F]{4}-[0-9a-fA-F]{4}-[0-9a-fA-F]{12}/.test(entry.key)) {
                    const ids = entry.key
                        .split("_")
                        .filter((part) => /[0-9a-fA-F]{8}-[0-9a-fA-F]{4}-[0-9a-fA-F]{4}-[0-9a-fA-F]{4}-[0-9a-fA-F]{12}/.test(part));
                    return (_jsx("div", { className: "cursor-pointer", onClick: () => context.select(ids), children: entry.key }));
                }
                return entry.key;
            },
            header: "Metric",
        },
        {
            body: (entry) => entry.value,
            header: "Time (ms)",
        },
    ];
    return (_jsx("div", { className: "overflow-x-auto", children: _jsx(SimpleTable, { items: values, columns: columns }) }));
}
//# sourceMappingURL=Performance.js.map