Building Strongly Typed Polymorphic Components

[guidari]

When using PolymorphicProps in Carbon, we are not accounting for type errors. For example, in the code snippet below, a type error should occur if a user attempts to use an attribute that is incompatible with the specified tag. However, this is not currently being enforced.

// Should throw an error in the `href`
<Component as="button" href="www.google.com" />

There is this really good article that talks about How to Build Strongly Typed Polymorphic Components

Here is a PR that serves as an example of how to implement this.

Components with PolymorphicProps

Preview Give feedback

1. Button
2. Column
3. Layer
4. Link
5. Popover
6. Tag
7. Implement the reusable code and add to Text component #18279
   role: dev 🤖 +1
   
8. Toggletip
9. Tooltip
10. Layer
11. UIShell Link
12. Grid

Components that could use PolymorphicProps

Preview Give feedback

1. SideNavMenuItem