Build strongly typed polymorphic components with React and TypeScript - Part 4

polymorphic-components-react-4.tsx

import * as React from 'react';

type ButtonProps<C extends React.ElementType> = {
  as?: C;
  children: React.ReactNode;
} & React.ComponentPropsWithoutRef<C>;

//                                                     👇 look here
export const Button = <C extends React.ElementType = 'button'>({ 
  as,
  children,
  ...otherProps
}: ButtonProps<C>) => {    
  const Component = as || 'button';

  return <Component {...otherProps}>{children}</Component>;
};