`PageHeader.ParentLink` drops props (e.g. `to`) when using a polymorphic `as`, breaking client-side routing

[adierkens]

Description

PageHeader.ParentLink does not forward arbitrary/rest props to the element passed via as. It destructures a fixed prop set — href, as, className, children, ref, aria-label, hidden — and forwards only href to the underlying link. Any other prop (notably to) is silently dropped.

This breaks the standard polymorphic pattern that works on the other Primer components. With NavList.Item, Button, and Link, you can do as={RouterLink} to="/path" because they spread ...rest onto the rendered element. PageHeader.ParentLink is inconsistent — to never reaches the as component, so a router Link resolves to the current URL instead of navigating.

Reproduction

import {PageHeader} from '@primer/react'
import {Link} from 'react-router' // or react-router-dom

<PageHeader>
  <PageHeader.ContextArea>
    <PageHeader.ParentLink as={Link} to="/somewhere">
      Back
    </PageHeader.ParentLink>
  </PageHeader.ContextArea>
  {/* ... */}
</PageHeader>

Observed: the rendered <a> has no/incorrect href and clicking does a full-page navigation to the current URL (the to prop is dropped). The same happens for any non-allowlisted prop forwarded to the as element.

Expected behavior

PageHeader.ParentLink should forward unknown props to the as element (spread ...rest), consistent with NavList.Item, Button, and Link, so that to (and other router/link props) reach the rendered component and client-side routing works.

Workaround

Wrap the as element in an adapter that maps the forwarded href to the router link's to:

function ParentLinkRouterAdapter({href = '', ...props}) {
  return <RouterLink to={href} {...props} />
}

<PageHeader.ParentLink as={ParentLinkRouterAdapter} href="/somewhere">
  Back
</PageHeader.ParentLink>

Version

38.27.0

Browser

No response