Sidebar Updates

[danielguillan]

• Adds the active link in the header as the sidebar title and the root item for breadcrumbs.
• Updates styles to match current primer.style
• Makes group headings link to the index page (now uses Mona Sans, update font sizes, visible dividers, ...)

[Copilot]

Pull Request Overview

This PR enhances the sidebar by displaying the active header link as its title, updates styling to match primer.style, and makes group headings navigable.

• Adds activeHeaderLink to sidebar and root breadcrumbs
• Updates typography and spacing in Sidebar.module.css
• Wraps group headings in links to their index pages

Reviewed Changes

Copilot reviewed 3 out of 3 changed files in this pull request and generated 2 comments.

File	Description
packages/theme/components/layout/sidebar/Sidebar.tsx	Show active header link as sidebar title; wrap group headings in <NextLink>; add NavListItem class
packages/theme/components/layout/sidebar/Sidebar.module.css	Adjust font sizes, remove hidden dividers, and scope NavList styling
packages/theme/components/layout/root-layout/Theme.tsx	Update root breadcrumbs to use activeHeaderLink title

Comments suppressed due to low confidence (4)

packages/theme/components/layout/sidebar/Sidebar.tsx:80

• [nitpick] You’re supplying both the title prop and a custom <NavList.GroupHeading>, which may render duplicate headings. Remove the title prop if you intend to use the custom heading element.

<NavList.Group title={subNavName} key={item.name} sx={{mb: 24}}>

packages/theme/components/layout/root-layout/Theme.tsx:141

• New breadcrumb logic now prefers activeHeaderLink over siteTitle. Consider adding a test to cover both scenarios (with and without an active header link).

{(activeHeaderLink || siteTitle) && (

packages/theme/components/layout/sidebar/Sidebar.tsx:24

• It looks like useConfig isn't imported in this file. Add import {useConfig} from '../../context/useConfig' alongside the other hooks to avoid a runtime error.

const {headerLinks, sidebarLinks} = useConfig()

packages/theme/components/layout/sidebar/Sidebar.module.css:22

• The .NavList__Container selector may not match the actual DOM from <NavList>. Verify the rendered markup or adjust to .NavList .NavListItem a to ensure this rule applies.

.NavList__Container li a,

[rezrah]

Code looks good @danielguillan 🙌. As you're not using this feature in the preview site, could we instead share screenshots in the PR to more easily see how it looks please (next time is fine).