reactjs - Typescript: atributo type del elemento button

Me gustaría que un botón personalizado pudiera recibir opcionalmente el atributo type:

export interface ButtonProps {
  children: React.ReactNode;
  onClick?: (e: React.MouseEvent<HTMLElement>) => void;
  type: ??
}


export const Button: React.FunctionComponent<ButtonProps> = ({ children, ...buttonProps }) => {
  return <StyledButton {...buttonProps}>{children}</StyledButton>;
};

export default Button;

Lo mismo que con 'onClick', que está funcionando. Cualquier tipo que intento poner, aún así lanza un error. ¿Cuál es el tipo correcto para el atributo type?

Respuesta #1

Puedes escribir un botón en tu editor:

<button type='' />

y probablemente ctrl/comando + clic en el type, o pasar el cursor sobre el atributo type para ver su tipo.

    interface ButtonHTMLAttributes<T> extends HTMLAttributes<T> {
        autoFocus?: boolean | undefined;
        disabled?: boolean | undefined;
        form?: string | undefined;
        formAction?: string | undefined;
        formEncType?: string | undefined;
        formMethod?: string | undefined;
        formNoValidate?: boolean | undefined;
        formTarget?: string | undefined;
        name?: string | undefined;
        type?: 'submit' | 'reset' | 'button' | undefined;
        value?: string | ReadonlyArray<string> | number | undefined;
    }

También puedes ampliar las propiedades de tu componente:

export interface ButtonProps extends React.HTMLProps<HTMLButtonElement> {}

Puede que quiera sobrescribir o omitir los tipos que desee.