https://codesandbox.io/s/component-as-prop-with-typescript-59hilx

component-as-prop-with-typescript.ts

import { ComponentPropsWithoutRef, ElementType, ReactNode } from "react";
import "./styles.css";

interface Component1Props<T extends ElementType = "div"> {
  as?: T;
  children: ReactNode;
}
type Props<T extends ElementType> = Component1Props<T> &
  Omit<ComponentPropsWithoutRef<T>, keyof Component1Props<T>>;
function Component1<T extends ElementType>({ children, as }: Props<T>) {
  const Component = as ?? "div";
  return <Component>{children}</Component>;
}

export default function App() {
  return (
    <div className="App">
      <Component1 as="button" onClick={() => null}>
        Hello
      </Component1>
    </div>
  );
}