The ChatHeader component provides a consistent header interface for local AI chat applications. It shows status indicators (e.g. "Ready" if browser AI is available) and current token context details.
| Prop | Type | Description | Default |
|---|---|---|---|
title | string | The title text displayed in the header. | "Local AI Assistant" |
logo | ReactNode | Custom icon or logo element rendered on the left. | <Sparkles /> |
icon | ReactNode | Alias for logo. | undefined |
isSupported | boolean | Whether Chrome's built-in AI is supported on the client. | false |
status | "loading" | "ready" | "lazy" | Status of the AI model adapter displayed as a header badge. | "ready" |
contextInfo | { used: number, window: number } | null | Optional token utilization information to display adjacent to the title. | null |
Native AI