Load text-encoding for older versions only

Example/android/app/build.gradle

@@ -107,7 +107,7 @@ android {
 dependencies {
     // The version of react-native is set by the React Native Gradle Plugin
     implementation("com.facebook.react:react-android")
-    implementation("com.facebook.react:flipper-integration")
+    implementation("com.facebook.flipper:flipper-fresco-plugin:0.182.0")
 
     if (hermesEnabled.toBoolean()) {
         implementation("com.facebook.react:hermes-android")

Example/android/build.gradle

@@ -1,7 +1,7 @@
 buildscript {
     ext {
         buildToolsVersion = "34.0.0"
-        minSdkVersion = 21
+        minSdkVersion = 23
         compileSdkVersion = 34
         targetSdkVersion = 34
         ndkVersion = "25.1.8937393"

Example/package.json

@@ -18,7 +18,7 @@
     "@svgr/webpack": "^8.1.0",
     "file-loader": "^6.2.0",
     "react": "18.2.0",
-    "react-native": "^0.73.6",
+    "react-native": "^0.75.0",
     "react-native-macos": "^0.73.0-0",
     "react-native-qrcode-svg": "link:../",
     "react-native-svg": "^15.5.0",

README.md

@@ -22,10 +22,14 @@ Install dependency packages
 
 ```bash
 yarn add react-native-svg react-native-qrcode-svg
+# For React Native < 0.75 please install `text-encoding` package too!
+yarn add text-encoding
 ```
 Or
 ```bash
 npm i -S react-native-svg react-native-qrcode-svg
+# For React Native < 0.75 please install `text-encoding` package too!
+npm i -S text-encoding
 ```
 
 If you are using `React Native 0.60.+` go to the folder **your-project/ios** and run `pod install`, and you're done. 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-qrcode-svg",
-  "version": "6.3.12",
+  "version": "6.4.0",
   "description": "A QR Code generator for React Native based on react-native-svg and javascript-qrcode.",
   "main": "index.js",
   "types": "index.d.ts",
@@ -52,12 +52,17 @@
   "peerDependencies": {
     "react": "*",
     "react-native": ">=0.63.4",
-    "react-native-svg": ">=14.0.0"
+    "react-native-svg": ">=14.0.0",
+    "text-encoding": "^0.7.0"
+  },
+  "peerDependenciesMeta": {
+    "text-encoding": {
+      "optional": true
+    }
   },
   "dependencies": {
     "prop-types": "^15.8.0",
-    "qrcode": "^1.5.1",
-    "text-encoding": "^0.7.0"
+    "qrcode": "^1.5.1"
   },
   "devDependencies": {
     "@types/react": "^18.2.75",

src/index.js

@@ -1,6 +1,5 @@
-global.TextEncoder = require("text-encoding").TextEncoder;
-
-import React, { useMemo } from "react";
+import { Platform } from "react-native";
+import React, { useMemo, useEffect } from "react";
 import Svg, {
   Defs,
   G,
@@ -102,6 +101,8 @@ const QRCode = ({
   onError,
   testID,
 }) => {
+  useEffect(loadTextEncodingPolyfill, []);
+
   const result = useMemo(() => {
     try {
       return transformMatrixIntoPath(genMatrix(value, ecl), size);
@@ -180,4 +181,21 @@ const QRCode = ({
   );
 };
 
+function loadTextEncodingPolyfill() {
+  // Platform.constants isn't available on the web.
+  const version = Platform.constants?.reactNativeVersion;
+  if (!global.TextEncoder && version?.major === 0 && version?.minor < 75) {
+    try {
+      require.resolve("text-encoding");
+      import("text-encoding").then((m) => {
+        global.TextEncoder = m.TextEncoder;
+      });
+    } catch (error) {
+      console.error(
+        "If you are using RN < 0.75 please install the `text-encoding` library in your project"
+      );
+    }
+  }
+}
+
 export default QRCode;