@networkinternational/ni-card-management-sdk 1.0.8 → 2.0.0

package/README.md

@@ -11,27 +11,42 @@ The current supported features are:
 5. View PIN: Displays a component providing the ability to show PIN card. The PIN is end to end encrypted to securely transport this sensitive information
 
 ## Requirements
-The Network International React Native Card Management SDK requires minimum react native version 0.71.0 and later and works with iOS version 12 and above.
+The SDK supports React Native 0.86.0 and later and iOS 15.1 and later. The repository and example app pin React Native 0.86.2, which is the currently tested and recommended version. Newer stable React Native versions are allowed by the peer dependency and become officially tested when the repository's automated dependency update passes Android and iOS CI.
+
+Development requires the following toolchain:
+
+| Tool | Version |
+| --- | --- |
+| Node.js | 22.13.0 or newer in the Node 22 LTS line |
+| Yarn | 3.6.1, provided by the repository |
+| JDK | 17 |
+| Android SDK Platform | 36 |
+| Android Build Tools | 36.0.0 |
+| Android NDK | 28.2.13676358 (r28c) |
+| CMake | 3.22.1 |
+| Xcode | A version that supports the installed iOS SDK and iOS 15.1 deployment target |
+
+Gradle 9.3.1 is downloaded by the wrapper. React Native, the React Native CLI, the Android Gradle Plugin, and Kotlin are installed through Yarn and Gradle and do not need separate global installations.
 
 ## Installation
 The SDK can be added via [npm](https://docs.npmjs.com) or [yarn](https://classic.yarnpkg.com/). Refer to the CONTRIBUTING.md file for the example app installation steps. 
-The SDK requires the following dependencies: react-native-paper, @react-native-community/clipboard, react-native-linear-gradient. If you did not already, please install them before installing the SDK.
+The SDK requires the following dependencies: @react-native-clipboard/clipboard, react-native-linear-gradient. If you did not already, please install them before installing the SDK.
 
 ##### npm
 
-  - Please install the react-native-paper @react-native-community/clipboard react-native-linear-gradient packages only if you did not already.
+  - Please install the @react-native-clipboard/clipboard react-native-linear-gradient packages only if you did not already.
 
 ```node
-npm install react-native-paper @react-native-community/clipboard react-native-linear-gradient
+npm install @react-native-clipboard/clipboard react-native-linear-gradient
 npm install @networkinternational/ni-card-management-sdk
 ```
 
 #### yarn
 
-  - Please install the react-native-paper @react-native-community/clipboard react-native-linear-gradient packages only if you did not already.
+  - Please install the @react-native-clipboard/clipboard react-native-linear-gradient packages only if you did not already.
 
 ```node
-yarn add react-native-paper @react-native-community/clipboard react-native-linear-gradient
+yarn add @react-native-clipboard/clipboard react-native-linear-gradient
 yarn add @networkinternational/ni-card-management-sdk
 ```
 
@@ -67,7 +82,7 @@ In case of issues when running the iOS or the Android application after installi
 ## Integration
 
 #### Basics
-    After you have installed the SDK, by following one of the above set of steps, you can import the SDK into your react native app and used it.
+    After you have installed the SDK, by following one of the above set of steps, you can import the SDK into your react native app and use it.
 
 
 #### Usage
@@ -87,16 +102,42 @@ In case of issues when running the iOS or the Android application after installi
         bankCode: [yourBankCode],
         cardIdentifierId: [cardIdentifierId],
         cardIdentifierType: [cardIdentifierType],
-        connectionProperties: NIConnectionProperties = {
-            rootUrl: [rootUrl], token: [token],
+        connectionProperties: {
+            rootUrl: [rootUrl],
+            token: [token],
+            extraHeaders: JSON.stringify({
+              'custom-header': 'custom-value',
+            }),
         },
-        displayAttributes: NIDisplayAttributes = {
+        displayAttributes: {
             theme: NIThemeEnum.light as themeType,
             language: NILanguageEnum.english as languageType,
         },
     };
 ```
 
+`connectionProperties.extraHeaders` should be a JSON string representation of key/value headers.
+For backward compatibility, iOS also accepts `extraNetworkHeaders` as a dictionary when provided by older integrations.
+
+##### Native callback contract
+
+All SDK callbacks return `(error, result)`:
+
+- On success: `error` is `null` and `result` is populated.
+- On failure: `result` is `null` and `error` is normalized to:
+
+```typescript
+type NIErrorResponse = {
+  domain: string;
+  code: string | number;
+  message: string;
+};
+```
+
+On `CardDetailsComponent` success, the callback result message is
+`"Card details retrieved with success!"`; card details data is exposed through the
+component/hook state (`getCardDetailsResult`).
+
 ###### Display attributes  
 Display attributes parameter is optional. You can set one or more attributes, or even none of them.  
 
@@ -208,7 +249,7 @@ A PIN-pad will be displayed into a separate View on a separate screen.
         NIPinTypeEnum,
     } from '@networkinternational/ni-card-management-sdk';
 
-    import { input } from ['path/to/your/object/config'];
+    import { input } from 'path/to/your/object/config';
 ```
 
 by specifying the type (pin length)
@@ -261,7 +302,7 @@ A PIN-pad will be displayed in a VIEW into a separate screen.
         NIThemeEnum,
     } from '@networkinternational/ni-card-management-sdk';
 
-    import { input } from ['path/to/your/object/config'];
+    import { input } from 'path/to/your/object/config';
 ```
 
 by specifying the type (pin length)
@@ -303,7 +344,6 @@ or without specifying the type (pin length)
 ##### Verify PIN Form 
 A PIN-pad will be displayed in a View into a separate screen. 
 
-javascript:
 ```javascript
     import {
         VerifyPinView,
@@ -311,7 +351,7 @@ javascript:
         NIPinTypeEnum,
     } from '@networkinternational/ni-card-management-sdk';
 
-    import { input } from ['path/to/your/object/config'];
+    import { input } from 'path/to/your/object/config';
 ```
 
 by specifying the type (pin length)
@@ -359,7 +399,7 @@ A view of NICardView type can be added into a View, then set the input and start
         NIPinTypeEnum,
     } from '@networkinternational/ni-card-management-sdk';
 
-    import { input } from ['path/to/your/object/config'];
+    import { input } from 'path/to/your/object/config';
 ```
 
 by specifying the type (pin length)
@@ -407,10 +447,14 @@ This is a required parameter.
         bankCode: [yourBankCode],
         cardIdentifierId: [cardIdentifierId],
         cardIdentifierType: [cardIdentifierType],
-        connectionProperties: NIConnectionProperties = {
-            rootUrl: [rootUrl], token: [token],
+        connectionProperties: {
+            rootUrl: [rootUrl],
+            token: [token],
+            extraHeaders: JSON.stringify({
+              'custom-header': 'custom-value',
+            }),
         },
-        displayAttributes: NIDisplayAttributes = {
+        displayAttributes: {
             theme: NIThemeEnum.light as themeType,
             language: NILanguageEnum.english as languageType,
         },
@@ -419,17 +463,17 @@ This is a required parameter.
 ```
 
 
-##### Display View Pin View
+##### Display View Pin Component
 
-A view of NIViewPinView type can be added into storyboard, then set the input and start the flow as below:
+A ViewPinComponent can be added into your screen, then set the input and start the flow as below:
 ```javascript
     import {
-        ViewPinView,
+    ViewPinComponent,
         type NIErrorResponse,
         NIPinTypeEnum,
     } from '@networkinternational/ni-card-management-sdk';
 
-    import { input } from ['path/to/your/object/config'];
+  import { input } from 'path/to/your/object/config';
 ```
 
 by specifying the type (pin length)
@@ -439,7 +483,7 @@ by specifying the type (pin length)
 ```
 
 ```javascript
-      <ViewPinView
+      <ViewPinComponent
         input={TEST_INPUT_VIEW_PIN}
         type={type}
         callback={(
@@ -448,13 +492,13 @@ by specifying the type (pin length)
         ) => {
             callback(); // implement your callback
         }}
-      />}
+      />
 ```
 
 or without specifying the type (pin length)
 
 ```javascript
-      <ViewPinView
+      <ViewPinComponent
         input={TEST_INPUT_VIEW_PIN}
         callback={(
           error: NIErrorResponse | null,
@@ -462,25 +506,24 @@ or without specifying the type (pin length)
         ) => {
             callback(); // implement your callback
         }}
-      />}
+      />
 ```
 
 
-#### Programatic Interface
+#### Programmatic Interface
 The customer application will be responsible to handle the UI part.
 
 ##### Retrieve Card Details
 The programmatic interface of the card details will return the card details in the getCardDetailsResult: NIGetCardSuccessResponse object.
 The card info returned are: Card Number, Expiry Date, CVV and Cardholder Name.
 
-javascript:
 ```javascript
     import {
         useGetCardDetails,
         type NIErrorResponse,
     } from '@networkinternational/ni-card-management-sdk';
     
-    import { input } from ['path/to/your/object/config'];
+    import { input } from 'path/to/your/object/config';
 ```
 
 ```javascript
@@ -507,15 +550,13 @@ javascript:
 ##### Set PIN 
 The programmatic interface for the Set PIN functionality will return a success or failure response.
 
-javascript:
 ```javascript
     import {
         useSetPin,
         type NIErrorResponse,
-    NIThemeEnum,
     } from '@networkinternational/ni-card-management-sdk';
     
-    import { input } from ['path/to/your/object/config'];
+    import { input } from 'path/to/your/object/config';
 ```
 
 ```javascript
@@ -545,14 +586,13 @@ javascript:
 ##### Change PIN
 The programmatic interface for the Change PIN functionality will return a success or failure response.
 
-javascript:
 ```javascript
     import {
         useChangePin,
         type NIErrorResponse,
     } from '@networkinternational/ni-card-management-sdk';
     
-    import { input } from ['path/to/your/object/config'];
+    import { input } from 'path/to/your/object/config';
 ```
 
 ```javascript
@@ -584,14 +624,13 @@ javascript:
 ##### Verify PIN
 The programmatic interface for the Verify PIN functionality will return a success or failure response.
 
-javascript:
 ```javascript
     import {
         useVerifyPin,
         type NIErrorResponse,
     } from '@networkinternational/ni-card-management-sdk';
     
-    import { input } from ['path/to/your/object/config'];
+    import { input } from 'path/to/your/object/config';
 ```
 
 ```javascript
@@ -621,14 +660,13 @@ javascript:
 ##### View PIN
 The programmatic interface for the View PIN functionality will return in __viewPinResult__ as a String value representing the PIN or failure response.
 
-javascript:
 ```javascript
     import {
         useViewPin,
         type NIErrorResponse,
     } from '@networkinternational/ni-card-management-sdk';
     
-    import { input } from ['path/to/your/object/config'];
+  import { input } from 'path/to/your/object/config';
 ```
 
 ```javascript
@@ -659,3 +697,67 @@ A NICardManagement wrapper is used to integrate the Network International SDK in
   - the iOS NICardManagement wrapper can be find inside the __./ios__ folder.
 
   - the android NICardManagement wrapper can be find inside the __./android/src/main/java/com/nicardmanagement__ folder.
+
+### Inspecting network traffic
+
+Card-management operations cross the React Native bridge and execute inside the native `NICardManagementSDK`. They are not JavaScript `fetch` or `XMLHttpRequest` calls, so use the native platform inspector when investigating Card Details, Set PIN, Verify PIN, Change PIN, or View PIN traffic.
+
+#### Android native SDK traffic
+
+The Android SDK uses Retrofit and OkHttp, which are supported by Android Studio Network Inspector:
+
+1. Run a debug build of the example application on an emulator or connected device.
+2. Open `example/android` in Android Studio.
+3. Select **View > Tool Windows > App Inspection**.
+4. Select the device and the `com.nicardmanagementexample` process.
+5. Open the **Network Inspector** tab before triggering an SDK operation.
+6. Trigger the operation in the example app, select its request in **Connection View**, and inspect its URL, method, status, timings, headers, body, and call stack where available.
+
+If the process is not listed, launch the debug app from Android Studio or attach the debugger to `com.nicardmanagementexample`. If traffic is still absent, restart the debug app while App Inspection is open and confirm that input validation or authentication did not fail before the native SDK attempted the request.
+
+#### iOS native SDK traffic
+
+The iOS SDK uses `URLSession`, so inspect its requests with the HTTP Traffic instrument included with Xcode:
+
+1. Open `example/ios/NiCardManagementExample.xcworkspace` in Xcode.
+2. Select the `NiCardManagementExample` scheme and an iOS Simulator or connected device.
+3. Select **Product > Profile** to launch Instruments.
+4. Select the **Network** template and click **Choose**.
+5. Confirm that Instruments targets the `NiCardManagementExample` process, then click **Record**.
+6. Read the capture warning and select **Record Anyway** only when using test or UAT data.
+7. Trigger an SDK operation in the example app and stop the recording when the request completes.
+8. Expand **HTTP Traffic > NiCardManagementExample > URLSession > domain**, then select a task or transaction to inspect timing, request and response headers, bodies, and the initiating backtrace where available.
+
+The current native SDK uses both shared and ephemeral `URLSession` instances; both are visible to the HTTP Traffic instrument. If no transaction appears, begin recording before triggering the operation and confirm that the request was not rejected by local validation or authentication setup.
+
+Instruments records decrypted HTTP and HTTPS headers and bodies in the trace document and system logs without encryption. Treat `.trace` files as sensitive artifacts: do not commit them, attach them to public issues, or retain captures containing production credentials or cardholder data.
+
+#### React Native JavaScript traffic
+
+React Native 0.86 DevTools includes a Network panel for requests made through React Native networking. Press `j` in the Metro terminal, or choose **Open DevTools** from the application developer menu, then select **Network** and trigger the request. This panel is useful for JavaScript networking but may not display requests initiated by `NICardManagementSDK`; Android Studio or Xcode tooling is authoritative for native SDK traffic.
+
+#### Proxy tools and sensitive data
+
+Proxyman or Charles can be used as a fallback when a platform inspector cannot observe a request, but HTTPS certificate pinning may prevent proxy decryption. Do not disable transport security or certificate pinning in production code to support inspection.
+
+Inspect only test or UAT traffic. Requests can contain authentication tokens, card identifiers, PIN-related values, and card details. Do not enable BODY-level HTTP logging, commit captures, or share unredacted request headers and payloads.
+
+### Maintainer notes
+
+- CocoaPods source tags use `v{version}` format and are resolved from `repository` metadata (fallback to `homepage`).
+- Android native SDK version is centralized in `android/gradle.properties` via `NiCardManagement_nativeSdkVersion`.
+- iOS native SDK version is pinned in `react-native-ni-card-management.podspec` via `s.dependency "NICardManagementSDK", '...'`; keep this aligned with `NiCardManagement_nativeSdkVersion`.
+- Current validated native pins are Android `2.2.2` (`NiCardManagement_nativeSdkVersion`) and iOS `2.1.7` (`NICardManagementSDK` pod dependency).
+- Android library-side New Architecture is opt-in via `NiCardManagement_newArchEnabled`; keep it disabled by default so app-level `newArchEnabled=true` does not make the SDK module run React codegen for third-party dependency specs (which can cause duplicate generated classes such as `RNCSafeAreaProviderManagerDelegate`).
+- Flipper was a desktop debugging platform for inspecting network traffic, logs, React components, layouts, and databases. React Native no longer includes the generated Flipper integration in current templates, so the obsolete, release-only `ReactNativeFlipper.java` no-op scaffold was removed. It did not initialize Flipper or import Flipper libraries, and no Flipper dependency remains in the JavaScript, Android, or iOS dependency graphs. Use React Native DevTools for the supported debugging workflow; removing the scaffold does not affect application runtime behavior.
+- Jetifier rewrites dependencies from the legacy Android Support Library (`android.support.*`) to AndroidX (`androidx.*`). It is disabled because the current dependency graph is AndroidX-native, avoiding unnecessary transformation during builds. Restore `android.enableJetifier=true` only if a future dependency still contains legacy support-library references and fails to build without rewriting.
+- If Metro start fails with `EADDRINUSE` on `:8081`, either stop the existing process using that port or run the example app on an alternate port with `yarn workspace react-native-ni-card-management-example start:8082`.
+- Example app start scripts are guarded by `check:node` and require Node `>=22.13.0`; older runtimes can fail with Metro errors such as `configs.toReversed is not a function`.
+- iOS bridge now accepts `connectionProperties.extraHeaders` as a JSON string (same contract as Android). `connectionProperties.extraNetworkHeaders` dictionary remains supported as a backward-compatible fallback.
+- Android 2.2.2 integration may require manifest merge override for `android:allowBackup`; the example app resolves this in `example/android/app/src/main/AndroidManifest.xml` using `tools:replace="android:allowBackup"`.
+- JitPack timeouts/resolution flakiness for Android metadata were mitigated in `android/build.gradle` by setting repository metadata sources to `mavenPom()` and `artifact()` for `https://jitpack.io`.
+- RN and Flutter integration models differ by design:
+  - Flutter initializes once with `initialize(...)` and passes `extraNetworkHeaders` as a map.
+  - RN passes `NiInputInterface` per call/component and uses `connectionProperties.extraHeaders` JSON string as the cross-platform transport shape.
+- iOS RN 0.86.x + RCT-Folly may fail with `folly/coro/Coroutine.h file not found` in some pod resolutions. The example app Podfile includes a temporary post-install workaround in `example/ios/Podfile` that disables coroutine-only include blocks in `RCT-Folly/folly/Expected.h` and `RCT-Folly/folly/Optional.h` only when `folly/coro/Coroutine.h` is absent.
+- Remove that workaround once the installed `RCT-Folly` package consistently includes `folly/coro/Coroutine.h` (or when upgrading RN/Folly versions where this mismatch is fixed).

package/android/build.gradle

@@ -15,7 +15,11 @@ buildscript {
 }
 
 def isNewArchitectureEnabled() {
-  return rootProject.hasProperty("newArchEnabled") && rootProject.getProperty("newArchEnabled") == "true"
+  if (project.hasProperty("NiCardManagement_newArchEnabled")) {
+    return project.getProperty("NiCardManagement_newArchEnabled") == "true"
+  }
+
+  return false
 }
 
 apply plugin: "com.android.library"
@@ -80,10 +84,17 @@ android {
 repositories {
   mavenCentral()
   google()
-  maven { url "https://jitpack.io" }
+  maven {
+    url "https://jitpack.io"
+    metadataSources {
+      mavenPom()
+      artifact()
+    }
+  }
 }
 
 def kotlin_version = getExtOrDefault("kotlinVersion")
+def native_sdk_version = getExtOrDefault("nativeSdkVersion")
 
 dependencies {
   // For < 0.71, this will be from the local maven repo
@@ -91,6 +102,6 @@ dependencies {
   //noinspection GradleDynamicVersion
   implementation "com.facebook.react:react-native:+"
   implementation "org.jetbrains.kotlin:kotlin-stdlib:$kotlin_version"
-  implementation 'com.github.network-international:card-management-sdk-android:1.0.49-alpha.4'
+  implementation "com.github.network-international:card-management-sdk-android:$native_sdk_version"
 }
 

package/android/gradle.properties

@@ -2,4 +2,5 @@ NiCardManagement_kotlinVersion=1.7.0
 NiCardManagement_minSdkVersion=21
 NiCardManagement_targetSdkVersion=31
 NiCardManagement_compileSdkVersion=31
+NiCardManagement_nativeSdkVersion=2.2.2
 NiCardManagement_ndkversion=21.4.7075529

package/ios/NiCardManagement.swift

@@ -2,6 +2,57 @@ import Foundation
 import NICardManagementSDK
 import React
 
+private final class ExtraHeadersProvider: NICardManagementExtraHeaders {
+  private let headers: [String: String]
+
+  init(headers: [String: String]) {
+    self.headers = headers
+  }
+
+  func additionalNetworkHeaders() -> [String: String] {
+    return headers
+  }
+}
+
+private func parseExtraHeaders(from connectionProperties: NSDictionary?) -> [String: String] {
+  var extraHeaders = [String: String]()
+
+  // Preferred contract: JSON string in connectionProperties.extraHeaders.
+  if let extraHeadersJSON = connectionProperties?["extraHeaders"] as? String,
+     !extraHeadersJSON.trimmingCharacters(in: .whitespacesAndNewlines).isEmpty,
+     let data = extraHeadersJSON.data(using: .utf8),
+     let parsed = try? JSONSerialization.jsonObject(with: data) as? [String: Any] {
+    for (key, value) in parsed {
+      if let stringValue = value as? String {
+        extraHeaders[key] = stringValue
+      }
+    }
+  }
+
+  // Backward compatibility: dictionary in connectionProperties.extraNetworkHeaders.
+  if extraHeaders.isEmpty,
+     let extraHeadersDict = connectionProperties?["extraNetworkHeaders"] as? NSDictionary {
+    for item in extraHeadersDict {
+      guard let key = item.key as? String else { continue }
+      if let value = item.value as? String {
+        extraHeaders[key] = value
+      }
+    }
+  }
+
+  return extraHeaders
+}
+
+private func makeBridgeError(errorCode: String?, errorMessage: String?) -> [String: Any] {
+  let parsedErrorCode = Int(errorCode ?? "") ?? 500
+
+  return [
+    "domain": "com.NICardManagementSDK",
+    "code": parsedErrorCode,
+    "message": errorMessage ?? "Unknown error",
+  ]
+}
+
 func createNICardManagementAPIInstance(from input: NSDictionary) -> NICardManagementAPI {
   let bankCode = input["bankCode"] as? String ?? ""
   let cardIdentifierId = input["cardIdentifierId"] as? String ?? ""
@@ -10,26 +61,18 @@ func createNICardManagementAPIInstance(from input: NSDictionary) -> NICardManage
 
   let rootUrl = connectionProperties?["rootUrl"] as? String ?? ""
   let token = connectionProperties?["token"] as? String ?? ""
-
-  let extraHeadersDict = connectionProperties?["extraNetworkHeaders"] as? NSDictionary
-  var extraHeaders = [String: String]()
-  if let extraHeadersDict = extraHeadersDict {
-        for item in extraHeadersDict {
-            guard let key = item.key as? String, let val = item.value as? String else { continue }
-            extraHeaders[key] = val
-        }
-  }
-        
+  let extraHeaders = parseExtraHeaders(from: connectionProperties)
+    let extraHeadersProvider = extraHeaders.isEmpty ? nil : ExtraHeadersProvider(headers: extraHeaders)
 
   let tokenFetchable = TokenFetcherFactory.makeSimpleWrapper(tokenValue: token)
-    
+
   let sdk = NICardManagementAPI(
       rootUrl: rootUrl,
       cardIdentifierId: cardIdentifierId,
       cardIdentifierType: cardIdentifierType,
       bankCode: bankCode,
       tokenFetchable: tokenFetchable,
-      extraHeaders: extraHeaders
+      extraHeadersProvider: extraHeadersProvider
   )
   return sdk
 }
@@ -50,13 +93,7 @@ class NiCardManagement: NSObject {
 
       sdk.getCardDetails() { successResponse, errorResponse, completion in
           if let error = errorResponse {
-            let errorCode = Int(error.errorCode) ?? 500
-            let customeError: [String: Any?] = [
-                            "domain": "com.NICardManagementSDK",
-                            "code": errorCode,
-                            "message": error.errorMessage
-                        ]
-            callback([customeError, NSNull()])
+            callback([makeBridgeError(errorCode: error.errorCode, errorMessage: error.errorMessage), NSNull()])
           } else if let success = successResponse {
            let cardDetailsObject: [String: Any?] = [
                            "clearPan": success.clearPan,
@@ -75,15 +112,8 @@ class NiCardManagement: NSObject {
       let sdk = createNICardManagementAPIInstance(from: input)
       
       sdk.setPin(pin: pin) { successResponse, errorResponse, completion in
-        print("I am in setPin")
           if let error = errorResponse {
-            let errorCode = Int(error.errorCode) ?? 500
-            let customeError: [String: Any?] = [
-                            "domain": "com.NICardManagementSDK",
-                            "code": errorCode,
-                            "message": error.errorMessage
-                        ]
-            callback([customeError, NSNull()])
+            callback([makeBridgeError(errorCode: error.errorCode, errorMessage: error.errorMessage), NSNull()])
           } else if let success = successResponse {
             callback([NSNull(), success.message])
           }
@@ -96,15 +126,8 @@ class NiCardManagement: NSObject {
       let sdk = createNICardManagementAPIInstance(from: input)
 
       sdk.changePin(oldPin: oldPin, newPin: newPin) { successResponse, errorResponse, completion in
-        print("I am in changePin")
         if let error = errorResponse {
-          let errorCode = Int(error.errorCode) ?? 500
-          let customeError: [String: Any?] = [
-                          "domain": "com.NICardManagementSDK",
-                          "code": errorCode,
-                          "message": error.errorMessage
-                      ]
-          callback([customeError, NSNull()])
+          callback([makeBridgeError(errorCode: error.errorCode, errorMessage: error.errorMessage), NSNull()])
         } else if let success = successResponse {
           callback([NSNull(), success.message])
         }
@@ -116,15 +139,8 @@ class NiCardManagement: NSObject {
       let sdk = createNICardManagementAPIInstance(from: input)
       
       sdk.verifyPin(pin: pin) { successResponse, errorResponse, completion in
-        print("I am in verifyPin")
         if let error = errorResponse {
-          let errorCode = Int(error.errorCode) ?? 500
-          let customeError: [String: Any?] = [
-                          "domain": "com.NICardManagementSDK",
-                          "code": errorCode,
-                          "message": error.errorMessage
-                      ]
-          callback([customeError, NSNull()])
+          callback([makeBridgeError(errorCode: error.errorCode, errorMessage: error.errorMessage), NSNull()])
         } else if let success = successResponse {
           callback([NSNull(), success.message])
         }
@@ -136,15 +152,8 @@ class NiCardManagement: NSObject {
       let sdk = createNICardManagementAPIInstance(from: input)
 
       sdk.getPin() { successResponse, errorResponse, completion in
-        print("I am in getPin")
         if let error = errorResponse {
-          let errorCode = Int(error.errorCode) ?? 500
-          let customError: [String: Any?] = [
-                          "domain": "com.NICardManagementSDK",
-                          "code": errorCode,
-                          "message": error.errorMessage
-                      ]
-          callback([customError, NSNull()])
+          callback([makeBridgeError(errorCode: error.errorCode, errorMessage: error.errorMessage), NSNull()])
         } else if let success = successResponse {
           callback([NSNull(), success])
         }

package/lib/commonjs/NICardManagementComponents/CardDetailsComponent.js

@@ -40,8 +40,10 @@ function CardDetailsComponent({
     onGetCardDetails
   } = (0, _useGetCardDetails.useGetCardDetails)();
   (0, _react.useEffect)(() => {
-    input && onGetCardDetails(input, callback);
-  }, []);
+    if (input) {
+      onGetCardDetails(input, callback);
+    }
+  }, [input, callback, onGetCardDetails]);
   const error_getCardDetailsResult = {
     clearPan: '-',
     maskedPan: '-',

package/lib/commonjs/NICardManagementComponents/CardDetailsComponent.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_CardDetails","_PinState","_interopRequireDefault","_useGetCardDetails","_NiInputInterfaces","_themeColors","obj","__esModule","default","_getRequireWildcardCache","e","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","CardDetailsComponent","input","callback","displayAttributes","theme","NIThemeEnum","light","cardDetailsStyle","height","width","backgroundColor","themeColors","background","dark","result","getCardDetailsResult","error","getCardDetailsError","isLoading","getCardDetailsIsLoading","onGetCardDetails","useGetCardDetails","useEffect","error_getCardDetailsResult","clearPan","maskedPan","expiry","clearCVV2","cardholderName","createElement","View","style","styles","CardDetails","isError","isCardDetails","StyleSheet","create","marginTop"],"sourceRoot":"../../../src","sources":["NICardManagementComponents/CardDetailsComponent.tsx"],"mappings":"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"}
+{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_CardDetails","_PinState","_interopRequireDefault","_useGetCardDetails","_NiInputInterfaces","_themeColors","obj","__esModule","default","_getRequireWildcardCache","e","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","CardDetailsComponent","input","callback","displayAttributes","theme","NIThemeEnum","light","cardDetailsStyle","height","width","backgroundColor","themeColors","background","dark","result","getCardDetailsResult","error","getCardDetailsError","isLoading","getCardDetailsIsLoading","onGetCardDetails","useGetCardDetails","useEffect","error_getCardDetailsResult","clearPan","maskedPan","expiry","clearCVV2","cardholderName","createElement","View","style","styles","CardDetails","isError","isCardDetails","StyleSheet","create","marginTop"],"sourceRoot":"../../../src","sources":["NICardManagementComponents/CardDetailsComponent.tsx"],"mappings":"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"}

package/lib/commonjs/NICardManagementComponents/NiInputInterfaces.js.map

@@ -1 +1 @@
-{"version":3,"names":["_NiInputInterfaces","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get"],"sourceRoot":"../../../src","sources":["NICardManagementComponents/NiInputInterfaces.ts"],"mappings":";;;;;AAaA,IAAAA,kBAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,kBAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,kBAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAT,kBAAA,CAAAK,GAAA;IAAA;EAAA;AAAA"}
+{"version":3,"names":["_NiInputInterfaces","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get"],"sourceRoot":"../../../src","sources":["NICardManagementComponents/NiInputInterfaces.ts"],"mappings":";;;;;AAeA,IAAAA,kBAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,kBAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,kBAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAT,kBAAA,CAAAK,GAAA;IAAA;EAAA;AAAA"}

package/lib/commonjs/NICardManagementComponents/ViewPinComponent.js

@@ -37,8 +37,10 @@ function ViewPinComponent({
     isViewPinLoading
   });
   (0, _react.useEffect)(() => {
-    input && onViewPin(input, callback);
-  }, []);
+    if (input) {
+      onViewPin(input, callback);
+    }
+  }, [input, callback, onViewPin]);
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_ViewPin.default, {
     input: input,
     pinType: pinType || _NiInputInterfaces.NIPinTypeEnum.dynamicFourToSix,