//
// Copyright 2024 DXOS.org
//
import React from 'react';
import { IconButton } from '@dxos/react-ui';
import { mx } from '@dxos/ui-theme';
import { SpaceRowContainer } from './Space';
export const SyncStatus = ({ classNames, state }) => {
    const entries = Object.entries(state);
    const handleCopyRaw = () => {
        void navigator.clipboard.writeText(JSON.stringify(state, null, 2));
    };
    return (React.createElement("div", { className: mx('flex flex-col is-full gap-2 text-xs', classNames) },
        React.createElement("div", { className: 'flex items-center gap-2' },
            React.createElement(IconButton, { icon: 'ph--copy--regular', label: 'copy raw', onClick: handleCopyRaw })),
        React.createElement("div", null, entries.map(([spaceId, state]) => (React.createElement(SpaceRowContainer, { key: spaceId, spaceId: spaceId, state: state }))))));
};
//# sourceMappingURL=SyncStatus.js.map