//
// Copyright 2024 DXOS.org
//
import React from 'react';
import { Panel } from '../Panel';
export const RawQueriesPanel = ({ queries, ...props }) => {
    const keys = Array.from(queries.keys()).sort();
    return (React.createElement(Panel, { ...props, icon: 'ph--tree-view--regular', title: 'Query types', info: React.createElement("span", null, keys.length.toLocaleString()) },
        React.createElement("table", { className: 'table-fixed is-full text-xs font-mono' },
            React.createElement("tbody", null, keys.map((key, i) => (React.createElement("tr", { key: i },
                React.createElement("td", { className: 'p-1 overflow-hidden' },
                    React.createElement("pre", { className: 'font-2xs font-thin' }, key)),
                React.createElement("td", { className: 'p-1 is-[80px] text-right' }, queries.get(key).toLocaleString()))))))));
};
//# sourceMappingURL=RawQueriesPanel.js.map