ChatHeader
Top bar of a chat surface, above AgentChat. title is the conversation name and truncates instead of wrapping; subtitle is the quiet second line, for example the model and the workspace. leftSection holds the leading controls (a sidebar toggle, a back button), secondarySection the badges and connection state, rightSection the panel buttons, menus and a ContextUsage. In a container narrower than 30rem the subtitle and the secondary section are hidden so the title and the right section keep their room; pass collapseSecondary={false} to keep them. The header takes its height from --ae-panel-header-height, so it lines up with the other panel headers of a layout, and withBorder={false} removes the line under it. titleOrder sets the heading level (2 by default).
$pnpm add @sinups/ai-kit @mantine/core @mantine/hooks @tabler/icons-react