diff --git a/types/react-pdf/dist/Page.d.ts b/types/react-pdf/dist/Page.d.ts index ae01b9e414..da390061ef 100644 --- a/types/react-pdf/dist/Page.d.ts +++ b/types/react-pdf/dist/Page.d.ts @@ -1,5 +1,5 @@ import * as React from 'react'; -import { PDFPageProxy } from 'pdfjs-dist'; +import { PDFPageProxy as _PDFPageProxy } from 'pdfjs-dist'; export type RenderFunction = () => JSX.Element; @@ -37,6 +37,13 @@ export interface TextItem { fontName: string; } +export interface PDFPageProxy extends _PDFPageProxy { + width: number; + height: number; + originalWidth: number; + originalHeight: number; +} + export interface Props { /** * Defines custom class name(s), that will be added to rendered element. @@ -187,4 +194,4 @@ export interface Props { width?: number; } -export default class Page extends React.Component { } +export default class Page extends React.Component {} diff --git a/types/react-pdf/react-pdf-tests.tsx b/types/react-pdf/react-pdf-tests.tsx index fd518c86e0..a83045edd6 100644 --- a/types/react-pdf/react-pdf-tests.tsx +++ b/types/react-pdf/react-pdf-tests.tsx @@ -1,5 +1,6 @@ import * as React from 'react'; import { Document, Page, pdfjs } from 'react-pdf'; +import { PDFPageProxy } from 'react-pdf/dist/Page'; import { PDFDocumentProxy } from 'pdfjs-dist'; pdfjs.GlobalWorkerOptions.workerSrc = `//cdnjs.cloudflare.com/ajax/libs/pdf.js/${pdfjs.version}/pdf.worker.js`; @@ -7,6 +8,8 @@ pdfjs.GlobalWorkerOptions.workerSrc = `//cdnjs.cloudflare.com/ajax/libs/pdf.js/$ interface State { numPages: number | null; pageNumber: number; + originalHeight: number | null; + originalWidth: number | null; } export class MyApp extends React.Component<{}, State> { @@ -15,6 +18,8 @@ export class MyApp extends React.Component<{}, State> { this.state = { numPages: null, pageNumber: 1, + originalHeight: null, + originalWidth: null, }; } @@ -22,18 +27,28 @@ export class MyApp extends React.Component<{}, State> { this.setState({ numPages }); } + onPageLoadSuccess = ({ originalHeight, originalWidth }: PDFPageProxy) => { + this.setState({ + originalHeight, + originalWidth, + }); + } + render() { - const { pageNumber, numPages } = this.state; + const { pageNumber, numPages, originalHeight, originalWidth } = this.state; return (
- - + + -

Page {pageNumber} of {numPages}

+

+ Page {pageNumber} of {numPages} +

+

+ PDF height: {originalHeight} + PDF width: {originalWidth} +

); }