Chat composition needs a tabbed panel above the input — files, tools, presets, context — without rebuilding tab chrome, collapse toggles, and chip numbering every time. Without it, the drawer merges visually with the composer and tab switching feels like a separate surface.

ChatDrawer is a controlled tabbed panel with stable activeTabId and onTabChange, a collapsible body controlled via open and onToggle, and slot-driven content: children render conditionally based on the active tab. Each tab gets a numbered chip (overridable via number); the drawer handles layout and dark-mode tokens so you supply only the tab shape and body content.

Import from @particle-academy/react-fancy, pass a tabs array of { id, label } objects, bind activeTabId to state, and render content conditionally in children. Nest the drawer above a PromptInput via its aboveInput slot so they share one rounded shell. Agents can switch tabs by calling a stable onTabChange tool with the tab id.