25 lines
1.2 KiB
TypeScript
25 lines
1.2 KiB
TypeScript
import { Search } from "lucide-react";
|
|
import { COLORS, FONT } from "./theme";
|
|
import { PresetPicker } from "./PresetPicker";
|
|
|
|
/** Top-of-grid toolbar: layout presets on the left, scrollback search on the right (search is a mock). */
|
|
export function CenterToolbar({ selected, onSelect, onOpenSearch }: { selected: string; onSelect: (id: string) => void; onOpenSearch: () => void }) {
|
|
return (
|
|
<div style={{ display: "flex", alignItems: "center", gap: 8, padding: "0 12px", height: 46, borderBottom: `1px solid ${COLORS.borderSubtle}` }}>
|
|
<PresetPicker selected={selected} onSelect={onSelect} />
|
|
<div style={{ flex: 1 }} />
|
|
<div
|
|
title="Search scrollback"
|
|
onClick={onOpenSearch}
|
|
style={{
|
|
display: "flex", alignItems: "center", gap: 6, height: 24, padding: "0 8px", borderRadius: 6,
|
|
background: COLORS.bgPanel, border: `1px solid ${COLORS.borderSubtle}`, cursor: "pointer",
|
|
}}>
|
|
<Search size={12} color={COLORS.textMuted} />
|
|
<span style={{ fontFamily: FONT.ui, fontSize: 11, color: COLORS.textMuted }}>Search scrollback</span>
|
|
<span style={{ fontFamily: FONT.mono, fontSize: 11, color: COLORS.textMuted }}>⌘F</span>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|