fix: Side panel followup

[snowystinger]

Closes

Fixes issues from testing

• The avatar shifts upwards slightly when you expand the side panel
• focusring is clipped on the left
• The alignment of the items in the account menu seem off.
• Removed extraneous react component pointed out in previous review, thanks @LFDanLu
• Added more elements to be able to test scrolling SideNav in a SidePanel in docs with the AccountFooter, fixed scrolling as a result
• Add story with a nav element around SideNav

✅ Pull Request Checklist:

• Included link to corresponding React Spectrum GitHub Issue.
• Added/updated unit tests and storybook for this change (for new code or code which already has tests).
• Filled out test instructions.
• Updated documentation (if it already exists for this component).
• Looked at the Accessibility Practices for this feature - Aria Practices
• I understand every change in this PR and can explain why it's there.
• If AI-assisted, I followed our AI contribution guidance and pointed my assistant at AGENTS.md.

📝 Test Instructions:

🧢 Your Project:

[rspbot]

Build successful! 🎉

• View the storybook
• View the S2 storybook
• View the S2 docs
• View the React Aria docs

[rspbot]

Build successful! 🎉

• View the storybook
• View the S2 storybook
• View the S2 docs
• View the React Aria docs

[rspbot]

Build successful! 🎉

• View the storybook
• View the S2 storybook
• View the S2 docs
• View the React Aria docs

[rspbot]

Agent Skills Changes

Modified (10)

• react-aria/agent-skills/index.json $\color{green}{+1}$ $\color{red}{-1}$
• react-aria/agent-skills/react-aria.tar.gz
• react-aria/agent-skills/react-aria/references/components/Separator/useSeparator.md $\color{green}{+1}$ $\color{red}{-1}$
• s2/agent-skills/index.json $\color{green}{+3}$ $\color{red}{-3}$
• s2/agent-skills/migrate-react-spectrum-v3-to-s2.tar.gz
• s2/agent-skills/react-spectrum-s2.tar.gz
• s2/agent-skills/react-spectrum-s2/references/components/SidePanel.md $\color{green}{+7}$ $\color{red}{-1}$
• s2/agent-skills/react-spectrum-s2/references/guides/ai-components.md $\color{red}{-17}$
• s2/agent-skills/react-spectrum-s2/references/react-aria/components/Separator/useSeparator.md $\color{green}{+1}$ $\color{red}{-1}$
• s2/agent-skills/spectrum-audit.tar.gz

Install

React Spectrum S2:

npx skills add https://d1pzu54gtk2aed.cloudfront.net/pr/7c06a74e94914ff5a707926cb3f649b8e6f1b518/

React Aria:

npx skills add https://d5iwopk28bdhl.cloudfront.net/pr/7c06a74e94914ff5a707926cb3f649b8e6f1b518/

[LFDanLu]

just one small thing I noticed, but otherwise looks good

[LFDanLu]

noticed that expanding/collapsing folders in https://d1pzu54gtk2aed.cloudfront.net/pr/7c06a74e94914ff5a707926cb3f649b8e6f1b518/SidePanel#animations to make the sidepanel scrollable causes the items to briefly appear behind the user profile

Screen.Recording.2026-09-29.at.11.42.57.AM.mov

[snowystinger]

yeah, i noticed that yesterday as well, I think we're ok for alpha, but I'm working on figuring it out

[LFDanLu]

sounds good, approved

[snowystinger]

working on it here #10684