-
Notifications
You must be signed in to change notification settings - Fork 23
Don't hide tocIgnore, add scroll into view for sidebar #262
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Pull request overview
This PR improves the documentation sidebar user experience by ensuring all headings are visible (removing the tocIgnore filter) and automatically scrolling the active sidebar link into view so users can always see which section is currently active.
- Removes the tocIgnore filtering logic to show all headings in the sidebar
- Adds automatic scrolling of the active sidebar link into the center of the viewport
- Implements a ref to the nav element to enable programmatic scrolling
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
apps/docs/app/docs/DocsSidebar.tsx
Outdated
| ); | ||
|
|
||
| if (activeLink instanceof HTMLElement) { | ||
| activeLink.scrollIntoView({ block: 'center', behavior: 'smooth' }); |
Copilot
AI
Jan 7, 2026
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The scrollIntoView with smooth behavior may cause unwanted scrolling animations in the sidebar every time the user scrolls through the page and the active heading changes. This could be distracting or jarring for users, especially when scrolling quickly through multiple sections. Consider either removing the smooth behavior (using 'auto' instead) or adding a check to only scroll when the active link is outside the visible area of the sidebar.
| activeLink.scrollIntoView({ block: 'center', behavior: 'smooth' }); | |
| activeLink.scrollIntoView({ block: 'center', behavior: 'auto' }); |
7b4c800 to
b52b415
Compare
Small QoL maybe for docs—expand the sidebar all the way so no headings are lost. Also adds a little scroll into view action for links further down the page so folks don't think there's not an active sidebar link.