Polymorphics incompatible with components with `as` props

Ran into this with NextJS - if I try to polymorph one of our links into a NextJS link it fails miserably.

The reason was because NextJS links declare their own "as" prop which conflicts with our own. I can work around this with the following solution:

import { Group, Link } from "@osuresearch/ui";
import { default as NextLink, LinkProps } from "next/link";

type NextLinkType = React.ElementType<Omit<LinkProps, 'as'>>;

export function Navbar() {
  return (
    <Group bgc="light" p="md" gap="md">
      <Link<NextLinkType> as={NextLink} >Home</Link>
      <Link<NextLinkType> as={NextLink} href="/evaluate">Submit an evaluation</Link>
      <Link<NextLinkType> as={NextLink} href="/unresolved">Unresolved issues</Link>
      <Link<NextLinkType> as={NextLink} href="/reporting">Reporting</Link>
    </Group>
  )
}

But a better solution would be to ensure that whatever type we're polymorphing into will always omit its own "as" prop.

osuresearch / ui

Polymorphics incompatible with components with `as` props #83