Drop the working-on panel. Rail rows show the bot's status line first. The header's computer and model controls are ghost icons opening modals that explain them, and the bot's text model, provider and computer show under its name. The thread and composer are held to 760px. Co-Authored-By: Claude Opus 5.5 <[email protected]>
29 lines
815 B
TypeScript
29 lines
815 B
TypeScript
import Row from "@moduletrace/twui/layout/Row";
|
|
import Span from "@moduletrace/twui/layout/Span";
|
|
import type { LucideIcon } from "lucide-react";
|
|
|
|
type Props = {
|
|
icon: LucideIcon;
|
|
/**
|
|
* What the text is, for the tooltip and screen readers.
|
|
*/
|
|
label: string;
|
|
text: string;
|
|
};
|
|
|
|
/**
|
|
* One fact under the bot's name in the conversation header: an icon and
|
|
* a line of muted text.
|
|
*/
|
|
export default function HeaderMetaItem({ icon: Icon, label, text }: Props) {
|
|
return (
|
|
<Row
|
|
title={`${label}: ${text}`}
|
|
className="min-w-0 shrink gap-1.5! flex-nowrap text-[13px] leading-[18px] text-ink-secondary"
|
|
>
|
|
<Icon size={13} aria-label={label} className="shrink-0" />
|
|
<Span className="truncate">{text}</Span>
|
|
</Row>
|
|
);
|
|
}
|