implementation
Implement in your agent
# Implement Sidebar in your agent ## Objective Implement Sidebar for this verified behavior: A persistent region beside primary content that participates in page layout and usually contains navigation or supporting tools. ## Prerequisites - Inspect the repository, design system, and existing tests first. - Preserve unrelated changes and keep the file scope bounded. - Confirm that Sidebar matches the need before writing code. ## Required behavior - The region occupies page layout space instead of temporarily covering primary content. - If the product replaces the persistent region when space is insufficient, the replacement is a separately named temporary navigation control. ## States to cover - Sidebar expanded — Sidebar expanded - Sidebar compact — Sidebar compact ## Accessibility - The primary control or named region for Sidebar has a stable accessible name from visible text or an explicit programmatic label; placeholder text and tooltips are not names. - Focus moves normally between the sidebar and main content; collapse preserves a logical focused control. - A persistent sidebar is collapsed, not dismissed; any temporary mobile counterpart follows its own Drawer dismissal contract. - Tab follows normal document order - Enter activates links and collapse controls - No focus trap is created ## Non-goals - The surface is needed only briefly - The remaining content becomes too narrow or horizontally scrolls ## Acceptance criteria - The sidebar occupies layout space rather than overlaying content - Its navigation region has a unique name - Current location and collapsed state are exposed - The narrow-screen replacement is an explicit separate pattern
sha256:cbe885ff65b54e416429542a0f999cf62fdc31f8b7018523525ffd1be9babf42