How to import type from react-pdf?

Question

react-pdf 7.6.0 has Document component with a file prop of type File.

This File type is defined in node_modules/react-pdf/dist/esm/shared/types.d.ts like this,

export type File = string | ArrayBuffer | Blob | Source | null;

I want to use the same type in my custom component.

How can I import and use this File type in my code? For example, how can I use this File type

// import type File from ??

const PdfViewer = ({ file : File }) = {
  ...
}

Answer 1

use the File type from react-pdf in your custom component, you need to import it as a type since it's not a regular JavaScript object but a TypeScript type. You can do this by using TypeScript's import type syntax. Here's a way you can import and use the File type in your component,

import type { File } from 'react-pdf';

interface PdfViewerProps {
  file: File;
}

const PdfViewer: React.FC<PdfViewerProps> = ({ file }) => {
  

  return (
    //  jsx
  );
};

export default PdfViewer;