## What kind of change does this PR introduce?
visual parity fix and refresh + component extraction (stacked on #49942)
## What is the current behavior?
guide and reference sidebars each hand-roll their own collapsible
section visuals
## What is the new behavior?
- adds `NavSection` composition components (`NavSectionCaret`,
`NavSectionContent`, `NavSectionList`) shared by both navs via radix
`asChild`, so the rail, caret, and motion have a single source of truth
- fixes ui drift between both so navs get the same left rail beside
expanded children, the same caret and animation
- enhances link click area so space between rows is part of the click
target
| state | preview |
| -------|------|
| before | <img width="430" height="288" alt="image"
src="https://github.com/user-attachments/assets/0052d4b7-7793-43cf-8416-2a5445b95148"
/> |
| after | <img width="430" height="288" alt="image"
src="https://github.com/user-attachments/assets/42713ee3-e147-4e53-a58d-3f3de278264d"
/> |
## How to test?
1. run `pnpm dev:docs`
2. open [guide
page](http://localhost:3001/docs/guides/integrations/build-a-supabase-oauth-integration)
3. open [reference
page](http://localhost:3001/docs/reference/dart/introduction)
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Added animated expand/collapse behavior and rotating caret indicators
to documentation navigation sections.
* Added active-child indicators for clearer navigation context.
* **Improvements**
* Standardized spacing, borders, and animation styles across guide and
reference navigation.
* Improved collapsible animations to support varying content sizes more
reliably.
* Navigation items without links or child content, including disabled
nested items, are no longer displayed.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
