Using `Link` in NavLink

[wary delta]

I am currently using useNavigate from react-router-dom with Mantine's NavLink component

<NavLink key="1" label="Home" onClick={() => navigate('/')} />

I have read that it is better to use Link from react-router-dom for this sort of thing. What is the advised way to do this? I know with the Text component, you can just do

<Text component={Link}

But what about in NavLink. Should I do

<NavLink key="1" label="Home">
    <Link to="/" />
</NavLink>

?

[viral current]

you can use <NavLink component={Link} href="/" />

[wary delta]

I already looked to see if component prop was on NavLink and I didn't see it here https://mantine.dev/core/nav-link/?t=props

[viral current]

it's on documentation - polymorphic component

[wary delta]

ah okay. Maybe it was in front of my face and I missed it, but do the docs say anywhere that NavLink is a polymorphic component?

[mystic rock]

https://mantine.dev/core/nav-link/#polymorphic-component