import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Icon } from "@powerhousedao/design-system";
import { twMerge } from "tailwind-merge";
import { Branch } from "./branch.js";
import { DocId } from "./doc-id.js";
import { DocumentState } from "./document-state.js";
import { Scope } from "./scope.js";
export function Header(props) {
    const { title, docId, scope, onChangeScope, onClose, className, documentState, onCopyState, onCopyDocId, ...divProps } = props;
    return (_jsxs("header", { className: twMerge("flex items-center justify-between bg-transparent", className), ...divProps, children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("button", { name: "close-revision-history", className: "shadow-button rounded-lg bg-gray-50 p-1 text-stone-300", onClick: onClose, children: _jsx(Icon, { name: "VariantArrowLeft" }) }), _jsx("h1", { className: "text-xs", children: title })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(DocId, { docId: docId, onCopy: onCopyDocId }), documentState && (_jsx(DocumentState, { documentState: documentState, onCopyState: onCopyState })), _jsx(Branch, {}), _jsx(Scope, { onChange: onChangeScope, value: scope })] })] }));
}
//# sourceMappingURL=header.js.map