@changiapp/react-native-pdf-viewer

Native in-app PDF viewer for React Native using Pdfium (Android) and PDFKit (iOS).

Drop-in style API similar to react-native-pdf, with a Changi-owned native render stack.

Features

• Remote and local PDF sources (https://, file://)
• Native page rendering via TurboModule
• Virtualized page list with lazy rendering
• Large PDF downloads via HTTP Range chunks (avoids intermittent CloudFront/WAF 403 on ~190MB single GETs)
• Small PDFs use a normal single GET
• Loading, error, and retry UI

Installation

yarn add @changiapp/react-native-pdf-viewer react-native-blob-util
# or
npm install @changiapp/react-native-pdf-viewer react-native-blob-util

react-native-blob-util is a required peer.

iOS

cd ios && pod install

Android

Autolinking handles native setup.

Usage

import PdfViewer from '@changiapp/react-native-pdf-viewer';

<PdfViewer
  source={{
    uri: 'https://example.com/document.pdf',
    cache: true,
    expiration: 1800,
  }}
  onLoadComplete={(pageCount, filePath) => {
    console.log(pageCount, filePath);
  }}
  onError={(error) => {
    console.log(error.message);
  }}
  style={{ flex: 1 }}
/>;

CDN-safe headers (User-Agent, Accept, Accept-Language, Referer) are applied inside the package when omitted. Pass source.headers only for auth or overrides.

API

PdfViewer

| Prop | Type | Description | |------|------|-------------| | source.uri | string | Remote or local PDF URI | | source.headers | Record<string, string> | Optional download headers | | source.cache | boolean | Cache remote downloads | | source.expiration | number | Cache TTL in seconds (default 1800) | | onLoadComplete | (pageCount, filePath) => void | Fired when first page is ready | | onPageChanged | (page, pageCount) => void | Fired when a page is rendered | | onError | (error: Error) => void | Error callback | | renderActivityIndicator | (progress) => ReactElement | Custom loader |

clearPdfCache()

Clears rendered page files and downloaded PDF cache.

Notes

• iOS deployment target should be 15.5+ (matches typical RN 0.81 apps).
• For iOS CloudFront User-Agent casing issues with react-native-blob-util, keep the app patch patches/react-native-blob-util+0.22.2.patch if you use that dependency version.

License

MIT