| 9 | } |
| 10 | |
| 11 | export function SidebarToggle({ className }: SidebarToggleProps) { |
| 12 | const { sidebarOpen, toggleSidebar } = useChatStore(); |
| 13 | |
| 14 | return ( |
| 15 | <button |
| 16 | onClick={toggleSidebar} |
| 17 | title={sidebarOpen ? "Close sidebar (⌘B)" : "Open sidebar (⌘B)"} |
| 18 | aria-label={sidebarOpen ? "Close sidebar" : "Open sidebar"} |
| 19 | aria-expanded={sidebarOpen} |
| 20 | className={cn( |
| 21 | "p-1.5 rounded-md text-surface-400 hover:text-surface-100 hover:bg-surface-800 transition-colors", |
| 22 | "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-brand-500", |
| 23 | className |
| 24 | )} |
| 25 | > |
| 26 | <PanelLeft className="w-4 h-4" aria-hidden="true" /> |
| 27 | </button> |
| 28 | ); |
| 29 | } |