import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
import { BatteryLevelCriticalIcon } from '../../../lib/icons/BatteryLevelCritical.js';
import { BatteryLevelFullIcon } from '../../../lib/icons/BatteryLevelFull.js';
import { BatteryLevelHighIcon } from '../../../lib/icons/BatteryLevelHigh.js';
import { BatteryLevelLowIcon } from '../../../lib/icons/BatteryLevelLow.js';
export function BatteryStatus(props) {
    return (_jsx("div", { className: 'seam-battery-status', children: _jsx(Content, { status: props.device.properties.battery?.status, level: props.device.properties.battery?.level }) }));
}
function Content(props) {
    const { status, level } = props;
    const percentage = level != null ? ` (${Math.floor(level * 100)}%)` : null;
    if (status === 'full') {
        return (_jsxs(_Fragment, { children: [_jsx(BatteryLevelFullIcon, {}), _jsx("span", { className: 'seam-status-text', children: `${t.full}${percentage ?? ''}` })] }));
    }
    if (status === 'good') {
        return (_jsxs(_Fragment, { children: [_jsx(BatteryLevelHighIcon, {}), _jsx("span", { className: 'seam-status-text', children: `${t.high}${percentage ?? ''}` })] }));
    }
    if (status === 'low') {
        return (_jsxs(_Fragment, { children: [_jsx(BatteryLevelLowIcon, {}), _jsx("span", { className: 'seam-status-text', children: `${t.low}${percentage ?? ''}` })] }));
    }
    if (status === 'critical') {
        return (_jsxs(_Fragment, { children: [_jsx(BatteryLevelCriticalIcon, {}), _jsx("span", { className: 'seam-text-danger', children: `${t.critical}${percentage ?? ''}` })] }));
    }
    return null;
}
const t = {
    full: 'Good',
    high: 'Good',
    low: 'Low',
    critical: 'Low!',
};
//# sourceMappingURL=BatteryStatus.js.map