@kishannareshpal/expo-pdf 0.2.6 → 0.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -13,6 +13,27 @@
13
13
  _This version does not introduce any user-facing changes._
14
14
  -->
15
15
 
16
+ ## 0.3.0 - 2026-02-03
17
+
18
+
19
+ ### ✨ Features
20
+
21
+ - feat: support color inversion on ios and android ([8951a5c](https://github.com/kishannareshpal/expo-pdf/commit/8951a5c4162e863cb00f21959afe66509a66890d)) by `Kishan Jadav @ mozexames`
22
+
23
+
24
+ ### 📚 Documentation
25
+
26
+ - docs: color inversion ([bb4ed8f](https://github.com/kishannareshpal/expo-pdf/commit/bb4ed8f527a3201a555da62446e4e33831546e75)) by `Kishan Jadav`
27
+
28
+
29
+ ### 🧹 Chores
30
+
31
+ - chore: add color inversion example ([9c90bae](https://github.com/kishannareshpal/expo-pdf/commit/9c90bae266ca489dfb4cb89bf5b9a3d5ce838e2e)) by `Kishan Jadav`
32
+
33
+
34
+ **Full Changelog**: https://github.com/kishannareshpal/expo-pdf/compare/v0.2.6...v0.3.0
35
+
36
+
16
37
  ## 0.2.6 - 2026-01-23
17
38
 
18
39
 
package/README.md CHANGED
@@ -7,8 +7,8 @@
7
7
 
8
8
  A cross-platform, high-performance PDF viewer for React Native and Expo, built on top of native* PDF rendering engines.
9
9
 
10
- | [iOS](./docs/preview-ios.mp4) | [Android](./docs/preview-android.mp4) |
11
- | ----------------------------------------------------------- | --------------------------------------------------------------- |
10
+ | [iOS](./docs/preview-ios.mp4) | [Android](./docs/preview-android.mp4) |
11
+ | -------------------------------------- | ---------------------------------------------- |
12
12
  | ![iOS preview](./docs/preview-ios.gif) | ![Android preview](./docs/preview-android.gif) |
13
13
 
14
14
  ## Features
@@ -18,13 +18,13 @@ A cross-platform, high-performance PDF viewer for React Native and Expo, built o
18
18
  - *Uses [kishannareshpal/AndroidPdfViewer](https://github.com/kishannareshpal/AndroidPdfViewer) on Android which is a maintained
19
19
  fork of [barteksc/AndroidPdfViewerV2](https://github.com/kishannareshpal/AndroidPdfViewer) which uses the open-source [PDFium](https://pdfium.googlesource.com/pdfium/+/HEAD/docs/getting-started.md) PDF rendering engine.
20
20
  - Note: We'll be looking to switch to [`androidx.pdf`](https://developer.android.com/jetpack/androidx/releases/pdf) on Android once that becomes stable.
21
- - Load PDFs from remote URLs or local file paths
22
- - Supports local file URIs on android and iOS and ContentResolver URIs on android.
23
- - Remote URLs cannot be passed directly to the PdfView component. You must download it and then use the local file URI to preview.
21
+ - Load PDFs from local file paths
22
+ - Supports local file URIs on android and iOS and ContentResolver URIs on android
24
23
  - Pinch-to-zoom / double-tap-to-zoom and drag gestures
25
24
  - Support for password-protected PDFs
26
25
  - Horizontal and vertical reading modes
27
26
  - Support for content-insets
27
+ - Color inversion
28
28
 
29
29
  ## Installation
30
30
 
@@ -242,6 +242,13 @@ export const App = () => {
242
242
  <td>How the document is scaled to fit within the viewer.</td>
243
243
  <td><code>"width"</code></td>
244
244
  </tr>
245
+ <tr>
246
+ <td><code>pageColorInverted</code></td>
247
+ <td>No</td>
248
+ <td><code>boolean</code></td>
249
+ <td>Whether the rendered page should have its color inverted (useful to simulate dark mode)</td>
250
+ <td><code>false</code></td>
251
+ </tr>
245
252
  <tr>
246
253
  <td><code>autoScale</code></td>
247
254
  <td>No</td>
@@ -56,6 +56,10 @@ class KJExpoPdfModule : Module() {
56
56
  view.setFitMode(mode)
57
57
  }
58
58
 
59
+ Prop("pageColorInverted") { view: KJExpoPdfView, enabled: Boolean? ->
60
+ view.setPageColorInverted(enabled)
61
+ }
62
+
59
63
  Prop("autoScale") { view: KJExpoPdfView, enabled: Boolean? ->
60
64
  view.setAutoScaleEnabled(enabled)
61
65
  }
@@ -22,6 +22,7 @@ class KJExpoPdfView(context: Context, appContext: AppContext) : ExpoView(context
22
22
  internal const val DEFAULT_AUTO_SCALE_ENABLED = true
23
23
  internal val DEFAULT_CONTENT_PADDING = Rect(0, 0, 0, 0)
24
24
  internal val DEFAULT_FIT_MODE = FitMode.both
25
+ internal val DEFAULT_PAGE_COLOR_INVERTED_ENABLED = false
25
26
  }
26
27
 
27
28
  private val onLoadComplete by EventDispatcher()
@@ -44,6 +45,7 @@ class KJExpoPdfView(context: Context, appContext: AppContext) : ExpoView(context
44
45
  private var contentPadding: Rect = DEFAULT_CONTENT_PADDING
45
46
  private var fitMode: FitMode = DEFAULT_FIT_MODE
46
47
  private var autoScaleEnabled: Boolean = DEFAULT_AUTO_SCALE_ENABLED
48
+ private var isPageColorInverted: Boolean = DEFAULT_PAGE_COLOR_INVERTED_ENABLED
47
49
 
48
50
  internal val pdfView = PDFView(context, null).apply {
49
51
  layoutParams = LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT)
@@ -113,6 +115,11 @@ class KJExpoPdfView(context: Context, appContext: AppContext) : ExpoView(context
113
115
  this.reloadPdf()
114
116
  }
115
117
 
118
+ fun setPageColorInverted(enabled: Boolean?) {
119
+ this.isPageColorInverted = enabled ?: DEFAULT_PAGE_COLOR_INVERTED_ENABLED
120
+ this.reloadPdf()
121
+ }
122
+
116
123
  fun setAutoScaleEnabled(enabled: Boolean?) {
117
124
  this.autoScaleEnabled = enabled ?: DEFAULT_AUTO_SCALE_ENABLED
118
125
  this.reloadPdf()
@@ -143,6 +150,7 @@ class KJExpoPdfView(context: Context, appContext: AppContext) : ExpoView(context
143
150
  .pageFitPolicy(this.fitMode.toFitPolicy())
144
151
  .enableDoubletap(this.isDoubleTapZoomEnabled)
145
152
  .swipeHorizontal(this.isHorizontalModeEnabled)
153
+ .nightMode(this.isPageColorInverted)
146
154
  .spacing(this.pageGap)
147
155
  .autoCenterOnResize(this.autoScaleEnabled)
148
156
  .contentPadding(
@@ -52,6 +52,13 @@ type BaseProps = ViewProps & {
52
52
  * Note: initial render always auto-scales according to `fitMode`.
53
53
  */
54
54
  autoScale?: boolean;
55
+ /**
56
+ * Inverts the color of the pages to make them dark.
57
+ * - This is useful for documents that have white pages so this can be used to make it dark, however the image colors in the document are also inverted.
58
+ *
59
+ * Defaults to false.
60
+ */
61
+ pageColorInverted?: boolean;
55
62
  };
56
63
  export type PdfViewProps = BaseProps & {
57
64
  onLoadComplete?: (params: OnLoadCompleteEventPayload) => void;
@@ -1 +1 @@
1
- {"version":3,"file":"pdf-view.d.ts","sourceRoot":"","sources":["../src/pdf-view.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,cAAc,EAAE,OAAO,EAAE,mBAAmB,EAAE,0BAA0B,EAAE,yBAAyB,EAAE,MAAM,SAAS,CAAC;AAC9H,OAAO,EAAoC,SAAS,EAAE,MAAM,cAAc,CAAC;AAG3E,KAAK,SAAS,GAAG,SAAS,GAAG;IAC3B;;;;;;OAMG;IACH,GAAG,EAAE,MAAM,CAAC;IAEZ;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB;;;;;OAKG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAE1B;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB;;OAEG;IACH,cAAc,CAAC,EAAE,cAAc,CAAC;IAEhC;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB;;;;;OAKG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,CAAA;AAgCD,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG;IACrC,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,0BAA0B,KAAK,IAAI,CAAC;IAC9D,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,yBAAyB,KAAK,IAAI,CAAC;IAC5D,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE,mBAAmB,KAAK,IAAI,CAAA;CAChD,CAAC;AAEF,eAAO,MAAM,OAAO,GAAI,6DAMrB,YAAY,sBAkBd,CAAA"}
1
+ {"version":3,"file":"pdf-view.d.ts","sourceRoot":"","sources":["../src/pdf-view.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,cAAc,EAAE,OAAO,EAAE,mBAAmB,EAAE,0BAA0B,EAAE,yBAAyB,EAAE,MAAM,SAAS,CAAC;AAC9H,OAAO,EAAoC,SAAS,EAAE,MAAM,cAAc,CAAC;AAG3E,KAAK,SAAS,GAAG,SAAS,GAAG;IAC3B;;;;;;OAMG;IACH,GAAG,EAAE,MAAM,CAAC;IAEZ;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB;;;;;OAKG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAE1B;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB;;OAEG;IACH,cAAc,CAAC,EAAE,cAAc,CAAC;IAEhC;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB;;;;;OAKG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;;;;OAKG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B,CAAA;AAgCD,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG;IACrC,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,0BAA0B,KAAK,IAAI,CAAC;IAC9D,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,yBAAyB,KAAK,IAAI,CAAC;IAC5D,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE,mBAAmB,KAAK,IAAI,CAAA;CAChD,CAAC;AAEF,eAAO,MAAM,OAAO,GAAI,6DAMrB,YAAY,sBAmBd,CAAA"}
package/build/pdf-view.js CHANGED
@@ -4,7 +4,7 @@ import { StyleSheet } from 'react-native';
4
4
  import { forwardNativeEventTo } from './utils';
5
5
  const NativePdfView = requireNativeView('KJExpoPdf');
6
6
  export const PdfView = ({ style, onLoadComplete, onError, onPageChanged, ...props }) => {
7
- return (<NativePdfView style={[styles.container, style]} uri={props.uri} doubleTapToZoom={props.doubleTapToZoom} horizontal={props.horizontal} pageGap={props.pageGap} pagingEnabled={props.pagingEnabled} password={props.password} contentPadding={props.contentPadding} fitMode={props.fitMode} autoScale={props.autoScale} onLoadComplete={forwardNativeEventTo(onLoadComplete)} onPageChanged={forwardNativeEventTo(onPageChanged)} onError={forwardNativeEventTo(onError)}/>);
7
+ return (<NativePdfView style={[styles.container, style]} uri={props.uri} doubleTapToZoom={props.doubleTapToZoom} horizontal={props.horizontal} pageGap={props.pageGap} pagingEnabled={props.pagingEnabled} password={props.password} contentPadding={props.contentPadding} fitMode={props.fitMode} autoScale={props.autoScale} pageColorInverted={props.pageColorInverted} onLoadComplete={forwardNativeEventTo(onLoadComplete)} onPageChanged={forwardNativeEventTo(onPageChanged)} onError={forwardNativeEventTo(onError)}/>);
8
8
  };
9
9
  const styles = StyleSheet.create({
10
10
  container: {
@@ -1 +1 @@
1
- {"version":3,"file":"pdf-view.js","sourceRoot":"","sources":["../src/pdf-view.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,MAAM,CAAC;AACzC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAwB,UAAU,EAAa,MAAM,cAAc,CAAC;AAC3E,OAAO,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAC;AAyF/C,MAAM,aAAa,GAA4C,iBAAiB,CAAC,WAAW,CAAC,CAAC;AAU9F,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,EACtB,KAAK,EACL,cAAc,EACd,OAAO,EACP,aAAa,EACb,GAAG,KAAK,EACK,EAAE,EAAE;IACjB,OAAO,CACL,CAAC,aAAa,CACZ,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,SAAS,EAAE,KAAK,CAAC,CAAC,CACjC,GAAG,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CACf,eAAe,CAAC,CAAC,KAAK,CAAC,eAAe,CAAC,CACvC,UAAU,CAAC,CAAC,KAAK,CAAC,UAAU,CAAC,CAC7B,OAAO,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,CACvB,aAAa,CAAC,CAAC,KAAK,CAAC,aAAa,CAAC,CACnC,QAAQ,CAAC,CAAC,KAAK,CAAC,QAAQ,CAAC,CACzB,cAAc,CAAC,CAAC,KAAK,CAAC,cAAc,CAAC,CACrC,OAAO,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,CACvB,SAAS,CAAC,CAAC,KAAK,CAAC,SAAS,CAAC,CAC3B,cAAc,CAAC,CAAC,oBAAoB,CAAC,cAAc,CAAC,CAAC,CACrD,aAAa,CAAC,CAAC,oBAAoB,CAAC,aAAa,CAAC,CAAC,CACnD,OAAO,CAAC,CAAC,oBAAoB,CAAC,OAAO,CAAC,CAAC,EACvC,CACH,CAAA;AACH,CAAC,CAAA;AAED,MAAM,MAAM,GAAG,UAAU,CAAC,MAAM,CAAC;IAC/B,SAAS,EAAE;QACT,eAAe,EAAE,SAAS;KAC3B;CACF,CAAC,CAAA","sourcesContent":["import { requireNativeView } from 'expo';\nimport * as React from 'react';\n\nimport { ContentPadding, FitMode, OnErrorEventPayload, OnLoadCompleteEventPayload, OnPageChangedEventPayload } from './types';\nimport { NativeSyntheticEvent, StyleSheet, ViewProps } from 'react-native';\nimport { forwardNativeEventTo } from './utils';\n\ntype BaseProps = ViewProps & {\n /**\n * The file URI.\n *\n * Accepts either:\n * - a remote resource (e.g., https://…)\n * - a local file path (e.g., file:///…)\n */\n uri: string;\n\n /**\n * Password used to open password-protected or encrypted PDFs.\n * If not provided, locked documents will fail to load.\n */\n password?: string;\n\n /**\n * Enables page-by-page snapping instead of free scrolling.\n *\n * Defaults to vertical paging. If `horizontal` is true,\n * paging occurs horizontally instead.\n */\n pagingEnabled?: boolean;\n\n /**\n * Enables zoom in/out via double-tap gestures on the document.\n */\n doubleTapToZoom?: boolean;\n\n /**\n * Renders and scrolls pages horizontally instead of vertically.\n *\n * If `pagingEnabled` is true, page snapping will follow the same direction.\n */\n horizontal?: boolean;\n\n /**\n * Space between adjacent pages, expressed in layout units (dp/px depending on platform).\n */\n pageGap?: number;\n\n /**\n * Padding applied around the document inside the viewer container.\n */\n contentPadding?: ContentPadding;\n\n /**\n * Determines how the document is scaled to fit within the viewer\n * (e.g., fit to width, height, or entire page depending on enum value).\n */\n fitMode?: FitMode;\n\n /**\n * Automatically rescales the document when its own layout\n * or its parent view’s layout changes after initial render.\n *\n * Note: initial render always auto-scales according to `fitMode`.\n */\n autoScale?: boolean;\n}\n\ntype NativePdfViewProps = BaseProps & {\n /**\n * Fired after the PDF document has been fully loaded\n * and its metadata (such as page count) is available.\n */\n onLoadComplete?: (\n event: NativeSyntheticEvent<OnLoadCompleteEventPayload>\n ) => void;\n\n /**\n * Fired when the currently visible page changes due to user interaction\n * or programmatic scroll/paging.\n */\n onPageChanged?: (\n event: NativeSyntheticEvent<OnPageChangedEventPayload>\n ) => void;\n\n /**\n * Fired when the PDF fails to load, decrypt, or render.\n * The payload contains error information.\n */\n onError?: (\n event: NativeSyntheticEvent<OnErrorEventPayload>\n ) => void;\n};\n\nconst NativePdfView: React.ComponentType<NativePdfViewProps> = requireNativeView('KJExpoPdf');\n\n// -----------\n\nexport type PdfViewProps = BaseProps & {\n onLoadComplete?: (params: OnLoadCompleteEventPayload) => void,\n onPageChanged?: (params: OnPageChangedEventPayload) => void,\n onError?: (params: OnErrorEventPayload) => void\n};\n\nexport const PdfView = ({\n style,\n onLoadComplete,\n onError,\n onPageChanged,\n ...props\n}: PdfViewProps) => {\n return (\n <NativePdfView\n style={[styles.container, style]}\n uri={props.uri}\n doubleTapToZoom={props.doubleTapToZoom}\n horizontal={props.horizontal}\n pageGap={props.pageGap}\n pagingEnabled={props.pagingEnabled}\n password={props.password}\n contentPadding={props.contentPadding}\n fitMode={props.fitMode}\n autoScale={props.autoScale}\n onLoadComplete={forwardNativeEventTo(onLoadComplete)}\n onPageChanged={forwardNativeEventTo(onPageChanged)}\n onError={forwardNativeEventTo(onError)}\n />\n )\n}\n\nconst styles = StyleSheet.create({\n container: {\n backgroundColor: '#eeeeee'\n }\n})\n"]}
1
+ {"version":3,"file":"pdf-view.js","sourceRoot":"","sources":["../src/pdf-view.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,MAAM,CAAC;AACzC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAwB,UAAU,EAAa,MAAM,cAAc,CAAC;AAC3E,OAAO,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAC;AAiG/C,MAAM,aAAa,GAA4C,iBAAiB,CAAC,WAAW,CAAC,CAAC;AAU9F,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,EACtB,KAAK,EACL,cAAc,EACd,OAAO,EACP,aAAa,EACb,GAAG,KAAK,EACK,EAAE,EAAE;IACjB,OAAO,CACL,CAAC,aAAa,CACZ,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,SAAS,EAAE,KAAK,CAAC,CAAC,CACjC,GAAG,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CACf,eAAe,CAAC,CAAC,KAAK,CAAC,eAAe,CAAC,CACvC,UAAU,CAAC,CAAC,KAAK,CAAC,UAAU,CAAC,CAC7B,OAAO,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,CACvB,aAAa,CAAC,CAAC,KAAK,CAAC,aAAa,CAAC,CACnC,QAAQ,CAAC,CAAC,KAAK,CAAC,QAAQ,CAAC,CACzB,cAAc,CAAC,CAAC,KAAK,CAAC,cAAc,CAAC,CACrC,OAAO,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,CACvB,SAAS,CAAC,CAAC,KAAK,CAAC,SAAS,CAAC,CAC3B,iBAAiB,CAAC,CAAC,KAAK,CAAC,iBAAiB,CAAC,CAC3C,cAAc,CAAC,CAAC,oBAAoB,CAAC,cAAc,CAAC,CAAC,CACrD,aAAa,CAAC,CAAC,oBAAoB,CAAC,aAAa,CAAC,CAAC,CACnD,OAAO,CAAC,CAAC,oBAAoB,CAAC,OAAO,CAAC,CAAC,EACvC,CACH,CAAA;AACH,CAAC,CAAA;AAED,MAAM,MAAM,GAAG,UAAU,CAAC,MAAM,CAAC;IAC/B,SAAS,EAAE;QACT,eAAe,EAAE,SAAS;KAC3B;CACF,CAAC,CAAA","sourcesContent":["import { requireNativeView } from 'expo';\nimport * as React from 'react';\n\nimport { ContentPadding, FitMode, OnErrorEventPayload, OnLoadCompleteEventPayload, OnPageChangedEventPayload } from './types';\nimport { NativeSyntheticEvent, StyleSheet, ViewProps } from 'react-native';\nimport { forwardNativeEventTo } from './utils';\n\ntype BaseProps = ViewProps & {\n /**\n * The file URI.\n *\n * Accepts either:\n * - a remote resource (e.g., https://…)\n * - a local file path (e.g., file:///…)\n */\n uri: string;\n\n /**\n * Password used to open password-protected or encrypted PDFs.\n * If not provided, locked documents will fail to load.\n */\n password?: string;\n\n /**\n * Enables page-by-page snapping instead of free scrolling.\n *\n * Defaults to vertical paging. If `horizontal` is true,\n * paging occurs horizontally instead.\n */\n pagingEnabled?: boolean;\n\n /**\n * Enables zoom in/out via double-tap gestures on the document.\n */\n doubleTapToZoom?: boolean;\n\n /**\n * Renders and scrolls pages horizontally instead of vertically.\n *\n * If `pagingEnabled` is true, page snapping will follow the same direction.\n */\n horizontal?: boolean;\n\n /**\n * Space between adjacent pages, expressed in layout units (dp/px depending on platform).\n */\n pageGap?: number;\n\n /**\n * Padding applied around the document inside the viewer container.\n */\n contentPadding?: ContentPadding;\n\n /**\n * Determines how the document is scaled to fit within the viewer\n * (e.g., fit to width, height, or entire page depending on enum value).\n */\n fitMode?: FitMode;\n\n /**\n * Automatically rescales the document when its own layout\n * or its parent view’s layout changes after initial render.\n *\n * Note: initial render always auto-scales according to `fitMode`.\n */\n autoScale?: boolean;\n\n /**\n * Inverts the color of the pages to make them dark.\n * - This is useful for documents that have white pages so this can be used to make it dark, however the image colors in the document are also inverted.\n *\n * Defaults to false.\n */\n pageColorInverted?: boolean;\n}\n\ntype NativePdfViewProps = BaseProps & {\n /**\n * Fired after the PDF document has been fully loaded\n * and its metadata (such as page count) is available.\n */\n onLoadComplete?: (\n event: NativeSyntheticEvent<OnLoadCompleteEventPayload>\n ) => void;\n\n /**\n * Fired when the currently visible page changes due to user interaction\n * or programmatic scroll/paging.\n */\n onPageChanged?: (\n event: NativeSyntheticEvent<OnPageChangedEventPayload>\n ) => void;\n\n /**\n * Fired when the PDF fails to load, decrypt, or render.\n * The payload contains error information.\n */\n onError?: (\n event: NativeSyntheticEvent<OnErrorEventPayload>\n ) => void;\n};\n\nconst NativePdfView: React.ComponentType<NativePdfViewProps> = requireNativeView('KJExpoPdf');\n\n// -----------\n\nexport type PdfViewProps = BaseProps & {\n onLoadComplete?: (params: OnLoadCompleteEventPayload) => void,\n onPageChanged?: (params: OnPageChangedEventPayload) => void,\n onError?: (params: OnErrorEventPayload) => void\n};\n\nexport const PdfView = ({\n style,\n onLoadComplete,\n onError,\n onPageChanged,\n ...props\n}: PdfViewProps) => {\n return (\n <NativePdfView\n style={[styles.container, style]}\n uri={props.uri}\n doubleTapToZoom={props.doubleTapToZoom}\n horizontal={props.horizontal}\n pageGap={props.pageGap}\n pagingEnabled={props.pagingEnabled}\n password={props.password}\n contentPadding={props.contentPadding}\n fitMode={props.fitMode}\n autoScale={props.autoScale}\n pageColorInverted={props.pageColorInverted}\n onLoadComplete={forwardNativeEventTo(onLoadComplete)}\n onPageChanged={forwardNativeEventTo(onPageChanged)}\n onError={forwardNativeEventTo(onError)}\n />\n )\n}\n\nconst styles = StyleSheet.create({\n container: {\n backgroundColor: '#eeeeee'\n }\n})\n"]}
@@ -47,6 +47,10 @@ public class KJExpoPdfModule: Module {
47
47
  view.setFitMode(fitMode)
48
48
  }
49
49
 
50
+ Prop("pageColorInverted") { (view: KJExpoPdfView, enabled: Bool?) in
51
+ view.setPageColorInverted(enabled)
52
+ }
53
+
50
54
  Prop("autoScale") { (view: KJExpoPdfView, enabled: Bool?) in
51
55
  view.setAutoScaleEnabled(enabled)
52
56
  }
@@ -12,6 +12,7 @@ class KJExpoPdfView: ExpoView {
12
12
  static let DEFAULT_CONTENT_PADDING = UIEdgeInsets.zero
13
13
  static let DEFAULT_FIT_MODE = FitMode.both
14
14
  static let DEFAULT_AUTO_SCALE_ENABLED = true
15
+ static let DEFAULT_PAGE_COLOR_INVERTED_ENABLED = false
15
16
 
16
17
  let onLoadComplete = EventDispatcher()
17
18
  let onPageChanged = EventDispatcher()
@@ -39,6 +40,7 @@ class KJExpoPdfView: ExpoView {
39
40
  private var contentPadding: UIEdgeInsets = DEFAULT_CONTENT_PADDING
40
41
  private var fitMode: FitMode = DEFAULT_FIT_MODE
41
42
  private var isAutoScaleEnabled: Bool = DEFAULT_AUTO_SCALE_ENABLED
43
+ private var isPageColorInverted: Bool = DEFAULT_PAGE_COLOR_INVERTED_ENABLED
42
44
 
43
45
  required init(appContext: AppContext? = nil) {
44
46
  super.init(appContext: appContext)
@@ -177,6 +179,12 @@ class KJExpoPdfView: ExpoView {
177
179
  self.pdfView.scaleToFit(
178
180
  contentPadding: self.contentPadding, fitMode: self.fitMode, resetScrollOffset: false)
179
181
  }
182
+
183
+ func setPageColorInverted(_ enabled: Bool?) {
184
+ self.isPageColorInverted = enabled ?? Self.DEFAULT_PAGE_COLOR_INVERTED_ENABLED
185
+
186
+ self.pdfView.layer.compositingFilter = self.isPageColorInverted ? "differenceBlendMode" : nil
187
+ }
180
188
 
181
189
  func setAutoScaleEnabled(_ enabled: Bool?) {
182
190
  self.isAutoScaleEnabled = enabled ?? Self.DEFAULT_AUTO_SCALE_ENABLED
@@ -235,7 +243,6 @@ class KJExpoPdfView: ExpoView {
235
243
  return nil
236
244
  }
237
245
 
238
- // TODO: Apple PDFView supports "http", "https" - but I've not implemented it on Android so for consistency I'm explicitly not allowing it here until then.
239
246
  guard ["file"].contains(self.documentURL?.scheme?.lowercased()) else {
240
247
  reportError(
241
248
  .invalidUri,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kishannareshpal/expo-pdf",
3
- "version": "0.2.6",
3
+ "version": "0.3.0",
4
4
  "author": "Kishan Jadav <kishan_jadav@hotmail.com> (https://github.com/kishannareshpal)",
5
5
  "repository": "https://github.com/kishannareshpal/expo-pdf",
6
6
  "main": "build/index.js",
package/release_body.txt CHANGED
@@ -1,7 +1,17 @@
1
1
 
2
+ ### ✨ Features
3
+
4
+ - feat: support color inversion on ios and android ([8951a5c](https://github.com/kishannareshpal/expo-pdf/commit/8951a5c4162e863cb00f21959afe66509a66890d)) by `Kishan Jadav @ mozexames`
5
+
6
+
2
7
  ### 📚 Documentation
3
8
 
4
- - docs: add lib banner ([280c81d](https://github.com/kishannareshpal/expo-pdf/commit/280c81db748787e6341a3bb46663643620b89225)) by `Kishan Jadav`
9
+ - docs: color inversion ([bb4ed8f](https://github.com/kishannareshpal/expo-pdf/commit/bb4ed8f527a3201a555da62446e4e33831546e75)) by `Kishan Jadav`
10
+
11
+
12
+ ### 🧹 Chores
13
+
14
+ - chore: add color inversion example ([9c90bae](https://github.com/kishannareshpal/expo-pdf/commit/9c90bae266ca489dfb4cb89bf5b9a3d5ce838e2e)) by `Kishan Jadav`
5
15
 
6
16
 
7
- **Full Changelog**: https://github.com/kishannareshpal/expo-pdf/compare/v0.2.5...v0.2.6
17
+ **Full Changelog**: https://github.com/kishannareshpal/expo-pdf/compare/v0.2.6...v0.3.0
package/src/pdf-view.tsx CHANGED
@@ -64,6 +64,14 @@ type BaseProps = ViewProps & {
64
64
  * Note: initial render always auto-scales according to `fitMode`.
65
65
  */
66
66
  autoScale?: boolean;
67
+
68
+ /**
69
+ * Inverts the color of the pages to make them dark.
70
+ * - This is useful for documents that have white pages so this can be used to make it dark, however the image colors in the document are also inverted.
71
+ *
72
+ * Defaults to false.
73
+ */
74
+ pageColorInverted?: boolean;
67
75
  }
68
76
 
69
77
  type NativePdfViewProps = BaseProps & {
@@ -121,6 +129,7 @@ export const PdfView = ({
121
129
  contentPadding={props.contentPadding}
122
130
  fitMode={props.fitMode}
123
131
  autoScale={props.autoScale}
132
+ pageColorInverted={props.pageColorInverted}
124
133
  onLoadComplete={forwardNativeEventTo(onLoadComplete)}
125
134
  onPageChanged={forwardNativeEventTo(onPageChanged)}
126
135
  onError={forwardNativeEventTo(onError)}