import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
import { isLockDevice } from 'seamapi';
import { LockLockedIcon } from '../../../lib/icons/LockLocked.js';
import { LockUnlockedIcon } from '../../../lib/icons/LockUnlocked.js';
export function LockStatus(props) {
    if (!isLockDevice(props.device)) {
        return null;
    }
    const { device: { properties: { locked }, }, } = props;
    return (_jsx("div", { className: 'seam-lock-status', children: _jsx(Content, { isLocked: locked }) }));
}
function Content(props) {
    const { isLocked } = props;
    if (isLocked) {
        return (_jsxs(_Fragment, { children: [_jsx(LockLockedIcon, { className: 'seam-lock-icon' }), _jsx("span", { className: 'seam-status-text', children: t.locked })] }));
    }
    return (_jsxs(_Fragment, { children: [_jsx(LockUnlockedIcon, { className: 'seam-lock-icon' }), _jsx("span", { className: 'seam-status-text', children: t.unlocked })] }));
}
const t = {
    locked: 'Locked',
    unlocked: 'Unlocked',
};
//# sourceMappingURL=LockStatus.js.map