react-native-pdf-jsi 4.2.2 → 4.3.1

package/README.md

@@ -9,8 +9,10 @@
 ---
 
 [![npm version](https://img.shields.io/npm/v/react-native-pdf-jsi?style=flat-square&logo=npm&color=cb3837)](https://www.npmjs.com/package/react-native-pdf-jsi)
+[![Expo Compatible](https://img.shields.io/badge/Expo-Compatible-4630EB?style=flat-square&logo=expo)](https://expo.dev)
 [![total downloads](https://img.shields.io/npm/dt/react-native-pdf-jsi?style=flat-square&logo=npm&color=cb3837)](https://www.npmjs.com/package/react-native-pdf-jsi)
 [![weekly downloads](https://img.shields.io/npm/dw/react-native-pdf-jsi?style=flat-square&logo=npm&color=cb3837)](https://www.npmjs.com/package/react-native-pdf-jsi)
+[![monthly downloads](https://img.shields.io/npm/dm/react-native-pdf-jsi?style=flat-square&logo=npm&color=cb3837)](https://www.npmjs.com/package/react-native-pdf-jsi)
 [![GitHub stars](https://img.shields.io/github/stars/126punith/react-native-pdf-jsi?style=flat-square&logo=github&color=181717)](https://github.com/126punith/react-native-pdf-jsi)
 [![license](https://img.shields.io/npm/l/react-native-pdf-jsi?style=flat-square&color=green)](https://github.com/126punith/react-native-pdf-jsi/blob/main/LICENSE)
 
@@ -111,6 +113,51 @@ react-native link react-native-blob-util
 react-native link react-native-pdf-jsi
 ```
 
+### Expo Installation
+
+This package works with **Expo development builds** (not Expo Go, as it requires native code).
+
+**1. Install the package and peer dependencies:**
+
+```bash
+npx expo install react-native-pdf-jsi react-native-blob-util @react-native-async-storage/async-storage
+```
+
+**2. Add the config plugin to your `app.json` or `app.config.js`:**
+
+```json
+{
+  "expo": {
+    "plugins": ["react-native-pdf-jsi"]
+  }
+}
+```
+
+**3. Rebuild your development build:**
+
+```bash
+# Generate native projects
+npx expo prebuild
+
+# Run on iOS
+npx expo run:ios
+
+# Run on Android
+npx expo run:android
+```
+
+> **Note:** The config plugin automatically configures:
+> - Android: Adds Jitpack repository for PDF rendering dependencies
+> - iOS: Ensures PDFKit framework is properly linked
+
+**For EAS Build users:**
+
+```bash
+# Build development client
+eas build --profile development --platform ios
+eas build --profile development --platform android
+```
+
 ### Windows Installation
 
 1. Open your solution in Visual Studio 2019 (e.g., `windows\yourapp.sln`)
@@ -410,6 +457,28 @@ MIT License - see [LICENSE](LICENSE) file for details.
 
 ## Recent Fixes
 
+### Android PDF Preserved on Navigation (v4.3.1)
+Fixed issue where the PDF instance was destroyed on Android when navigating away and returning to the screen ([#20](https://github.com/126punith/react-native-pdf-jsi/issues/20)). The PDF is now preserved in memory during navigation (matching iOS behavior) and only recycled when the component unmounts.
+
+### Expo Support (v4.3.0)
+Added Expo config plugin for seamless integration with Expo development builds. The package now works with `npx expo prebuild` and `npx expo run:ios/android`.
+
+**Installation:**
+```bash
+npx expo install react-native-pdf-jsi react-native-blob-util @react-native-async-storage/async-storage
+```
+
+**Configuration (app.json):**
+```json
+{
+  "expo": {
+    "plugins": ["react-native-pdf-jsi"]
+  }
+}
+```
+
+**Note:** Expo Go is NOT supported (requires native code). Use Expo development builds.
+
 ### PDFCompressor Module Fix (v4.2.2)
 Fixed "Unable to resolve module react-native-pdf-jsi/src/PDFCompressor" error ([#17](https://github.com/126punith/react-native-pdf-jsi/issues/17)). The PDFCompressor module is now properly exported and accessible. Also fixed iOS compilation error for missing `RCTLogInfo` import. The compression feature now works correctly with accurate size estimates (~15-18% compression using native zlib deflate).
 

package/android/src/main/java/org/wonday/pdf/PdfManager.java

@@ -60,7 +60,8 @@ public class PdfManager extends SimpleViewManager<PdfView> implements RNPDFPdfVi
 
     @Override
     public void onDropViewInstance(PdfView pdfView) {
-        pdfView = null;
+        pdfView.recycle();
+        this.pdfView = null;
     }
 
     @ReactProp(name = "path")

package/android/src/main/java/org/wonday/pdf/PdfView.java

@@ -349,6 +349,18 @@ public class PdfView extends PDFView implements OnPageChangeListener,OnLoadCompl
             this.drawPdf();
     }
 
+    /**
+     * Override to prevent barteksc PDFView's recycle() on navigation.
+     * The parent class calls recycle() in onDetachedFromWindow, which destroys the PDF
+     * when the view is temporarily detached (e.g., navigating to another screen).
+     * We only recycle when PdfManager.onDropViewInstance is called (component unmount).
+     */
+    @Override
+    protected void onDetachedFromWindow() {
+        // Intentionally skip super to prevent barteksc PDFView's recycle() which destroys
+        // the PDF on navigation. We only recycle when PdfManager.onDropViewInstance is called.
+    }
+
     public void drawPdf() {
         
         // FIX: Check if we actually need to reload the document

package/app.plugin.js

@@ -0,0 +1,2 @@
+// Expo config plugin entry point
+module.exports = require('./plugin/build').default;

package/package.json

@@ -1,10 +1,13 @@
 {
     "name": "react-native-pdf-jsi",
-    "version": "4.2.2",
+    "version": "4.3.1",
     "summary": "High-performance React Native PDF viewer with JSI acceleration - up to 80x faster than traditional bridge",
     "description": "🚀 Ultra-fast React Native PDF viewer with JSI (JavaScript Interface) integration for maximum performance. Features lazy loading, smart caching, progressive loading, and zero-bridge overhead operations. Perfect for large PDF files with 30-day persistent cache and advanced memory optimization. Google Play 16KB page size compliant for Android 15+. Supports iOS, Android, and Windows platforms.",
     "main": "index.js",
     "typings": "./index.d.ts",
+    "app": {
+        "plugin": "./plugin/build"
+    },
     "repository": {
         "type": "git",
         "url": "git+https://github.com/126punith/react-native-pdf-jsi.git"
@@ -50,7 +53,9 @@
         "optimization",
         "caching",
         "persistent-cache",
-        "react-native-pdf-jsi-enhanced"
+        "react-native-pdf-jsi-enhanced",
+        "expo",
+        "expo-plugin"
     ],
     "author": {
         "name": "Punith M",
@@ -69,7 +74,13 @@
     "devDependencies": {
         "@babel/core": "^7.20.2",
         "@babel/runtime": "^7.20.1",
-        "prop-types": "^15.7.2"
+        "@expo/config-plugins": "^9.0.0",
+        "prop-types": "^15.7.2",
+        "typescript": "^5.0.0"
+    },
+    "scripts": {
+        "build:plugin": "tsc -p plugin/tsconfig.json",
+        "prepublishOnly": "npm run build:plugin"
     },
     "peerDependencies": {
         "@react-native-async-storage/async-storage": ">=1.17.0",
@@ -82,6 +93,8 @@
         "ios/",
         "windows/",
         "src/",
+        "plugin/",
+        "app.plugin.js",
         "DoubleTapView.js",
         "index.d.ts",
         "index.js",

package/plugin/build/index.d.ts

@@ -0,0 +1,3 @@
+import { ConfigPlugin } from '@expo/config-plugins';
+declare const _default: ConfigPlugin<void>;
+export default _default;

package/plugin/build/index.js

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const config_plugins_1 = require("@expo/config-plugins");
+const withPdfJsiAndroid_1 = require("./withPdfJsiAndroid");
+const withPdfJsiIos_1 = require("./withPdfJsiIos");
+const pkg = require('../../package.json');
+/**
+ * Expo config plugin for react-native-pdf-jsi
+ *
+ * This plugin configures the native projects for Expo development builds.
+ * It handles:
+ * - Android: Jitpack repository for AndroidPdfViewer, NDK configuration
+ * - iOS: PDFKit framework linking
+ *
+ * Note: This package requires development builds and won't work with Expo Go.
+ */
+const withPdfJsi = (config) => {
+    // Warn about peer dependencies
+    console.log('[react-native-pdf-jsi] Remember to install peer dependencies:\n' +
+        '  - react-native-blob-util\n' +
+        '  - @react-native-async-storage/async-storage');
+    config = (0, withPdfJsiAndroid_1.withPdfJsiAndroid)(config);
+    config = (0, withPdfJsiIos_1.withPdfJsiIos)(config);
+    return config;
+};
+exports.default = (0, config_plugins_1.createRunOncePlugin)(withPdfJsi, pkg.name, pkg.version);

package/plugin/build/withPdfJsiAndroid.d.ts

@@ -0,0 +1,8 @@
+import { ConfigPlugin } from '@expo/config-plugins';
+/**
+ * Android config plugin for react-native-pdf-jsi
+ *
+ * Configures the Android project to support the PDF library:
+ * - Adds Jitpack repository for AndroidPdfViewer dependency
+ */
+export declare const withPdfJsiAndroid: ConfigPlugin;

package/plugin/build/withPdfJsiAndroid.js

@@ -0,0 +1,55 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.withPdfJsiAndroid = void 0;
+const config_plugins_1 = require("@expo/config-plugins");
+/**
+ * Android config plugin for react-native-pdf-jsi
+ *
+ * Configures the Android project to support the PDF library:
+ * - Adds Jitpack repository for AndroidPdfViewer dependency
+ */
+const withPdfJsiAndroid = (config) => {
+    return (0, config_plugins_1.withProjectBuildGradle)(config, (config) => {
+        if (config.modResults.language === 'groovy') {
+            config.modResults.contents = addJitpackRepository(config.modResults.contents);
+        }
+        return config;
+    });
+};
+exports.withPdfJsiAndroid = withPdfJsiAndroid;
+/**
+ * Add Jitpack repository to the project's build.gradle if not already present.
+ * This is required for the AndroidPdfViewer dependency.
+ */
+function addJitpackRepository(buildGradle) {
+    const jitpackUrl = "maven { url 'https://jitpack.io' }";
+    // Check if Jitpack is already added
+    if (buildGradle.includes('jitpack.io')) {
+        return buildGradle;
+    }
+    // Find the allprojects { repositories { ... } } block and add Jitpack
+    const allProjectsPattern = /allprojects\s*\{[\s\S]*?repositories\s*\{/;
+    const match = buildGradle.match(allProjectsPattern);
+    if (match) {
+        // Add Jitpack after the opening of repositories block
+        const insertPosition = match.index + match[0].length;
+        return (buildGradle.slice(0, insertPosition) +
+            `\n        ${jitpackUrl}` +
+            buildGradle.slice(insertPosition));
+    }
+    // If allprojects block exists but repositories block doesn't have the expected format,
+    // try to add it in a different way
+    if (buildGradle.includes('allprojects')) {
+        // Look for maven { url pattern in allprojects section
+        const mavenCentralPattern = /(allprojects\s*\{[\s\S]*?repositories\s*\{[\s\S]*?)(mavenCentral\(\)|google\(\))/;
+        const mavenMatch = buildGradle.match(mavenCentralPattern);
+        if (mavenMatch) {
+            return buildGradle.replace(mavenCentralPattern, `$1$2\n        ${jitpackUrl}`);
+        }
+    }
+    // If we couldn't find a good place, add a comment for manual addition
+    console.warn('[react-native-pdf-jsi] Could not automatically add Jitpack repository.\n' +
+        'Please manually add the following to your android/build.gradle:\n' +
+        "maven { url 'https://jitpack.io' }");
+    return buildGradle;
+}

package/plugin/build/withPdfJsiIos.d.ts

@@ -0,0 +1,11 @@
+import { ConfigPlugin } from '@expo/config-plugins';
+/**
+ * iOS config plugin for react-native-pdf-jsi
+ *
+ * Configures the iOS project to support the PDF library:
+ * - Ensures PDFKit framework is properly linked (handled automatically by CocoaPods)
+ *
+ * Note: Most iOS configuration is handled by the podspec file.
+ * This plugin exists for any additional Xcode project modifications if needed.
+ */
+export declare const withPdfJsiIos: ConfigPlugin;

package/plugin/build/withPdfJsiIos.js

@@ -0,0 +1,34 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.withPdfJsiIos = void 0;
+const config_plugins_1 = require("@expo/config-plugins");
+/**
+ * iOS config plugin for react-native-pdf-jsi
+ *
+ * Configures the iOS project to support the PDF library:
+ * - Ensures PDFKit framework is properly linked (handled automatically by CocoaPods)
+ *
+ * Note: Most iOS configuration is handled by the podspec file.
+ * This plugin exists for any additional Xcode project modifications if needed.
+ */
+const withPdfJsiIos = (config) => {
+    return (0, config_plugins_1.withXcodeProject)(config, async (config) => {
+        const xcodeProject = config.modResults;
+        // PDFKit framework is automatically linked through the podspec's s.framework = "PDFKit"
+        // This plugin hook is here for any future iOS-specific configurations
+        // Ensure the project has the PDFKit framework if needed
+        // (This is typically handled by CocoaPods, but we can add it explicitly if necessary)
+        const frameworks = xcodeProject.pbxFrameworksBuildPhaseObj(xcodeProject.getFirstTarget().uuid);
+        if (frameworks) {
+            // Check if PDFKit is already linked
+            const pdfKitLinked = Object.values(frameworks.files || {}).some((file) => { var _a; return (_a = file === null || file === void 0 ? void 0 : file.comment) === null || _a === void 0 ? void 0 : _a.includes('PDFKit'); });
+            if (!pdfKitLinked) {
+                // PDFKit is a system framework, it will be linked via the podspec
+                // No manual linking required in most cases
+                console.log('[react-native-pdf-jsi] iOS: PDFKit will be linked via CocoaPods');
+            }
+        }
+        return config;
+    });
+};
+exports.withPdfJsiIos = withPdfJsiIos;

package/plugin/src/index.ts

@@ -0,0 +1,31 @@
+import { ConfigPlugin, createRunOncePlugin } from '@expo/config-plugins';
+import { withPdfJsiAndroid } from './withPdfJsiAndroid';
+import { withPdfJsiIos } from './withPdfJsiIos';
+
+const pkg = require('../../package.json');
+
+/**
+ * Expo config plugin for react-native-pdf-jsi
+ * 
+ * This plugin configures the native projects for Expo development builds.
+ * It handles:
+ * - Android: Jitpack repository for AndroidPdfViewer, NDK configuration
+ * - iOS: PDFKit framework linking
+ * 
+ * Note: This package requires development builds and won't work with Expo Go.
+ */
+const withPdfJsi: ConfigPlugin = (config) => {
+  // Warn about peer dependencies
+  console.log(
+    '[react-native-pdf-jsi] Remember to install peer dependencies:\n' +
+    '  - react-native-blob-util\n' +
+    '  - @react-native-async-storage/async-storage'
+  );
+
+  config = withPdfJsiAndroid(config);
+  config = withPdfJsiIos(config);
+  
+  return config;
+};
+
+export default createRunOncePlugin(withPdfJsi, pkg.name, pkg.version);

package/plugin/src/withPdfJsiAndroid.ts

@@ -0,0 +1,67 @@
+import { ConfigPlugin, withProjectBuildGradle } from '@expo/config-plugins';
+
+/**
+ * Android config plugin for react-native-pdf-jsi
+ * 
+ * Configures the Android project to support the PDF library:
+ * - Adds Jitpack repository for AndroidPdfViewer dependency
+ */
+export const withPdfJsiAndroid: ConfigPlugin = (config) => {
+  return withProjectBuildGradle(config, (config) => {
+    if (config.modResults.language === 'groovy') {
+      config.modResults.contents = addJitpackRepository(config.modResults.contents);
+    }
+    return config;
+  });
+};
+
+/**
+ * Add Jitpack repository to the project's build.gradle if not already present.
+ * This is required for the AndroidPdfViewer dependency.
+ */
+function addJitpackRepository(buildGradle: string): string {
+  const jitpackUrl = "maven { url 'https://jitpack.io' }";
+  
+  // Check if Jitpack is already added
+  if (buildGradle.includes('jitpack.io')) {
+    return buildGradle;
+  }
+
+  // Find the allprojects { repositories { ... } } block and add Jitpack
+  const allProjectsPattern = /allprojects\s*\{[\s\S]*?repositories\s*\{/;
+  const match = buildGradle.match(allProjectsPattern);
+
+  if (match) {
+    // Add Jitpack after the opening of repositories block
+    const insertPosition = match.index! + match[0].length;
+    return (
+      buildGradle.slice(0, insertPosition) +
+      `\n        ${jitpackUrl}` +
+      buildGradle.slice(insertPosition)
+    );
+  }
+
+  // If allprojects block exists but repositories block doesn't have the expected format,
+  // try to add it in a different way
+  if (buildGradle.includes('allprojects')) {
+    // Look for maven { url pattern in allprojects section
+    const mavenCentralPattern = /(allprojects\s*\{[\s\S]*?repositories\s*\{[\s\S]*?)(mavenCentral\(\)|google\(\))/;
+    const mavenMatch = buildGradle.match(mavenCentralPattern);
+    
+    if (mavenMatch) {
+      return buildGradle.replace(
+        mavenCentralPattern,
+        `$1$2\n        ${jitpackUrl}`
+      );
+    }
+  }
+
+  // If we couldn't find a good place, add a comment for manual addition
+  console.warn(
+    '[react-native-pdf-jsi] Could not automatically add Jitpack repository.\n' +
+    'Please manually add the following to your android/build.gradle:\n' +
+    "maven { url 'https://jitpack.io' }"
+  );
+
+  return buildGradle;
+}

package/plugin/src/withPdfJsiIos.ts

@@ -0,0 +1,40 @@
+import { ConfigPlugin, withXcodeProject } from '@expo/config-plugins';
+
+/**
+ * iOS config plugin for react-native-pdf-jsi
+ * 
+ * Configures the iOS project to support the PDF library:
+ * - Ensures PDFKit framework is properly linked (handled automatically by CocoaPods)
+ * 
+ * Note: Most iOS configuration is handled by the podspec file.
+ * This plugin exists for any additional Xcode project modifications if needed.
+ */
+export const withPdfJsiIos: ConfigPlugin = (config) => {
+  return withXcodeProject(config, async (config) => {
+    const xcodeProject = config.modResults;
+    
+    // PDFKit framework is automatically linked through the podspec's s.framework = "PDFKit"
+    // This plugin hook is here for any future iOS-specific configurations
+    
+    // Ensure the project has the PDFKit framework if needed
+    // (This is typically handled by CocoaPods, but we can add it explicitly if necessary)
+    const frameworks = xcodeProject.pbxFrameworksBuildPhaseObj(
+      xcodeProject.getFirstTarget().uuid
+    );
+    
+    if (frameworks) {
+      // Check if PDFKit is already linked
+      const pdfKitLinked = Object.values(frameworks.files || {}).some(
+        (file: any) => file?.comment?.includes('PDFKit')
+      );
+      
+      if (!pdfKitLinked) {
+        // PDFKit is a system framework, it will be linked via the podspec
+        // No manual linking required in most cases
+        console.log('[react-native-pdf-jsi] iOS: PDFKit will be linked via CocoaPods');
+      }
+    }
+    
+    return config;
+  });
+};

package/plugin/tsconfig.json

@@ -0,0 +1,14 @@
+{
+  "compilerOptions": {
+    "outDir": "./build",
+    "rootDir": "./src",
+    "module": "commonjs",
+    "target": "ES2019",
+    "declaration": true,
+    "strict": true,
+    "esModuleInterop": true,
+    "skipLibCheck": true,
+    "resolveJsonModule": true
+  },
+  "include": ["src/**/*"]
+}