Unstyled polymorphic button
UnstyledButton resets default button styles, it is used as a base for all other button components. You can use it to as a base for custom polymorphic buttons.
UnstyledButton is a polymorphic component – its default root element is button , but it can be changed to any other element or component with the component prop:
Polymorphic components with TypeScript
Note that polymorphic component prop types are different from regular components – they do not extend HTML element props of the default element. For example, UnstyledButton Props does not extend React.ComponentProps '<' div '>' although button is the default element.
If you want to create a wrapper for a polymorphic component that is not polymorphic (does not support the component prop), then your component props interface should extend HTML element props, for example:
If you want your component to remain polymorphic after wrapping, use the polymorphic function described in this guide .