//
// Copyright 2024 DXOS.org
//
import React from 'react';
import { mx } from '@dxos/ui-theme';
import { Unit } from '@dxos/util';
import { Panel } from '../Panel';
const MEM_WARNING = 40 / 100;
export const MemoryPanel = ({ memory, ...props }) => {
    return (React.createElement(Panel, { ...props, icon: 'ph--cpu--regular', title: 'Memory', info: React.createElement("div", { className: 'flex items-center gap-2' },
            React.createElement("span", { title: 'Used (heap size)' }, String(Unit.Megabyte(memory?.usedJSHeapSize ?? 0))),
            React.createElement("span", { title: 'Allocated (heap size)' }, String(Unit.Megabyte(memory?.totalJSHeapSize ?? 0))),
            memory?.used !== undefined && (React.createElement("span", { title: 'Used (available)', className: mx(memory?.used > MEM_WARNING && 'text-red-500') }, String(Unit.Percent(memory?.used ?? 0))))) }));
};
//# sourceMappingURL=MemoryPanel.js.map