reactjs - importar tipos de eventos desde React (TypeScript)

¿Cómo importar tipos de eventos de React?

¿Cómo importar KeyboardEvent para que pueda ser usado en la anotación de tipo del callback onKeyDown?

He revisado el archivo .d.ts de Material-ui y encontré que en ese archivo se utilizan EventTypes tal como se definen en React

onKeyDown?: React.KeyboardEventHandler;

Y en React .d.ts

type KeyboardEventHandler = EventHandler<KeyboardEvent>;

Pero no puedo encontrar una forma de importarlos...

Respuesta #1

Funciona bien para mí:

handleKeyPress (event: React.KeyboardEvent): any {
}

Y yo también uso material-ui

Respuesta #2

Agrega KeyboardEvent a tu declaración de importación de React. Luego, en tu manejador puedes usar el tipo KeyboardEvent. Si no lo especificas en la declaración de importación, usarás la declaración ES5 de KeyBoardEvent, la cual no se compilará con tu proyecto de React.

import React, { Component, KeyboardEvent } from "react";

export class MyInput extends Component{
...

  handleKeyDown(e: KeyboardEvent<HTMLInputElement>) {
    console.log(e);
    // Do something here
  }

  render() {
      return (
        <input onKeyDown={this.handleKeyDown.bind(this}/>
      );
    }
  }
}