@test-web/react-native-sdk 1.0.1 → 2.0.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/README.md +824 -26
- package/assets/images/Chrome-logo.svg +1 -0
- package/assets/images/Firefox-logo.png +0 -0
- package/assets/images/IDM-logo.jpg +0 -0
- package/assets/images/MRZOverlay.png +0 -0
- package/assets/images/Safari-logo.png +0 -0
- package/assets/images/aadhar.png +0 -0
- package/assets/images/camera-bg.png +0 -0
- package/assets/images/card-overlay-back.png +0 -0
- package/assets/images/card-overlay.png +0 -0
- package/assets/images/card-scan-back-icon.jpg +0 -0
- package/assets/images/card-scan-front-icon.png +0 -0
- package/assets/images/card-scan-icon-aadhaar-1.png +0 -0
- package/assets/images/card-scan-icon-aadhaar-back.png +0 -0
- package/assets/images/card-scan-icon-aadhaar-scan-qr.png +0 -0
- package/assets/images/card-scan-icon-aadhaar.png +0 -0
- package/assets/images/card-scan-icon-can-pr.png +0 -0
- package/assets/images/card-scan-icon-default-back.png +0 -0
- package/assets/images/card-scan-icon-dl.png +0 -0
- package/assets/images/card-scan-icon-greencard-back.jpg +0 -0
- package/assets/images/card-scan-icon-greencard.jpg +0 -0
- package/assets/images/card-scan-icon-hc.png +0 -0
- package/assets/images/card-scan-icon-ni-argentina-back.jpg +0 -0
- package/assets/images/card-scan-icon-ni-argentina-old.png +0 -0
- package/assets/images/card-scan-icon-ni-argentina.jpg +0 -0
- package/assets/images/card-scan-icon-ni-barcode.jpg +0 -0
- package/assets/images/card-scan-icon-ni-brazil-back.jpg +0 -0
- package/assets/images/card-scan-icon-ni-brazil.jpg +0 -0
- package/assets/images/card-scan-icon-ni-dominican-republic-back.png +0 -0
- package/assets/images/card-scan-icon-ni-dominican-republic-front.png +0 -0
- package/assets/images/card-scan-icon-ni-dominican-republic-mrz.png +0 -0
- package/assets/images/card-scan-icon-ni-dominicanaRepublic-back.jpg +0 -0
- package/assets/images/card-scan-icon-ni-france-back.png +0 -0
- package/assets/images/card-scan-icon-ni-france-front.png +0 -0
- package/assets/images/card-scan-icon-ni-france-scan-mrz.png +0 -0
- package/assets/images/card-scan-icon-ni-germany-back.jpg +0 -0
- package/assets/images/card-scan-icon-ni-germany.jpg +0 -0
- package/assets/images/card-scan-icon-ni-paraguay-back.png +0 -0
- package/assets/images/card-scan-icon-ni-paraguay-front.png +0 -0
- package/assets/images/card-scan-icon-ni-paraguay-scan-mrz.png +0 -0
- package/assets/images/card-scan-icon-ni-uae-back.png +0 -0
- package/assets/images/card-scan-icon-ni-uae-front.png +0 -0
- package/assets/images/card-scan-icon-ni-uae-scan-mrz.png +0 -0
- package/assets/images/card-scan-icon-ni-uganda-front.png +0 -0
- package/assets/images/card-scan-icon-ni-uganda-scan-mrz.png +0 -0
- package/assets/images/card-scan-icon-ni-ukrain-back.png +0 -0
- package/assets/images/card-scan-icon-ni-ukrain-front.png +0 -0
- package/assets/images/card-scan-icon-ni-ukrain-scan-mrz.png +0 -0
- package/assets/images/card-scan-icon-ni.png +0 -0
- package/assets/images/card-scan-icon-old.jpg +0 -0
- package/assets/images/card-scan-icon-pan.png +0 -0
- package/assets/images/card-scan-icon-passport-card-back.jpg +0 -0
- package/assets/images/card-scan-icon-passport-card.jpg +0 -0
- package/assets/images/card-scan-icon-passport-old.png +0 -0
- package/assets/images/card-scan-icon-passport.png +0 -0
- package/assets/images/card-scan-icon-pr.png +0 -0
- package/assets/images/card-scan-icon.jpg +0 -0
- package/assets/images/check.png +0 -0
- package/assets/images/chrome-animation-GPS-permissions-setting.gif +0 -0
- package/assets/images/chrome-animation-camera-permissions-setting.gif +0 -0
- package/assets/images/denied.png +0 -0
- package/assets/images/dl.png +0 -0
- package/assets/images/driver-license.png +0 -0
- package/assets/images/firefox-animation-permissions-setting.gif +0 -0
- package/assets/images/flashlight_on.png +0 -0
- package/assets/images/gallery.png +0 -0
- package/assets/images/greencard.png +0 -0
- package/assets/images/header.jpg +0 -0
- package/assets/images/health-card.png +0 -0
- package/assets/images/ic_camera_front_white_36px.svg +4 -0
- package/assets/images/ic_camera_rear_white_36px.svg +4 -0
- package/assets/images/ic_fullscreen_exit_white_48px.svg +4 -0
- package/assets/images/ic_fullscreen_white_48px.svg +4 -0
- package/assets/images/ic_photo_camera_white_48px.svg +5 -0
- package/assets/images/id-card.png +0 -0
- package/assets/images/idcardimg.png +0 -0
- package/assets/images/idmval-barcode.png +0 -0
- package/assets/images/information.png +0 -0
- package/assets/images/loader.gif +0 -0
- package/assets/images/loading.svg +1 -0
- package/assets/images/logo.jpg +0 -0
- package/assets/images/logo.png +0 -0
- package/assets/images/mrz-back.png +0 -0
- package/assets/images/mrz-ni.png +0 -0
- package/assets/images/mrz.png +0 -0
- package/assets/images/mrz1.png +0 -0
- package/assets/images/mrz_old.png +0 -0
- package/assets/images/mrz_small.png +0 -0
- package/assets/images/national-id.png +0 -0
- package/assets/images/nationalID.png +0 -0
- package/assets/images/no-wifi.png +0 -0
- package/assets/images/passport-card.png +0 -0
- package/assets/images/passport.png +0 -0
- package/assets/images/permit-card.png +0 -0
- package/assets/images/photo-overlay.png +0 -0
- package/assets/images/placeholder.jpg +0 -0
- package/assets/images/qr-code.png +0 -0
- package/assets/images/right-checkmark.jpg +0 -0
- package/assets/images/selfie.jpg +0 -0
- package/assets/images/showing-sec.png +0 -0
- package/assets/images/spinner.gif +0 -0
- package/assets/images/splash-icon.png +0 -0
- package/assets/images/take-selfie.jpg +0 -0
- package/assets/images/torch_off.png +0 -0
- package/assets/images/warning-icon.jpg +0 -0
- package/assets/images/warning-stick.jpg +0 -0
- package/assets/images/wrong-checkmark.jpg +0 -0
- package/package.json +40 -4
- package/src/apis/index.ts +338 -17
- package/src/components/common/Loader.tsx +16 -2
- package/src/config/apiConfig.ts +6 -0
- package/src/index.tsx +123 -7
- package/src/screens/BarcodeCapture.tsx +154 -24
- package/src/screens/DocumentCaptureBack.tsx +133 -24
- package/src/screens/DocumentCaptureFront.tsx +146 -24
- package/src/screens/MrzCapture.tsx +205 -16
- package/src/screens/SelectDocuments.tsx +37 -56
- package/src/screens/SelfieCapture.tsx +114 -18
- package/src/screens/ThankYou.tsx +34 -1
- package/src/services/getUserData.ts +111 -0
- package/src/types/IDMConf.ts +81 -7
- package/src/utils/base64.ts +25 -0
- package/src/utils/flowManager.ts +138 -0
- package/src/utils/imageProcessor.ts +96 -0
- package/src/utils/index.ts +18 -0
package/README.md
CHANGED
|
@@ -1,58 +1,856 @@
|
|
|
1
1
|
# React Native IDM Scan SDK
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
A fully dynamic, production-ready React Native SDK for identity verification with document scanning, selfie capture, and API-driven configuration.
|
|
4
4
|
|
|
5
|
-
## Features
|
|
5
|
+
## 🌟 Features
|
|
6
6
|
|
|
7
|
-
✅
|
|
8
|
-
✅
|
|
9
|
-
✅
|
|
10
|
-
✅ Document
|
|
11
|
-
✅ Selfie
|
|
12
|
-
✅
|
|
13
|
-
✅
|
|
14
|
-
✅
|
|
7
|
+
- ✅ **Fully Dynamic** - All configuration driven by API and metadata
|
|
8
|
+
- ✅ **Smart Document Flow** - Automatically determines required capture steps
|
|
9
|
+
- ✅ **18 Verification Screens** - Complete identity verification flow
|
|
10
|
+
- ✅ **Document Scanning** - Support for ID cards, passports, driver licenses
|
|
11
|
+
- ✅ **Selfie Capture** - Live selfie verification with camera integration
|
|
12
|
+
- ✅ **MRZ & Barcode Scanning** - Machine-readable zone and barcode support with Dynamsoft & ML Kit
|
|
13
|
+
- ✅ **Advanced Scanning** - Optional Dynamsoft barcode scanner and ML Kit text recognition
|
|
14
|
+
- ✅ **10 Pre-built Themes** - Customizable UI themes
|
|
15
|
+
- ✅ **Camera & Location Permissions** - Built-in permission handling
|
|
16
|
+
- ✅ **TypeScript Support** - Full type definitions included
|
|
17
|
+
- ✅ **Responsive Design** - Works on all screen sizes
|
|
18
|
+
- ✅ **Optimized Performance** - Memoization and efficient state management
|
|
15
19
|
|
|
16
|
-
|
|
20
|
+
---
|
|
21
|
+
|
|
22
|
+
## 📱 Requirements
|
|
23
|
+
|
|
24
|
+
- React Native >= 0.64.0
|
|
25
|
+
- iOS >= 11.0
|
|
26
|
+
- Android >= API 21 (Android 5.0)
|
|
27
|
+
- Node.js >= 14.x
|
|
28
|
+
|
|
29
|
+
---
|
|
30
|
+
|
|
31
|
+
## 📦 Installation
|
|
32
|
+
|
|
33
|
+
### Step 1: Install the SDK
|
|
34
|
+
|
|
35
|
+
```bash
|
|
36
|
+
npm install @test-web/react-native-sdk
|
|
37
|
+
```
|
|
38
|
+
|
|
39
|
+
or with Yarn:
|
|
40
|
+
|
|
41
|
+
```bash
|
|
42
|
+
yarn add @test-web/react-native-sdk
|
|
43
|
+
```
|
|
44
|
+
|
|
45
|
+
### Step 2: Install Required Dependencies
|
|
17
46
|
|
|
18
47
|
```bash
|
|
19
|
-
npm install test-react-native-sdk
|
|
20
48
|
npm install @react-navigation/native @react-navigation/native-stack
|
|
21
49
|
npm install react-native-screens react-native-safe-area-context
|
|
50
|
+
npm install react-native-vision-camera react-native-image-resizer react-native-fs
|
|
51
|
+
```
|
|
52
|
+
|
|
53
|
+
### Step 3: Install Optional Dependencies (Recommended)
|
|
54
|
+
|
|
55
|
+
```bash
|
|
56
|
+
npm install react-native-device-info react-native-geolocation-service
|
|
57
|
+
```
|
|
58
|
+
|
|
59
|
+
### Step 4: Install Scanning Libraries (Optional but Recommended)
|
|
60
|
+
|
|
61
|
+
For enhanced barcode and MRZ scanning capabilities:
|
|
62
|
+
|
|
63
|
+
```bash
|
|
64
|
+
# Dynamsoft Capture Vision for barcode scanning
|
|
65
|
+
npm install dynamsoft-capture-vision-react-native
|
|
66
|
+
|
|
67
|
+
# ML Kit for MRZ text recognition
|
|
68
|
+
npm install @react-native-ml-kit/text-recognition
|
|
22
69
|
```
|
|
23
70
|
|
|
24
|
-
**
|
|
71
|
+
**Note:** Without these libraries, the SDK will use fallback simulation for barcode and MRZ scanning. For production use, we strongly recommend installing these libraries for accurate scanning.
|
|
72
|
+
|
|
73
|
+
### Step 5: Install iOS Pods (iOS only)
|
|
74
|
+
|
|
25
75
|
```bash
|
|
26
76
|
cd ios && pod install && cd ..
|
|
27
77
|
```
|
|
28
78
|
|
|
29
|
-
|
|
79
|
+
### Step 6: Rebuild Your App
|
|
80
|
+
|
|
81
|
+
```bash
|
|
82
|
+
# For Android
|
|
83
|
+
npx react-native run-android
|
|
84
|
+
|
|
85
|
+
# For iOS
|
|
86
|
+
npx react-native run-ios
|
|
87
|
+
```
|
|
88
|
+
|
|
89
|
+
---
|
|
90
|
+
|
|
91
|
+
## ⚙️ Configuration
|
|
92
|
+
|
|
93
|
+
### Android Setup
|
|
94
|
+
|
|
95
|
+
#### 1. Add Permissions to AndroidManifest.xml
|
|
96
|
+
|
|
97
|
+
Open `android/app/src/main/AndroidManifest.xml` and add:
|
|
98
|
+
|
|
99
|
+
```xml
|
|
100
|
+
<manifest xmlns:android="http://schemas.android.com/apk/res/android">
|
|
101
|
+
|
|
102
|
+
<!-- Camera Permission (Required) -->
|
|
103
|
+
<uses-permission android:name="android.permission.CAMERA" />
|
|
104
|
+
|
|
105
|
+
<!-- Location Permissions (Required) -->
|
|
106
|
+
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
|
|
107
|
+
<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />
|
|
108
|
+
|
|
109
|
+
<!-- Storage Permissions (Required for saving images) -->
|
|
110
|
+
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
|
|
111
|
+
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"
|
|
112
|
+
android:maxSdkVersion="28" />
|
|
113
|
+
|
|
114
|
+
<!-- Internet Permission (Required for API calls) -->
|
|
115
|
+
<uses-permission android:name="android.permission.INTERNET" />
|
|
116
|
+
|
|
117
|
+
<!-- Camera Features (Optional but recommended) -->
|
|
118
|
+
<uses-feature android:name="android.hardware.camera" android:required="false" />
|
|
119
|
+
<uses-feature android:name="android.hardware.camera.autofocus" android:required="false" />
|
|
120
|
+
|
|
121
|
+
<application>
|
|
122
|
+
<!-- Your app configuration -->
|
|
123
|
+
</application>
|
|
124
|
+
|
|
125
|
+
</manifest>
|
|
126
|
+
```
|
|
127
|
+
|
|
128
|
+
#### 2. Update build.gradle
|
|
129
|
+
|
|
130
|
+
Ensure your `android/app/build.gradle` has minimum SDK version 21:
|
|
131
|
+
|
|
132
|
+
```gradle
|
|
133
|
+
android {
|
|
134
|
+
defaultConfig {
|
|
135
|
+
minSdkVersion 21
|
|
136
|
+
targetSdkVersion 33
|
|
137
|
+
}
|
|
138
|
+
}
|
|
139
|
+
```
|
|
140
|
+
|
|
141
|
+
---
|
|
142
|
+
|
|
143
|
+
### iOS Setup
|
|
144
|
+
|
|
145
|
+
#### 1. Add Privacy Permissions to Info.plist
|
|
146
|
+
|
|
147
|
+
Open `ios/YourAppName/Info.plist` and add:
|
|
148
|
+
|
|
149
|
+
```xml
|
|
150
|
+
<key>NSCameraUsageDescription</key>
|
|
151
|
+
<string>We need camera access to scan your documents and capture selfie for identity verification</string>
|
|
152
|
+
|
|
153
|
+
<key>NSLocationWhenInUseUsageDescription</key>
|
|
154
|
+
<string>We need your location for identity verification purposes</string>
|
|
155
|
+
|
|
156
|
+
<key>NSPhotoLibraryUsageDescription</key>
|
|
157
|
+
<string>We need access to your photo library to save captured images</string>
|
|
158
|
+
|
|
159
|
+
<key>NSPhotoLibraryAddUsageDescription</key>
|
|
160
|
+
<string>We need permission to save captured images to your photo library</string>
|
|
161
|
+
```
|
|
162
|
+
|
|
163
|
+
#### 2. Update Podfile
|
|
164
|
+
|
|
165
|
+
Ensure your `ios/Podfile` has minimum iOS version 11.0:
|
|
166
|
+
|
|
167
|
+
```ruby
|
|
168
|
+
platform :ios, '11.0'
|
|
169
|
+
```
|
|
170
|
+
|
|
171
|
+
---
|
|
172
|
+
|
|
173
|
+
### Dynamsoft Barcode Scanner Setup (Optional)
|
|
174
|
+
|
|
175
|
+
If you installed `dynamsoft-capture-vision-react-native`, follow these additional steps:
|
|
176
|
+
|
|
177
|
+
#### Android Configuration
|
|
178
|
+
|
|
179
|
+
1. Add to `android/app/build.gradle`:
|
|
180
|
+
|
|
181
|
+
```gradle
|
|
182
|
+
android {
|
|
183
|
+
defaultConfig {
|
|
184
|
+
minSdkVersion 21
|
|
185
|
+
// Add this for Dynamsoft
|
|
186
|
+
ndk {
|
|
187
|
+
abiFilters 'armeabi-v7a', 'arm64-v8a', 'x86', 'x86_64'
|
|
188
|
+
}
|
|
189
|
+
}
|
|
190
|
+
}
|
|
191
|
+
```
|
|
192
|
+
|
|
193
|
+
2. Get your Dynamsoft license key from [Dynamsoft Customer Portal](https://www.dynamsoft.com/customer/license/trialLicense)
|
|
194
|
+
|
|
195
|
+
3. Initialize the license in your app (before using the SDK):
|
|
196
|
+
|
|
197
|
+
```typescript
|
|
198
|
+
import { DCVBarcodeReader } from 'dynamsoft-capture-vision-react-native';
|
|
199
|
+
|
|
200
|
+
// Initialize Dynamsoft license (do this once at app startup)
|
|
201
|
+
await DCVBarcodeReader.initLicense('YOUR_DYNAMSOFT_LICENSE_KEY');
|
|
202
|
+
```
|
|
203
|
+
|
|
204
|
+
#### iOS Configuration
|
|
205
|
+
|
|
206
|
+
1. Add to `ios/Podfile`:
|
|
207
|
+
|
|
208
|
+
```ruby
|
|
209
|
+
platform :ios, '11.0'
|
|
210
|
+
|
|
211
|
+
target 'YourApp' do
|
|
212
|
+
# ... other pods
|
|
213
|
+
|
|
214
|
+
# Add this for Dynamsoft
|
|
215
|
+
pod 'DynamsoftCaptureVisionRouter', '~> 2.0'
|
|
216
|
+
pod 'DynamsoftBarcodeReader', '~> 10.0'
|
|
217
|
+
end
|
|
218
|
+
```
|
|
219
|
+
|
|
220
|
+
2. Run `pod install`:
|
|
221
|
+
|
|
222
|
+
```bash
|
|
223
|
+
cd ios && pod install && cd ..
|
|
224
|
+
```
|
|
225
|
+
|
|
226
|
+
**Note:** The SDK will automatically detect if Dynamsoft is available and use it for barcode scanning. If not installed, it will fall back to simulation mode.
|
|
227
|
+
|
|
228
|
+
---
|
|
229
|
+
|
|
230
|
+
### ML Kit Text Recognition Setup (Optional)
|
|
231
|
+
|
|
232
|
+
If you installed `@react-native-ml-kit/text-recognition`, follow these additional steps:
|
|
233
|
+
|
|
234
|
+
#### Android Configuration
|
|
235
|
+
|
|
236
|
+
ML Kit will be automatically configured on Android. No additional setup required.
|
|
237
|
+
|
|
238
|
+
#### iOS Configuration
|
|
239
|
+
|
|
240
|
+
1. Add to `ios/Podfile`:
|
|
241
|
+
|
|
242
|
+
```ruby
|
|
243
|
+
platform :ios, '11.0'
|
|
244
|
+
|
|
245
|
+
target 'YourApp' do
|
|
246
|
+
# ... other pods
|
|
247
|
+
|
|
248
|
+
# ML Kit is automatically linked
|
|
249
|
+
end
|
|
250
|
+
```
|
|
251
|
+
|
|
252
|
+
2. Run `pod install`:
|
|
253
|
+
|
|
254
|
+
```bash
|
|
255
|
+
cd ios && pod install && cd ..
|
|
256
|
+
```
|
|
257
|
+
|
|
258
|
+
**Note:** The SDK will automatically detect if ML Kit is available and use it for MRZ text recognition. If not installed, it will fall back to simulation mode.
|
|
259
|
+
|
|
260
|
+
---
|
|
261
|
+
|
|
262
|
+
## 🚀 Usage
|
|
263
|
+
|
|
264
|
+
### Basic Implementation
|
|
30
265
|
|
|
31
266
|
```typescript
|
|
32
267
|
import React from 'react';
|
|
33
|
-
import { IDMScan } from 'test-react-native-sdk';
|
|
268
|
+
import { IDMScan } from '@test-web/react-native-sdk';
|
|
34
269
|
|
|
35
270
|
export default function App() {
|
|
36
|
-
|
|
271
|
+
const config = {
|
|
272
|
+
clientID: 'your-client-id',
|
|
273
|
+
clientSecret: 'your-client-secret',
|
|
274
|
+
environment: 'sandbox', // or 'production'
|
|
275
|
+
requestData: {
|
|
276
|
+
requestID: 'unique-request-id',
|
|
277
|
+
name: 'John Doe',
|
|
278
|
+
dateOfBirth: '1990-01-01',
|
|
279
|
+
},
|
|
280
|
+
theme: 'light',
|
|
281
|
+
};
|
|
282
|
+
|
|
283
|
+
return <IDMScan idmConf={config} />;
|
|
284
|
+
}
|
|
285
|
+
```
|
|
286
|
+
|
|
287
|
+
### With Custom Configuration
|
|
288
|
+
|
|
289
|
+
```typescript
|
|
290
|
+
import React from 'react';
|
|
291
|
+
import { IDMScan } from '@test-web/react-native-sdk';
|
|
292
|
+
|
|
293
|
+
export default function App() {
|
|
294
|
+
const idmConfiguration = {
|
|
295
|
+
clientID: process.env.IDM_CLIENT_ID,
|
|
296
|
+
clientSecret: process.env.IDM_CLIENT_SECRET,
|
|
297
|
+
environment: 'sandbox',
|
|
298
|
+
requestData: {
|
|
299
|
+
requestID: generateUniqueId(),
|
|
300
|
+
name: 'John Doe',
|
|
301
|
+
dateOfBirth: '1990-01-01',
|
|
302
|
+
countryCode: 'US',
|
|
303
|
+
mobile: '+1234567890',
|
|
304
|
+
callbackURL: 'https://your-api.com/callback',
|
|
305
|
+
},
|
|
306
|
+
theme: 'ocean',
|
|
307
|
+
};
|
|
308
|
+
|
|
309
|
+
return <IDMScan idmConf={idmConfiguration} />;
|
|
310
|
+
}
|
|
311
|
+
```
|
|
312
|
+
|
|
313
|
+
---
|
|
314
|
+
|
|
315
|
+
## 🎨 Available Themes
|
|
316
|
+
|
|
317
|
+
The SDK comes with 10 pre-built themes:
|
|
318
|
+
|
|
319
|
+
| Theme Name | Usage |
|
|
320
|
+
|------------|-------|
|
|
321
|
+
| Light | `theme: 'light'` |
|
|
322
|
+
| Dark | `theme: 'dark'` |
|
|
323
|
+
| Ocean | `theme: 'ocean'` |
|
|
324
|
+
| Sunset | `theme: 'sunset'` |
|
|
325
|
+
| Forest | `theme: 'forest'` |
|
|
326
|
+
| Pastel | `theme: 'pastel'` |
|
|
327
|
+
| High Contrast | `theme: 'highContrast'` |
|
|
328
|
+
| Professional | `theme: 'professional'` |
|
|
329
|
+
| Sakura | `theme: 'sakura'` |
|
|
330
|
+
| Midnight | `theme: 'midnight'` |
|
|
331
|
+
|
|
332
|
+
### Custom Theme Example
|
|
333
|
+
|
|
334
|
+
```typescript
|
|
335
|
+
import { IDMScan } from '@test-web/react-native-sdk';
|
|
336
|
+
|
|
337
|
+
const customTheme = {
|
|
338
|
+
colors: {
|
|
339
|
+
primary: '#FF6B6B',
|
|
340
|
+
secondary: '#4ECDC4',
|
|
341
|
+
background: '#FFFFFF',
|
|
342
|
+
text: '#2C3E50',
|
|
343
|
+
subtitle: '#7F8C8D',
|
|
344
|
+
border: '#BDC3C7',
|
|
345
|
+
error: '#E74C3C',
|
|
346
|
+
success: '#2ECC71',
|
|
347
|
+
},
|
|
348
|
+
spacing: {
|
|
349
|
+
xs: 4,
|
|
350
|
+
sm: 8,
|
|
351
|
+
md: 16,
|
|
352
|
+
lg: 24,
|
|
353
|
+
xl: 32,
|
|
354
|
+
},
|
|
355
|
+
};
|
|
356
|
+
|
|
357
|
+
export default function App() {
|
|
358
|
+
return <IDMScan idmConf={{ ...config, theme: customTheme }} />;
|
|
359
|
+
}
|
|
360
|
+
```
|
|
361
|
+
|
|
362
|
+
---
|
|
363
|
+
|
|
364
|
+
## 📸 Scanning Capabilities
|
|
365
|
+
|
|
366
|
+
### Barcode Scanning
|
|
367
|
+
|
|
368
|
+
The SDK supports barcode scanning with two modes:
|
|
369
|
+
|
|
370
|
+
#### 1. Production Mode (Recommended)
|
|
371
|
+
|
|
372
|
+
Install Dynamsoft Capture Vision for accurate barcode scanning:
|
|
373
|
+
|
|
374
|
+
```bash
|
|
375
|
+
npm install dynamsoft-capture-vision-react-native
|
|
376
|
+
```
|
|
377
|
+
|
|
378
|
+
**Supported Barcode Types:**
|
|
379
|
+
- PDF417 (Driver's License, ID Cards)
|
|
380
|
+
- QR Code
|
|
381
|
+
- Code 128
|
|
382
|
+
- Code 39
|
|
383
|
+
- EAN-13
|
|
384
|
+
- UPC-A
|
|
385
|
+
- And more...
|
|
386
|
+
|
|
387
|
+
**Initialize License:**
|
|
388
|
+
|
|
389
|
+
```typescript
|
|
390
|
+
import { DCVBarcodeReader } from 'dynamsoft-capture-vision-react-native';
|
|
391
|
+
|
|
392
|
+
// At app startup
|
|
393
|
+
await DCVBarcodeReader.initLicense('YOUR_LICENSE_KEY');
|
|
394
|
+
```
|
|
395
|
+
|
|
396
|
+
Get your free trial license from [Dynamsoft Customer Portal](https://www.dynamsoft.com/customer/license/trialLicense).
|
|
397
|
+
|
|
398
|
+
#### 2. Fallback Mode
|
|
399
|
+
|
|
400
|
+
Without Dynamsoft installed, the SDK will use simulation mode for testing purposes. This is useful for development but not recommended for production.
|
|
401
|
+
|
|
402
|
+
### MRZ Scanning
|
|
403
|
+
|
|
404
|
+
The SDK supports MRZ (Machine Readable Zone) scanning with two modes:
|
|
405
|
+
|
|
406
|
+
#### 1. Production Mode (Recommended)
|
|
407
|
+
|
|
408
|
+
Install ML Kit Text Recognition for accurate MRZ scanning:
|
|
409
|
+
|
|
410
|
+
```bash
|
|
411
|
+
npm install @react-native-ml-kit/text-recognition
|
|
412
|
+
```
|
|
413
|
+
|
|
414
|
+
**Supported MRZ Types:**
|
|
415
|
+
- TD1 (ID Cards)
|
|
416
|
+
- TD2 (Travel Documents)
|
|
417
|
+
- TD3 (Passports)
|
|
418
|
+
- MRVA (Visa Type A)
|
|
419
|
+
- MRVB (Visa Type B)
|
|
420
|
+
|
|
421
|
+
The SDK automatically detects the MRZ type based on document metadata.
|
|
422
|
+
|
|
423
|
+
#### 2. Fallback Mode
|
|
424
|
+
|
|
425
|
+
Without ML Kit installed, the SDK will use simulation mode for testing purposes. This is useful for development but not recommended for production.
|
|
426
|
+
|
|
427
|
+
### Scanning Flow
|
|
428
|
+
|
|
429
|
+
The SDK automatically determines which scanning methods are required based on document metadata:
|
|
430
|
+
|
|
431
|
+
```typescript
|
|
432
|
+
// Example metadata from API
|
|
433
|
+
{
|
|
434
|
+
"document_flow": ["F", "B"], // Front and Back required
|
|
435
|
+
"barcode": "PDF417 B" // Barcode on back side
|
|
436
|
+
}
|
|
437
|
+
```
|
|
438
|
+
|
|
439
|
+
**Flow:** Selfie → Front → Back → Barcode Scan → Complete
|
|
440
|
+
|
|
441
|
+
```typescript
|
|
442
|
+
// Example metadata for passport
|
|
443
|
+
{
|
|
444
|
+
"document_flow": ["F"], // Front only
|
|
445
|
+
"barcode": "TD3" // MRZ scanning required
|
|
446
|
+
}
|
|
447
|
+
```
|
|
448
|
+
|
|
449
|
+
**Flow:** Selfie → Front → MRZ Scan → Complete
|
|
450
|
+
|
|
451
|
+
---
|
|
452
|
+
|
|
453
|
+
## 🔄 Dynamic Flow
|
|
454
|
+
|
|
455
|
+
The SDK automatically determines the verification flow based on document metadata:
|
|
456
|
+
|
|
457
|
+
### Flow Examples
|
|
458
|
+
|
|
459
|
+
#### Example 1: Driver's License (Front Only)
|
|
460
|
+
```json
|
|
461
|
+
{
|
|
462
|
+
"document_flow": ["F"],
|
|
463
|
+
"barcode": "None"
|
|
464
|
+
}
|
|
465
|
+
```
|
|
466
|
+
**Flow:** Selfie → Front Document → Complete
|
|
467
|
+
|
|
468
|
+
#### Example 2: Passport (Front + MRZ)
|
|
469
|
+
```json
|
|
470
|
+
{
|
|
471
|
+
"document_flow": ["F"],
|
|
472
|
+
"barcode": "TD3"
|
|
473
|
+
}
|
|
474
|
+
```
|
|
475
|
+
**Flow:** Selfie → Front Document → MRZ Scan → Complete
|
|
476
|
+
|
|
477
|
+
#### Example 3: National ID (Front + Back + Barcode)
|
|
478
|
+
```json
|
|
479
|
+
{
|
|
480
|
+
"document_flow": ["F", "B"],
|
|
481
|
+
"barcode": "PDF417 B"
|
|
37
482
|
}
|
|
38
483
|
```
|
|
484
|
+
**Flow:** Selfie → Front Document → Back Document → Barcode Scan → Complete
|
|
485
|
+
|
|
486
|
+
---
|
|
487
|
+
|
|
488
|
+
## 📚 API Reference
|
|
489
|
+
|
|
490
|
+
### IDMConf Interface
|
|
491
|
+
|
|
492
|
+
```typescript
|
|
493
|
+
interface IDMConf {
|
|
494
|
+
// Required
|
|
495
|
+
clientID: string;
|
|
496
|
+
clientSecret: string;
|
|
497
|
+
environment: 'sandbox' | 'production';
|
|
498
|
+
requestData: RequestData;
|
|
499
|
+
|
|
500
|
+
// Optional
|
|
501
|
+
theme?: 'light' | 'dark' | Theme;
|
|
502
|
+
userDetails?: UserDetails;
|
|
503
|
+
accessToken?: string;
|
|
504
|
+
verificationCode?: string;
|
|
505
|
+
configuration?: Configuration;
|
|
506
|
+
countryDetails?: CountryDetail[];
|
|
507
|
+
selectedCountryDetails?: SelectedCountryDetail;
|
|
508
|
+
requestConfiguration?: RequestConfiguration;
|
|
509
|
+
}
|
|
510
|
+
|
|
511
|
+
interface RequestData {
|
|
512
|
+
requestID: string;
|
|
513
|
+
name?: string;
|
|
514
|
+
dateOfBirth?: string;
|
|
515
|
+
countryCode?: string;
|
|
516
|
+
mobile?: string;
|
|
517
|
+
callbackURL?: string;
|
|
518
|
+
redirectURL?: string;
|
|
519
|
+
}
|
|
520
|
+
```
|
|
521
|
+
|
|
522
|
+
### Exported Components
|
|
523
|
+
|
|
524
|
+
```typescript
|
|
525
|
+
import {
|
|
526
|
+
IDMScan, // Main SDK component
|
|
527
|
+
Button, // Themed button component
|
|
528
|
+
ThemedText, // Themed text component
|
|
529
|
+
Loader, // Loading indicator
|
|
530
|
+
Header, // Header component
|
|
531
|
+
Footer, // Footer component
|
|
532
|
+
CustomOverlay, // Overlay component
|
|
533
|
+
} from '@test-web/react-native-sdk';
|
|
534
|
+
```
|
|
535
|
+
|
|
536
|
+
### Exported Hooks
|
|
537
|
+
|
|
538
|
+
```typescript
|
|
539
|
+
import {
|
|
540
|
+
useTheme, // Access current theme
|
|
541
|
+
useOrientation, // Detect device orientation
|
|
542
|
+
useKeyboard, // Keyboard visibility state
|
|
543
|
+
useIDM, // Access IDM configuration
|
|
544
|
+
} from '@test-web/react-native-sdk';
|
|
545
|
+
```
|
|
546
|
+
|
|
547
|
+
### Exported Utilities
|
|
548
|
+
|
|
549
|
+
```typescript
|
|
550
|
+
import {
|
|
551
|
+
debounce, // Debounce function calls
|
|
552
|
+
throttle, // Throttle function calls
|
|
553
|
+
memoize, // Memoize function results
|
|
554
|
+
base64Encode, // Encode to base64
|
|
555
|
+
base64Decode, // Decode from base64
|
|
556
|
+
getDocumentLabel, // Get document type label
|
|
557
|
+
FlowManager, // Flow management class
|
|
558
|
+
createFlowManager, // Create flow manager
|
|
559
|
+
processImageToBase64, // Process images
|
|
560
|
+
} from '@test-web/react-native-sdk';
|
|
561
|
+
```
|
|
39
562
|
|
|
40
|
-
|
|
563
|
+
### API Services
|
|
41
564
|
|
|
42
565
|
```typescript
|
|
43
|
-
import {
|
|
566
|
+
import { ScanServices } from '@test-web/react-native-sdk';
|
|
567
|
+
|
|
568
|
+
// Available APIs
|
|
569
|
+
ScanServices.getUserDataAPI();
|
|
570
|
+
ScanServices.generateAccessToken(config);
|
|
571
|
+
ScanServices.generateRequest(config, requestData);
|
|
572
|
+
ScanServices.getConfiguration(config, verificationCode);
|
|
573
|
+
ScanServices.getCountries(config);
|
|
574
|
+
ScanServices.captureDocumentFront(config, photoData);
|
|
575
|
+
ScanServices.captureDocumentBack(config, photoData);
|
|
576
|
+
ScanServices.captureBarcode(config, barcodeData);
|
|
577
|
+
ScanServices.captureMRZ(config, mrzData);
|
|
578
|
+
ScanServices.completeVerification(config);
|
|
579
|
+
```
|
|
580
|
+
|
|
581
|
+
---
|
|
582
|
+
|
|
583
|
+
## 🔧 Troubleshooting
|
|
584
|
+
|
|
585
|
+
### Common Issues
|
|
586
|
+
|
|
587
|
+
#### 1. Camera Permission Denied
|
|
588
|
+
|
|
589
|
+
**Problem:** Camera not working or permission denied error.
|
|
590
|
+
|
|
591
|
+
**Solution:**
|
|
592
|
+
- Ensure you've added camera permissions to `AndroidManifest.xml` (Android)
|
|
593
|
+
- Ensure you've added `NSCameraUsageDescription` to `Info.plist` (iOS)
|
|
594
|
+
- Request permissions at runtime before using the SDK
|
|
595
|
+
|
|
596
|
+
#### 2. Location Not Available
|
|
44
597
|
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
598
|
+
**Problem:** Location permission errors.
|
|
599
|
+
|
|
600
|
+
**Solution:**
|
|
601
|
+
- Check location permissions in manifest/plist
|
|
602
|
+
- Ensure GPS is enabled on device
|
|
603
|
+
- Verify react-native-geolocation-service is installed
|
|
604
|
+
|
|
605
|
+
#### 3. Navigation Error
|
|
606
|
+
|
|
607
|
+
**Problem:** `Couldn't find a navigation object` error.
|
|
608
|
+
|
|
609
|
+
**Solution:**
|
|
610
|
+
- Ensure all navigation dependencies are installed
|
|
611
|
+
- Run `pod install` for iOS
|
|
612
|
+
- Clean and rebuild the app
|
|
613
|
+
|
|
614
|
+
#### 4. iOS Build Failed
|
|
615
|
+
|
|
616
|
+
**Problem:** Build fails on iOS after installation.
|
|
617
|
+
|
|
618
|
+
**Solution:**
|
|
619
|
+
```bash
|
|
620
|
+
cd ios && pod install && cd ..
|
|
621
|
+
# Clean build folder in Xcode
|
|
622
|
+
# Product → Clean Build Folder
|
|
623
|
+
# Rebuild the app
|
|
48
624
|
```
|
|
49
625
|
|
|
50
|
-
|
|
626
|
+
#### 5. Android Build Failed
|
|
627
|
+
|
|
628
|
+
**Problem:** Build fails on Android with dependency errors.
|
|
629
|
+
|
|
630
|
+
**Solution:**
|
|
631
|
+
```bash
|
|
632
|
+
cd android && ./gradlew clean && cd ..
|
|
633
|
+
# Rebuild the app
|
|
634
|
+
```
|
|
635
|
+
|
|
636
|
+
#### 6. Image Processing Fails
|
|
637
|
+
|
|
638
|
+
**Problem:** Images not uploading or processing errors.
|
|
639
|
+
|
|
640
|
+
**Solution:**
|
|
641
|
+
- Ensure react-native-image-resizer is installed
|
|
642
|
+
- Ensure react-native-fs is installed
|
|
643
|
+
- Check storage permissions
|
|
644
|
+
|
|
645
|
+
#### 7. Barcode Scanning Not Working
|
|
646
|
+
|
|
647
|
+
**Problem:** Barcode scanning shows simulation or doesn't detect barcodes.
|
|
648
|
+
|
|
649
|
+
**Solution:**
|
|
650
|
+
- Install `dynamsoft-capture-vision-react-native` for real barcode scanning
|
|
651
|
+
- Initialize Dynamsoft license key before using the SDK
|
|
652
|
+
- Ensure camera permissions are granted
|
|
653
|
+
- Test with a real PDF417 barcode (driver's license back)
|
|
654
|
+
- Check console logs for Dynamsoft initialization errors
|
|
655
|
+
|
|
656
|
+
#### 8. MRZ Scanning Not Working
|
|
657
|
+
|
|
658
|
+
**Problem:** MRZ scanning shows simulation or doesn't detect MRZ codes.
|
|
659
|
+
|
|
660
|
+
**Solution:**
|
|
661
|
+
- Install `@react-native-ml-kit/text-recognition` for real MRZ scanning
|
|
662
|
+
- Ensure camera permissions are granted
|
|
663
|
+
- Test with a real passport or ID card with MRZ
|
|
664
|
+
- Ensure good lighting and steady camera position
|
|
665
|
+
- Check console logs for ML Kit errors
|
|
666
|
+
|
|
667
|
+
---
|
|
668
|
+
|
|
669
|
+
## 🧪 Testing Scanning Features
|
|
670
|
+
|
|
671
|
+
### Testing Barcode Scanning
|
|
672
|
+
|
|
673
|
+
#### With Dynamsoft (Production)
|
|
674
|
+
|
|
675
|
+
1. Install Dynamsoft:
|
|
676
|
+
```bash
|
|
677
|
+
npm install dynamsoft-capture-vision-react-native
|
|
678
|
+
```
|
|
679
|
+
|
|
680
|
+
2. Get a trial license from [Dynamsoft](https://www.dynamsoft.com/customer/license/trialLicense)
|
|
681
|
+
|
|
682
|
+
3. Initialize in your app:
|
|
683
|
+
```typescript
|
|
684
|
+
import { DCVBarcodeReader } from 'dynamsoft-capture-vision-react-native';
|
|
685
|
+
|
|
686
|
+
await DCVBarcodeReader.initLicense('YOUR_LICENSE_KEY');
|
|
687
|
+
```
|
|
688
|
+
|
|
689
|
+
4. Test with a real driver's license or ID card with PDF417 barcode
|
|
690
|
+
|
|
691
|
+
#### Without Dynamsoft (Development)
|
|
692
|
+
|
|
693
|
+
The SDK will automatically use simulation mode. After 3 seconds, it will generate a simulated barcode result.
|
|
694
|
+
|
|
695
|
+
### Testing MRZ Scanning
|
|
696
|
+
|
|
697
|
+
#### With ML Kit (Production)
|
|
698
|
+
|
|
699
|
+
1. Install ML Kit:
|
|
700
|
+
```bash
|
|
701
|
+
npm install @react-native-ml-kit/text-recognition
|
|
702
|
+
```
|
|
703
|
+
|
|
704
|
+
2. Test with a real passport or ID card with MRZ zone
|
|
705
|
+
|
|
706
|
+
3. Ensure good lighting and hold the document steady
|
|
707
|
+
|
|
708
|
+
#### Without ML Kit (Development)
|
|
709
|
+
|
|
710
|
+
The SDK will automatically use simulation mode. After 3 seconds, it will generate a simulated MRZ result.
|
|
711
|
+
|
|
712
|
+
### Checking Scanner Status
|
|
713
|
+
|
|
714
|
+
The SDK logs which scanning mode is being used:
|
|
715
|
+
|
|
716
|
+
```
|
|
717
|
+
// Console output examples:
|
|
718
|
+
"Dynamsoft Barcode Scanner initialized" // Production mode
|
|
719
|
+
"Dynamsoft not available, using fallback" // Simulation mode
|
|
720
|
+
|
|
721
|
+
"ML Kit text recognition initialized" // Production mode
|
|
722
|
+
"ML Kit not available, using fallback" // Simulation mode
|
|
723
|
+
```
|
|
724
|
+
|
|
725
|
+
---
|
|
726
|
+
|
|
727
|
+
## 🎯 Advanced Usage
|
|
728
|
+
|
|
729
|
+
### Using Context
|
|
730
|
+
|
|
731
|
+
```typescript
|
|
732
|
+
import { useIDM } from '@test-web/react-native-sdk';
|
|
733
|
+
|
|
734
|
+
function MyComponent() {
|
|
735
|
+
const { idmConf, updateIDMConf } = useIDM();
|
|
736
|
+
|
|
737
|
+
// Access configuration
|
|
738
|
+
console.log(idmConf.verificationCode);
|
|
739
|
+
|
|
740
|
+
// Update configuration
|
|
741
|
+
updateIDMConf({ theme: 'dark' });
|
|
742
|
+
}
|
|
743
|
+
```
|
|
744
|
+
|
|
745
|
+
### Flow Manager
|
|
746
|
+
|
|
747
|
+
```typescript
|
|
748
|
+
import { createFlowManager } from '@test-web/react-native-sdk';
|
|
749
|
+
|
|
750
|
+
const metadata = idmConf.selectedCountryDetails?.selectedMetaData;
|
|
751
|
+
const flowManager = createFlowManager(metadata);
|
|
752
|
+
|
|
753
|
+
// Check requirements
|
|
754
|
+
const needsBack = flowManager.requiresBackCapture();
|
|
755
|
+
const needsBarcode = flowManager.requiresBarcodeCapture();
|
|
756
|
+
const needsMRZ = flowManager.requiresMRZCapture();
|
|
757
|
+
|
|
758
|
+
// Get next screen
|
|
759
|
+
const nextScreen = flowManager.getNextScreenAfterFront();
|
|
760
|
+
```
|
|
761
|
+
|
|
762
|
+
### Image Processing
|
|
763
|
+
|
|
764
|
+
```typescript
|
|
765
|
+
import { processImageToBase64 } from '@test-web/react-native-sdk';
|
|
766
|
+
|
|
767
|
+
const base64Image = await processImageToBase64(imagePath, {
|
|
768
|
+
width: 810,
|
|
769
|
+
height: 1080,
|
|
770
|
+
quality: 70,
|
|
771
|
+
format: 'JPEG',
|
|
772
|
+
});
|
|
773
|
+
```
|
|
774
|
+
|
|
775
|
+
---
|
|
776
|
+
|
|
777
|
+
## 📊 Performance
|
|
778
|
+
|
|
779
|
+
The SDK includes several performance optimizations:
|
|
780
|
+
|
|
781
|
+
- **Memoization** - Components and calculations are memoized
|
|
782
|
+
- **Lazy Loading** - Heavy dependencies loaded only when needed
|
|
783
|
+
- **Image Optimization** - Images resized before upload (810x1080, 70% quality)
|
|
784
|
+
- **Efficient State** - Minimal re-renders with optimized context
|
|
785
|
+
- **API Caching** - Countries and configuration cached after first fetch
|
|
786
|
+
|
|
787
|
+
---
|
|
788
|
+
|
|
789
|
+
## 🔒 Security
|
|
790
|
+
|
|
791
|
+
- OAuth2 authentication with client credentials
|
|
792
|
+
- Secure token management
|
|
793
|
+
- HTTPS for all API calls
|
|
794
|
+
- No sensitive data stored locally
|
|
795
|
+
- Proper error handling without exposing internals
|
|
796
|
+
|
|
797
|
+
---
|
|
798
|
+
|
|
799
|
+
## 📄 License
|
|
800
|
+
|
|
801
|
+
MIT License
|
|
802
|
+
|
|
803
|
+
Copyright (c) 2024 Your Company
|
|
804
|
+
|
|
805
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
|
|
806
|
+
|
|
807
|
+
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
|
|
808
|
+
|
|
809
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
|
810
|
+
|
|
811
|
+
---
|
|
812
|
+
|
|
813
|
+
## 📞 Support
|
|
814
|
+
|
|
815
|
+
- **Email:** hello@yourcompany.com
|
|
816
|
+
- **GitHub:** https://github.com/yourcompany/react-native-sdk
|
|
817
|
+
- **Documentation:** https://docs.yourcompany.com
|
|
818
|
+
|
|
819
|
+
---
|
|
820
|
+
|
|
821
|
+
## 🎉 What's New in v2.0.0
|
|
822
|
+
|
|
823
|
+
### Major Changes
|
|
824
|
+
- ✅ **Fully Dynamic** - All configuration driven by API
|
|
825
|
+
- ✅ **Metadata-Driven Navigation** - Automatic flow determination
|
|
826
|
+
- ✅ **Real API Integration** - All APIs implemented
|
|
827
|
+
- ✅ **Enhanced Type System** - Complete TypeScript coverage
|
|
828
|
+
- ✅ **Performance Optimizations** - Memoization and efficient rendering
|
|
829
|
+
- ✅ **Image Processing** - Automatic resize and compression
|
|
830
|
+
- ✅ **Flow Manager** - Smart navigation based on document type
|
|
831
|
+
- ✅ **Better Error Handling** - Comprehensive error management
|
|
832
|
+
- ✅ **Loading States** - User feedback throughout the flow
|
|
833
|
+
- ✅ **Dynamsoft Integration** - Professional barcode scanning (optional)
|
|
834
|
+
- ✅ **ML Kit Integration** - Accurate MRZ text recognition (optional)
|
|
835
|
+
|
|
836
|
+
### Scanning Features
|
|
837
|
+
- **Dynamsoft Capture Vision** - Industry-leading barcode scanning for PDF417, QR codes, and more
|
|
838
|
+
- **ML Kit Text Recognition** - Google's ML Kit for accurate MRZ detection on passports and ID cards
|
|
839
|
+
- **Fallback Mode** - Simulation mode for development without external libraries
|
|
840
|
+
- **Auto-Detection** - SDK automatically uses available scanning libraries
|
|
841
|
+
|
|
842
|
+
### Breaking Changes from v1.x
|
|
843
|
+
- `clientID`, `clientSecret`, `environment`, and `requestData` are now required
|
|
844
|
+
- Static country data removed (now fetched from API)
|
|
845
|
+
- Navigation flow is now metadata-driven
|
|
51
846
|
|
|
52
|
-
|
|
847
|
+
### Migration from v1.x
|
|
848
|
+
See migration guide in the repository for detailed instructions.
|
|
53
849
|
|
|
54
|
-
|
|
850
|
+
---
|
|
55
851
|
|
|
56
|
-
|
|
852
|
+
**Made with ❤️ by Your Company**
|
|
57
853
|
|
|
58
|
-
|
|
854
|
+
**Version:** 2.0.0
|
|
855
|
+
**Status:** Production Ready
|
|
856
|
+
**Last Updated:** December 22, 2024
|