Typescript Error with "as" prop

[randallmlough]

Describe the bug
Getting a TS2769: No overload matches this call when attempting to use the "as" prop with a next/link component. TS appears to be complaining about the lack of the href prop (see screenshot) that Link component requires.

Oversimplified example
button.tsx

import { classed } from '@tw-classed/react'
import Link from 'next/link'

const StyledButton = classed('button', 'text-center')

export type ButtonProps = React.ComponentProps<typeof StyledButton>

export const Button = ({...props }: ButtonProps) => {
  return <StyledButton as={Link} />

package.json

{
  "dependencies": {
    "@tw-classed/react": "^1.2.5",
    "@types/node": "18.11.10",
    "@types/react": "18.0.26",
    "@types/react-dom": "18.0.9",
    "next": "13.0.6",
    "react": "18.2.0",
    "react-dom": "18.2.0",
    "typescript": "4.9.3"
  },
}

Screenshots

[sannajammeh]

Hello! Thanks for the issue.

The reason you're facing this is because Next link requires the href prop. So this is indeed correct behavior.
I dont have an issue when passing in the href prop.

You can also merge the ButtonProps like so.

[sannajammeh]

I think I might need more detailed as prop usage in the docs to highlight this.

Closing this for now, feel free to reopen if you're facing any issues!

[randallmlough]

I think I might need more detailed as prop usage in the docs to highlight this.

Closing this for now, feel free to reopen if you're facing any issues!

Thanks for your quick the reply back. In my actually code I had the href prop, but in my bad example I forgot to include it. But thanks for including a screenshot showing the addition of the Link component type intersection, that piece I did forget/miss to add; which solved the issue.

Great library btw. I've been having a lot of fun with it.