Comment utiliser la bibliothèque react-pdf avec Typescript

Question

J'essaie d'utiliser une bibliothèque npm qui m'aide à rendre un document pdf. J'ai trouvé react-pdf mais il n'a pas encore les types pour TypeScript, donc je l'utilise comme je le montre ci-dessous :

let Document = require('react-pdf');
let Page = require('react-pdf');

class PdfViewer extends React.Component<PdfViewer.Props, PdfViewer.State> {

  constructor(props: PdfViewer.Props) {
    super(props);
    this.state = {
      numPages: null,
      pageNumber: 1,
    };

  }
  onDocumentLoadSuccess = ( numPages: number ) => {
    this.setState({ numPages });

  }

  componentWillReceiveProps(nextProps: PdfViewer.Props) {
    // this.setState(CsvViewer.parse(nextProps.data));
  }

  render() {
      const {url} = this.props;
      const { pageNumber, numPages } = this.state;

      const buffer = data as ArrayBuffer;

      return ( 
      <div>
        <Document
          file={url}
          onLoadSuccess={this.onDocumentLoadSuccess}
        >
          <Page pageNumber={pageNumber} />
        </Document>
        <p>Page {pageNumber} of {numPages}</p>
      </div>
      );

  }
}

Mais il y a cette erreur :

Le type d'élément n'est pas valide : on attendait une chaîne de caractères (pour les composants intégrés) ou une classe/fonction (pour les composants composites) mais a obtenu : object.

J'ai trouvé este dans GitHub mais cela ne m'a pas beaucoup aidé. Je suis allé sur le site documentation de la bibliothèque, et j'ai passé un objet dans le paramètre fichier comme il est indiqué mais la même erreur. Je pense que c'est quelque chose d'autre. Je suis allé dans le code source de la react-pdf et je pense que c'est la fonction qu'ils utilisent pour obtenir le fichier à partir du paramètre :

findDocumentSource = async () => {
    const { file } = this.props;

    if (!file) {
      return null;
    }

    // File is a string
    if (typeof file === 'string') {
      if (isDataURI(file)) {
        const fileUint8Array = dataURItoUint8Array(file);
        return { data: fileUint8Array };
      }

      displayCORSWarning();
      return { url: file };
    }

    // File is PDFDataRangeTransport
    if (file instanceof PDFDataRangeTransport) {
      return { range: file };
    }

    // File is an ArrayBuffer
    if (isArrayBuffer(file)) {
      return { data: file };
    }

    /**
     * The cases below are browser-only.
     * If you're running on a non-browser environment, these cases will be of no use.
     */
    if (isBrowser) {
      // File is a Blob
      if (isBlob(file) || isFile(file)) {
        return { data: await loadFromFile(file) };
      }
    }

    // At this point, file must be an object
    if (typeof file !== 'object') {
      throw new Error('Invalid parameter in file, need either Uint8Array, string or a parameter object');
    }

    if (!file.url && !file.data && !file.range) {
      throw new Error('Invalid parameter object: need either .data, .range or .url');
    }

    // File .url is a string
    if (typeof file.url === 'string') {
      if (isDataURI(file.url)) {
        const { url, ...otherParams } = file;
        const fileUint8Array = dataURItoUint8Array(url);
        return { data: fileUint8Array, ...otherParams };
      }

      displayCORSWarning();
    }

    return file;
  };

Je doute que l'erreur soit ici, mais je n'arrive pas à trouver ce qui pourrait l'être. La version de react J'utilise la version 16.8.2 et la version 4.0.2 pour le système de gestion de l'information. react-pdf