JSPM

kamau-expo-rn-pdf

1.0.4
  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 6
  • Score
    100M100P100Q82887F
  • License MIT

PDF reader forked to update dependencies and add improvements

Package Exports

    This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (kamau-expo-rn-pdf) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

    Readme

    PDF Reader

    Project forked from xcarpentier rn-pdf-reader-js to support recent dependencies

    Android support 🚀





    npm version npm downloads

    Read a PDF just with JS (no native libs needed)

    Requirements

    • 👉Install react-native-webview on your own!
    • 👉Install expo-file-system on your own!
    • 👉Install expo-constants on your own!
    • Use it into Expo app (from expo client, Standalone app or ExpoKit app).
    • Only React-Native 0.59-0.60+ support, Expo SDK 33-44+

    PRs are welcome...

    Example

    import * as React from 'react'
    import { View } from 'react-native'
    import PDFReader from 'rn-pdf-reader-js'
    
    export default class App extends React.Component {
        render() {
            return (
                <PDFReader
                    source={{
                        uri: 'http://gahp.net/wp-content/uploads/2017/09/sample.pdf',
                    }}
                />
            )
        }
    }

    See more detailed example into App.tsx file.

    Props

    interface Source {
        uri?: string // can be local or served on the web (ie. start with `https://` or `file://`)
        base64?: string // should start with `data:application/pdf;base64,`. A base64 encoded pdf file tends to start with `JVBERi0xL` so your complete string should look something like this: `data:application/pdf;base64,JVBERi0xL...`
        headers?: { [key: string]: string }
    }
    
    interface Props {
        source: Source
        style?: View['props']['style'] // style props to override default container style
        webviewStyle?: WebView['props']['style'] // style props to override default WebView style
        webviewProps?: WebView['props']
        noLoader?: boolean
        useGoogleReader?: boolean // If you are not worried about confidentiality
        withScroll?: boolean // Can cause performance issue
        withPinchZoom?: boolean
        customStyle?: {
            readerContainer?: CSS.Properties
            readerContainerDocument?: CSS.Properties
            readerContainerNumbers?: CSS.Properties
            readerContainerNumbersContent?: CSS.Properties
            readerContainerZoomContainer?: CSS.Properties
            readerContainerZoomContainerButton?: CSS.Properties
            readerContainerNavigate?: CSS.Properties
            readerContainerNavigateArrow?: CSS.Properties
        }
        onLoad?(): void // callback that runs after WebView is loaded
        onLoadEnd?(): void // callback that runs after WebView is loaded
        onError?(): void // callback that runs when WebView is on error
    }

    Possibilities

    Render type Platform Source prop
    Custom PDF reader Android uri or base64
    Direct from WebView iOS uri or base64
    Google PDF Reader Android, iOS uri

    What rn-pdf-reader-js use?

    • react-pdf (pdf.js)
    • WebView
    • Base64

    FAQ

    Hire an expert!

    Looking for a ReactNative freelance expert with more than 12 years experience? Contact me from my website!