From 9afe626a583521c1ab8d4801e6238942c7a13df7 Mon Sep 17 00:00:00 2001 From: hsiegeln <37154749+hsiegeln@users.noreply.github.com> Date: Thu, 2 Apr 2026 17:42:09 +0200 Subject: [PATCH] docs: update composable sidebar spec with clarified decisions Add searchValue prop for controlled input, SidebarContext for collapsed state propagation, LayoutShell migration plan, and icon-rail simultaneous callback behavior. Co-Authored-By: Claude Opus 4.6 (1M context) --- docs/superpowers/specs/2026-04-02-composable-sidebar-design.md | 3 +++ 1 file changed, 3 insertions(+) diff --git a/docs/superpowers/specs/2026-04-02-composable-sidebar-design.md b/docs/superpowers/specs/2026-04-02-composable-sidebar-design.md index d6d8560..c6e2f48 100644 --- a/docs/superpowers/specs/2026-04-02-composable-sidebar-design.md +++ b/docs/superpowers/specs/2026-04-02-composable-sidebar-design.md @@ -45,6 +45,7 @@ The outer shell. Renders the sidebar frame with an optional search input and col {}} + searchValue="" onSearchChange={(query) => {}} className="" > @@ -134,6 +135,8 @@ v [icon] APPLICATIONS Header has: chevron (left), icon, label. Chevron rotates on collapse/expand. Active section gets the amber left-border accent (existing pattern). Clicking the header calls `onToggle`. +**Implementation detail:** `Sidebar.Section` and `Sidebar.Header` need to know the parent's `collapsed` state to switch between expanded and icon-rail rendering. The `` component provides `collapsed` and `onCollapseToggle` via React context (`SidebarContext`). Sub-components read from context — no prop drilling needed. + **Icon-rail click behavior:** In collapsed mode, clicking a section icon fires both `onCollapseToggle` and `onToggle` simultaneously on the same click. The sidebar expands and the section opens in one motion. No navigation occurs — the user is expanding the sidebar to see what's inside, not committing to a destination. They click a tree item after the section is visible to navigate. ### ``