frames-react-native 1.0.0 → 1.1.3
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 +33 -15
- package/__tests__/Integration.test.tsx +94 -23
- package/dist/Frames.d.ts +0 -1
- package/dist/Frames.js +12 -1
- package/dist/Frames.js.map +1 -1
- package/dist/components/CardNumber.d.ts +2 -2
- package/dist/components/CardNumber.js +12 -4
- package/dist/components/CardNumber.js.map +1 -1
- package/dist/components/SubmitButton.d.ts +2 -2
- package/dist/components/SubmitButton.js +24 -4
- package/dist/components/SubmitButton.js.map +1 -1
- package/dist/icons/mada.png +0 -0
- package/dist/types/types.d.ts +16 -2
- package/dist/utils/actions.d.ts +2 -1
- package/dist/utils/actions.js +2 -1
- package/dist/utils/actions.js.map +1 -1
- package/dist/utils/card.d.ts +3 -2
- package/dist/utils/card.js +16 -12
- package/dist/utils/card.js.map +1 -1
- package/dist/utils/logger.js +19 -3
- package/dist/utils/logger.js.map +1 -1
- package/dist/utils/reducer.d.ts +3 -1
- package/dist/utils/reducer.js +3 -1
- package/dist/utils/reducer.js.map +1 -1
- package/package.json +5 -7
package/README.md
CHANGED
|
@@ -1,14 +1,25 @@
|
|
|
1
|
-
❗️BETA
|
|
2
|
-
|
|
3
1
|
# Frames React Native
|
|
4
2
|
|
|
5
|
-
[](https://codecov.io/gh/checkout/frames-react-native)
|
|
6
4
|
[](https://github.com/checkout/frames-react-native/actions/workflows/cd.yml)
|
|
7
5
|
|
|
6
|
+
Start accepting online card payments in just a few minutes with Frames. It's quick and easy to integrate, accepts online card payments from all major credit cards, and is customizable to your brand.
|
|
7
|
+
|
|
8
8
|
<p align="center">
|
|
9
9
|
<img src="https://s3.gifyu.com/images/Untitled62eae8e0234fa129.gif" alt="Demo frames react native"/>
|
|
10
10
|
</p>
|
|
11
11
|
|
|
12
|
+
# :nerd_face: How does it work?
|
|
13
|
+
|
|
14
|
+
- Accepting card payments generally has 2 main stages. The first is collecting the _card details securely_ (client-side), and the second is _processing a payment_ via the API (server-side). Frames is addressing only the first stage. The server-side interaction can easily be achieved by using our various [server side SDKs](https://docs.checkout.com/integrate/sdks#SDKs-WebSDKlibraries).
|
|
15
|
+
- The Frames React Nave project provides customisable inputs for the card details with the core purpose of tokenising the sensitive information and giving back a secure token (alongside various card metadata, like the BIN information).
|
|
16
|
+
|
|
17
|
+
> Frames is meant to be used in conjunction with the rest of your checkout page elements as opposed to being an independent view. That way, you have full control of the UI, and you can implement other payment methods or collect other details (like billing details) alongside it.
|
|
18
|
+
|
|
19
|
+
<p align="center">
|
|
20
|
+
<img src="https://s3.gifyu.com/images/FramesforAndroid.png" alt="Demo frames react native" width="500px"/>
|
|
21
|
+
</p>
|
|
22
|
+
|
|
12
23
|
# :rocket: Install
|
|
13
24
|
|
|
14
25
|
```bash
|
|
@@ -38,7 +49,7 @@ import {
|
|
|
38
49
|
ExpiryDate,
|
|
39
50
|
Cvv,
|
|
40
51
|
SubmitButton,
|
|
41
|
-
} from "
|
|
52
|
+
} from "./dist/index";
|
|
42
53
|
|
|
43
54
|
export default function App() {
|
|
44
55
|
return (
|
|
@@ -52,7 +63,11 @@ export default function App() {
|
|
|
52
63
|
alert(e.token);
|
|
53
64
|
}}
|
|
54
65
|
>
|
|
55
|
-
<CardNumber
|
|
66
|
+
<CardNumber
|
|
67
|
+
style={styles.cardNumber}
|
|
68
|
+
placeholderTextColor="#9898A0"
|
|
69
|
+
// showIcon={false} in case you don't want to see the card scheme logo
|
|
70
|
+
/>
|
|
56
71
|
|
|
57
72
|
<View style={styles.dateAndCode}>
|
|
58
73
|
<ExpiryDate
|
|
@@ -62,13 +77,12 @@ export default function App() {
|
|
|
62
77
|
<Cvv style={styles.cvv} placeholderTextColor="#9898A0" />
|
|
63
78
|
</View>
|
|
64
79
|
|
|
65
|
-
<
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
</TouchableHighlight>
|
|
80
|
+
<SubmitButton
|
|
81
|
+
title="Pay Now"
|
|
82
|
+
style={styles.button}
|
|
83
|
+
textStyle={styles.buttonText}
|
|
84
|
+
onPress={() => console.log("merchant action")}
|
|
85
|
+
/>
|
|
72
86
|
</Frames>
|
|
73
87
|
</View>
|
|
74
88
|
);
|
|
@@ -77,7 +91,7 @@ export default function App() {
|
|
|
77
91
|
const styles = StyleSheet.create({
|
|
78
92
|
container: {
|
|
79
93
|
flex: 1,
|
|
80
|
-
backgroundColor: "#
|
|
94
|
+
backgroundColor: "#000000",
|
|
81
95
|
alignItems: "center",
|
|
82
96
|
justifyContent: "flex-start",
|
|
83
97
|
paddingTop: 80,
|
|
@@ -116,11 +130,14 @@ const styles = StyleSheet.create({
|
|
|
116
130
|
},
|
|
117
131
|
button: {
|
|
118
132
|
height: 50,
|
|
119
|
-
width: "100%",
|
|
120
133
|
borderRadius: 5,
|
|
121
|
-
backgroundColor: "#0E84FF",
|
|
122
134
|
marginTop: 20,
|
|
123
135
|
justifyContent: "center",
|
|
136
|
+
backgroundColor: "#4285F4",
|
|
137
|
+
},
|
|
138
|
+
buttonText: {
|
|
139
|
+
color: "white",
|
|
140
|
+
fontSize: 16,
|
|
124
141
|
},
|
|
125
142
|
});
|
|
126
143
|
```
|
|
@@ -160,3 +177,4 @@ The tokenization is triggered when the SubmitButton is pressed. The process of g
|
|
|
160
177
|
| cardValidationChanged | function | Triggered when the state of the card validation changes. |
|
|
161
178
|
| cardTokenized | function | Triggered after a card is tokenized. Here you will get the card token alongside general card information |
|
|
162
179
|
| cardTokenizationFailed | function | Triggered after the card tokenization fails. |
|
|
180
|
+
| cardBinChanged | function | Triggered when the user inputs or changes the first 8 digits of a card. |
|
|
@@ -15,7 +15,7 @@ describe("CardNumber", () => {
|
|
|
15
15
|
it("triggers the card tokenization", async () => {
|
|
16
16
|
const tokenized = jest.fn();
|
|
17
17
|
|
|
18
|
-
const { getByPlaceholderText,
|
|
18
|
+
const { getByPlaceholderText, getByTestId } = render(
|
|
19
19
|
<Frames
|
|
20
20
|
config={{
|
|
21
21
|
publicKey: PK,
|
|
@@ -26,14 +26,18 @@ describe("CardNumber", () => {
|
|
|
26
26
|
<CardNumber placeholder="card-number" />
|
|
27
27
|
<ExpiryDate placeholder="expiry-date" />
|
|
28
28
|
<Cvv placeholder="cvv" />
|
|
29
|
-
<SubmitButton
|
|
29
|
+
<SubmitButton
|
|
30
|
+
title="Pay Now"
|
|
31
|
+
testID={"submit-button"}
|
|
32
|
+
onPress={() => {}}
|
|
33
|
+
/>
|
|
30
34
|
</Frames>
|
|
31
35
|
);
|
|
32
36
|
|
|
33
37
|
let cardNumber = getByPlaceholderText("card-number");
|
|
34
38
|
let expiryDate = getByPlaceholderText("expiry-date");
|
|
35
39
|
let cvv = getByPlaceholderText("cvv");
|
|
36
|
-
let pay =
|
|
40
|
+
let pay = getByTestId("submit-button");
|
|
37
41
|
fireEvent.changeText(cardNumber, "4242424242424242");
|
|
38
42
|
fireEvent.changeText(expiryDate, "1128");
|
|
39
43
|
fireEvent.changeText(cvv, "100");
|
|
@@ -44,10 +48,41 @@ describe("CardNumber", () => {
|
|
|
44
48
|
expect(tokenized.mock.calls[0][0].last4).toEqual("4242");
|
|
45
49
|
});
|
|
46
50
|
|
|
51
|
+
it("shared the card bin", async () => {
|
|
52
|
+
const binChange = jest.fn();
|
|
53
|
+
|
|
54
|
+
const { getByPlaceholderText, getByTestId } = render(
|
|
55
|
+
<Frames
|
|
56
|
+
config={{
|
|
57
|
+
publicKey: PK,
|
|
58
|
+
debug: true,
|
|
59
|
+
}}
|
|
60
|
+
cardTokenized={() => {}}
|
|
61
|
+
cardBinChanged={binChange}
|
|
62
|
+
>
|
|
63
|
+
<CardNumber placeholder="card-number" />
|
|
64
|
+
<ExpiryDate placeholder="expiry-date" />
|
|
65
|
+
<Cvv placeholder="cvv" />
|
|
66
|
+
<SubmitButton
|
|
67
|
+
title="Pay Now"
|
|
68
|
+
testID={"submit-button"}
|
|
69
|
+
onPress={() => {}}
|
|
70
|
+
/>
|
|
71
|
+
</Frames>
|
|
72
|
+
);
|
|
73
|
+
|
|
74
|
+
let cardNumber = getByPlaceholderText("card-number");
|
|
75
|
+
let expiryDate = getByPlaceholderText("expiry-date");
|
|
76
|
+
let cvv = getByPlaceholderText("cvv");
|
|
77
|
+
let pay = getByTestId("submit-button");
|
|
78
|
+
fireEvent.changeText(cardNumber, "42424242");
|
|
79
|
+
expect(binChange).toHaveBeenCalledTimes(1);
|
|
80
|
+
});
|
|
81
|
+
|
|
47
82
|
it("fails the card tokenization when the card number is invalid", async () => {
|
|
48
83
|
const failed = jest.fn();
|
|
49
84
|
|
|
50
|
-
const { getByPlaceholderText,
|
|
85
|
+
const { getByPlaceholderText, getByTestId } = render(
|
|
51
86
|
<Frames
|
|
52
87
|
config={{
|
|
53
88
|
publicKey: PK,
|
|
@@ -58,14 +93,18 @@ describe("CardNumber", () => {
|
|
|
58
93
|
<CardNumber placeholder="card-number" />
|
|
59
94
|
<ExpiryDate placeholder="expiry-date" />
|
|
60
95
|
<Cvv placeholder="cvv" />
|
|
61
|
-
<SubmitButton
|
|
96
|
+
<SubmitButton
|
|
97
|
+
title="Pay Now"
|
|
98
|
+
testID={"submit-button"}
|
|
99
|
+
onPress={() => {}}
|
|
100
|
+
/>
|
|
62
101
|
</Frames>
|
|
63
102
|
);
|
|
64
103
|
|
|
65
104
|
let cardNumber = getByPlaceholderText("card-number");
|
|
66
105
|
let expiryDate = getByPlaceholderText("expiry-date");
|
|
67
106
|
let cvv = getByPlaceholderText("cvv");
|
|
68
|
-
let pay =
|
|
107
|
+
let pay = getByTestId("submit-button");
|
|
69
108
|
fireEvent.changeText(cardNumber, "12345");
|
|
70
109
|
fireEvent.changeText(expiryDate, "1128");
|
|
71
110
|
fireEvent.changeText(cvv, "100");
|
|
@@ -77,7 +116,13 @@ describe("CardNumber", () => {
|
|
|
77
116
|
|
|
78
117
|
it("throws when the pay button is outside of context", async () => {
|
|
79
118
|
expect(() => {
|
|
80
|
-
render(
|
|
119
|
+
render(
|
|
120
|
+
<SubmitButton
|
|
121
|
+
title="Pay Now"
|
|
122
|
+
testID={"submit-button"}
|
|
123
|
+
onPress={() => {}}
|
|
124
|
+
/>
|
|
125
|
+
);
|
|
81
126
|
}).toThrow(
|
|
82
127
|
"It looks like you are trying to render the SubmitButton outside of the Frames Component."
|
|
83
128
|
);
|
|
@@ -86,7 +131,7 @@ describe("CardNumber", () => {
|
|
|
86
131
|
it("throws allow then use of the onPress handler", async () => {
|
|
87
132
|
const press = jest.fn();
|
|
88
133
|
|
|
89
|
-
const { getByPlaceholderText,
|
|
134
|
+
const { getByPlaceholderText, getByTestId } = render(
|
|
90
135
|
<Frames
|
|
91
136
|
config={{
|
|
92
137
|
publicKey: PK,
|
|
@@ -109,13 +154,17 @@ describe("CardNumber", () => {
|
|
|
109
154
|
<CardNumber placeholder="card-number" />
|
|
110
155
|
<ExpiryDate placeholder="expiry-date" />
|
|
111
156
|
<Cvv placeholder="cvv" />
|
|
112
|
-
<SubmitButton
|
|
157
|
+
<SubmitButton
|
|
158
|
+
title="Pay Now"
|
|
159
|
+
testID={"submit-button"}
|
|
160
|
+
onPress={press}
|
|
161
|
+
/>
|
|
113
162
|
</Frames>
|
|
114
163
|
);
|
|
115
164
|
let cardNumber = getByPlaceholderText("card-number");
|
|
116
165
|
let expiryDate = getByPlaceholderText("expiry-date");
|
|
117
166
|
let cvv = getByPlaceholderText("cvv");
|
|
118
|
-
let pay =
|
|
167
|
+
let pay = getByTestId("submit-button");
|
|
119
168
|
fireEvent.changeText(cardNumber, "4242424242424242");
|
|
120
169
|
fireEvent.changeText(expiryDate, "1128");
|
|
121
170
|
fireEvent.changeText(cvv, "100");
|
|
@@ -128,7 +177,7 @@ describe("CardNumber", () => {
|
|
|
128
177
|
it("fails tokenization", async () => {
|
|
129
178
|
const failed = jest.fn();
|
|
130
179
|
|
|
131
|
-
const { getByPlaceholderText,
|
|
180
|
+
const { getByPlaceholderText, getByTestId } = render(
|
|
132
181
|
<Frames
|
|
133
182
|
config={{
|
|
134
183
|
publicKey: "pk_test_baabd05f-1cdb-43d9-851e-635a79f6e7ad", // this account does not have Visa enabled
|
|
@@ -143,14 +192,18 @@ describe("CardNumber", () => {
|
|
|
143
192
|
<CardNumber placeholder="card-number" />
|
|
144
193
|
<ExpiryDate placeholder="expiry-date" />
|
|
145
194
|
<Cvv placeholder="cvv" />
|
|
146
|
-
<SubmitButton
|
|
195
|
+
<SubmitButton
|
|
196
|
+
title="Pay Now"
|
|
197
|
+
testID={"submit-button"}
|
|
198
|
+
onPress={() => {}}
|
|
199
|
+
/>
|
|
147
200
|
</Frames>
|
|
148
201
|
);
|
|
149
202
|
|
|
150
203
|
let cardNumber = getByPlaceholderText("card-number");
|
|
151
204
|
let expiryDate = getByPlaceholderText("expiry-date");
|
|
152
205
|
let cvv = getByPlaceholderText("cvv");
|
|
153
|
-
let pay =
|
|
206
|
+
let pay = getByTestId("submit-button");
|
|
154
207
|
fireEvent.changeText(cardNumber, "4242424242424242");
|
|
155
208
|
fireEvent.changeText(expiryDate, "0628");
|
|
156
209
|
fireEvent.changeText(cvv, "100");
|
|
@@ -163,7 +216,7 @@ describe("CardNumber", () => {
|
|
|
163
216
|
it("triggers the card tokenization with billing details", async () => {
|
|
164
217
|
const tokenized = jest.fn();
|
|
165
218
|
|
|
166
|
-
const { getByPlaceholderText,
|
|
219
|
+
const { getByPlaceholderText, getByTestId } = render(
|
|
167
220
|
<Frames
|
|
168
221
|
config={{
|
|
169
222
|
publicKey: PK,
|
|
@@ -186,14 +239,18 @@ describe("CardNumber", () => {
|
|
|
186
239
|
<CardNumber placeholder="card-number" />
|
|
187
240
|
<ExpiryDate placeholder="expiry-date" />
|
|
188
241
|
<Cvv placeholder="cvv" />
|
|
189
|
-
<SubmitButton
|
|
242
|
+
<SubmitButton
|
|
243
|
+
title="Pay Now"
|
|
244
|
+
testID={"submit-button"}
|
|
245
|
+
onPress={() => {}}
|
|
246
|
+
/>
|
|
190
247
|
</Frames>
|
|
191
248
|
);
|
|
192
249
|
|
|
193
250
|
let cardNumber = getByPlaceholderText("card-number");
|
|
194
251
|
let expiryDate = getByPlaceholderText("expiry-date");
|
|
195
252
|
let cvv = getByPlaceholderText("cvv");
|
|
196
|
-
let pay =
|
|
253
|
+
let pay = getByTestId("submit-button");
|
|
197
254
|
fireEvent.changeText(cardNumber, "4242424242424242");
|
|
198
255
|
fireEvent.changeText(expiryDate, "1128");
|
|
199
256
|
fireEvent.changeText(cvv, "100");
|
|
@@ -209,7 +266,7 @@ describe("CardNumber", () => {
|
|
|
209
266
|
it("triggers the card tokenization with amex", async () => {
|
|
210
267
|
const tokenized = jest.fn();
|
|
211
268
|
|
|
212
|
-
const { getByPlaceholderText,
|
|
269
|
+
const { getByPlaceholderText, getByTestId } = render(
|
|
213
270
|
<Frames
|
|
214
271
|
config={{
|
|
215
272
|
publicKey: PK,
|
|
@@ -219,14 +276,18 @@ describe("CardNumber", () => {
|
|
|
219
276
|
<CardNumber placeholder="card-number" />
|
|
220
277
|
<ExpiryDate placeholder="expiry-date" />
|
|
221
278
|
<Cvv placeholder="cvv" />
|
|
222
|
-
<SubmitButton
|
|
279
|
+
<SubmitButton
|
|
280
|
+
title="Pay Now"
|
|
281
|
+
testID={"submit-button"}
|
|
282
|
+
onPress={() => {}}
|
|
283
|
+
/>
|
|
223
284
|
</Frames>
|
|
224
285
|
);
|
|
225
286
|
|
|
226
287
|
let cardNumber = getByPlaceholderText("card-number");
|
|
227
288
|
let expiryDate = getByPlaceholderText("expiry-date");
|
|
228
289
|
let cvv = getByPlaceholderText("cvv");
|
|
229
|
-
let pay =
|
|
290
|
+
let pay = getByTestId("submit-button");
|
|
230
291
|
fireEvent.changeText(cardNumber, "378282246310005");
|
|
231
292
|
fireEvent.changeText(expiryDate, "1128");
|
|
232
293
|
fireEvent.changeText(cvv, "1000");
|
|
@@ -239,7 +300,7 @@ describe("CardNumber", () => {
|
|
|
239
300
|
it("triggers the card tokenization with minimal billing details", async () => {
|
|
240
301
|
const tokenized = jest.fn();
|
|
241
302
|
|
|
242
|
-
const { getByPlaceholderText,
|
|
303
|
+
const { getByPlaceholderText, getByTestId } = render(
|
|
243
304
|
<Frames
|
|
244
305
|
config={{
|
|
245
306
|
publicKey: PK,
|
|
@@ -260,14 +321,18 @@ describe("CardNumber", () => {
|
|
|
260
321
|
<CardNumber placeholder="card-number" />
|
|
261
322
|
<ExpiryDate placeholder="expiry-date" />
|
|
262
323
|
<Cvv placeholder="cvv" />
|
|
263
|
-
<SubmitButton
|
|
324
|
+
<SubmitButton
|
|
325
|
+
title="Pay Now"
|
|
326
|
+
testID={"submit-button"}
|
|
327
|
+
onPress={() => {}}
|
|
328
|
+
/>
|
|
264
329
|
</Frames>
|
|
265
330
|
);
|
|
266
331
|
|
|
267
332
|
let cardNumber = getByPlaceholderText("card-number");
|
|
268
333
|
let expiryDate = getByPlaceholderText("expiry-date");
|
|
269
334
|
let cvv = getByPlaceholderText("cvv");
|
|
270
|
-
let pay =
|
|
335
|
+
let pay = getByTestId("submit-button");
|
|
271
336
|
fireEvent.changeText(cardNumber, "4242424242424242");
|
|
272
337
|
fireEvent.changeText(expiryDate, "1128");
|
|
273
338
|
fireEvent.changeText(cvv, "100");
|
|
@@ -319,7 +384,13 @@ describe("CardNumber", () => {
|
|
|
319
384
|
it("triggers throws if you render the submit button outside of context", async () => {
|
|
320
385
|
let exception;
|
|
321
386
|
try {
|
|
322
|
-
render(
|
|
387
|
+
render(
|
|
388
|
+
<SubmitButton
|
|
389
|
+
title="Pay Now"
|
|
390
|
+
testID={"submit-button"}
|
|
391
|
+
onPress={() => {}}
|
|
392
|
+
/>
|
|
393
|
+
);
|
|
323
394
|
} catch (e) {
|
|
324
395
|
exception = e;
|
|
325
396
|
}
|
package/dist/Frames.d.ts
CHANGED
package/dist/Frames.js
CHANGED
|
@@ -37,7 +37,6 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
|
|
|
37
37
|
import React, { useEffect } from "react";
|
|
38
38
|
import { View, StyleSheet } from "react-native";
|
|
39
39
|
import { framesReducer } from "./utils/reducer";
|
|
40
|
-
import "react-native-get-random-values";
|
|
41
40
|
import { log } from "./utils/logger";
|
|
42
41
|
import { tokenize, formatDataForTokenization } from "./utils/http";
|
|
43
42
|
export var FramesContext = React.createContext({});
|
|
@@ -45,6 +44,10 @@ var Frames = function (props) {
|
|
|
45
44
|
// @ts-ignore
|
|
46
45
|
var _a = React.useReducer(framesReducer, {
|
|
47
46
|
cardNumber: null,
|
|
47
|
+
cardBin: {
|
|
48
|
+
bin: null,
|
|
49
|
+
scheme: null,
|
|
50
|
+
},
|
|
48
51
|
cardType: null,
|
|
49
52
|
cardIcon: undefined,
|
|
50
53
|
expiryDate: null,
|
|
@@ -85,6 +88,14 @@ var Frames = function (props) {
|
|
|
85
88
|
}
|
|
86
89
|
});
|
|
87
90
|
}); };
|
|
91
|
+
useEffect(function () {
|
|
92
|
+
if (state.cardBin.bin !== null) {
|
|
93
|
+
if (props.config.debug)
|
|
94
|
+
console.info("Emitting \"cardBinChanged\"", state.cardBin);
|
|
95
|
+
if (props.cardBinChanged)
|
|
96
|
+
props.cardBinChanged(state.cardBin);
|
|
97
|
+
}
|
|
98
|
+
}, [state.cardBin]);
|
|
88
99
|
useEffect(function () {
|
|
89
100
|
if (state.cardNumber !== null) {
|
|
90
101
|
var payload = {
|
package/dist/Frames.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Frames.js","sourceRoot":"","sources":["../src/Frames.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACzC,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;
|
|
1
|
+
{"version":3,"file":"Frames.js","sourceRoot":"","sources":["../src/Frames.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
-
import {
|
|
3
|
-
declare const CardNumber: React.FC<
|
|
2
|
+
import { FramesCardFieldProps } from "../types/types";
|
|
3
|
+
declare const CardNumber: React.FC<FramesCardFieldProps>;
|
|
4
4
|
export default CardNumber;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import { StyleSheet, View, TextInput, Image } from "react-native";
|
|
3
|
-
import { CARD_CHANGE } from "../utils/actions";
|
|
3
|
+
import { BIN_CHANGE, CARD_CHANGE } from "../utils/actions";
|
|
4
4
|
import { FramesConsumer } from "../Frames";
|
|
5
5
|
import { DEFAULT_CARD_NUMBER_PLACEHOLDER } from "../utils/constants";
|
|
6
6
|
var CardNumber = function (props) {
|
|
@@ -13,10 +13,18 @@ var CardNumber = function (props) {
|
|
|
13
13
|
return (<View style={styles.wrapper}>
|
|
14
14
|
<TextInput autoCompleteType="cc-number" keyboardType="number-pad" returnKeyType="done" placeholder={DEFAULT_CARD_NUMBER_PLACEHOLDER} {...props} value={state.cardNumber} style={[styles.cardNumber, props.style]} onChangeText={function (val) {
|
|
15
15
|
dispatch({ type: CARD_CHANGE, payload: val });
|
|
16
|
+
if (val.replace(/[^0-9]/g, "").length >= 8 &&
|
|
17
|
+
val.replace(/[^0-9]/g, "").substring(0, 8) !==
|
|
18
|
+
state.cardBin.bin) {
|
|
19
|
+
dispatch({
|
|
20
|
+
type: BIN_CHANGE,
|
|
21
|
+
payload: val.replace(/[^0-9]/g, "").substring(0, 8),
|
|
22
|
+
});
|
|
23
|
+
}
|
|
16
24
|
}}/>
|
|
17
|
-
<View style={styles.schemeIconContainer}>
|
|
18
|
-
|
|
19
|
-
|
|
25
|
+
{props.showIcon === undefined || props.showIcon ? (<View style={styles.schemeIconContainer}>
|
|
26
|
+
{state.cardIcon ? (<Image style={styles.scheme} source={state.cardIcon}/>) : undefined}
|
|
27
|
+
</View>) : undefined}
|
|
20
28
|
</View>);
|
|
21
29
|
}}
|
|
22
30
|
</FramesConsumer>);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CardNumber.js","sourceRoot":"","sources":["../../src/components/CardNumber.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,cAAc,CAAC;AAElE,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;
|
|
1
|
+
{"version":3,"file":"CardNumber.js","sourceRoot":"","sources":["../../src/components/CardNumber.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,cAAc,CAAC;AAElE,OAAO,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAC3D,OAAO,EAAE,cAAc,EAAE,MAAM,WAAW,CAAC;AAE3C,OAAO,EAAE,+BAA+B,EAAE,MAAM,oBAAoB,CAAC;AAErE,IAAM,UAAU,GAAmC,UAAC,KAAK;IACvD,OAAO,CACL,CAAC,cAAc,CACb;MAAA,CAAC,UAAC,EAAmB;YAAjB,gBAAK,EAAE,sBAAQ;QACjB,IAAI,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,UAAU,MAAK,SAAS,EAAE;YACnC,MAAM,wFAAwF,CAAC;SAChG;QACD,OAAO,CACL,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAC1B;YAAA,CAAC,SAAS,CACR,gBAAgB,CAAC,WAAW,CAC5B,YAAY,CAAC,YAAY,CACzB,aAAa,CAAC,MAAM,CACpB,WAAW,CAAC,CAAC,+BAA+B,CAAC,CAC7C,IAAI,KAAK,CAAC,CACV,KAAK,CAAC,CAAC,KAAK,CAAC,UAAU,CAAC,CACxB,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,UAAU,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC,CACxC,YAAY,CAAC,CAAC,UAAC,GAAW;YACxB,QAAQ,CAAC,EAAE,IAAI,EAAE,WAAW,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,CAAC;YAC9C,IACE,GAAG,CAAC,OAAO,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC,MAAM,IAAI,CAAC;gBACtC,GAAG,CAAC,OAAO,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,CAAC;oBACxC,KAAK,CAAC,OAAO,CAAC,GAAG,EACnB;gBACA,QAAQ,CAAC;oBACP,IAAI,EAAE,UAAU;oBAChB,OAAO,EAAE,GAAG,CAAC,OAAO,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,CAAC;iBACpD,CAAC,CAAC;aACJ;QACH,CAAC,CAAC,EAEJ;YAAA,CAAC,KAAK,CAAC,QAAQ,KAAK,SAAS,IAAI,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAChD,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,mBAAmB,CAAC,CACtC;gBAAA,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAChB,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,CAAC,KAAK,CAAC,QAAQ,CAAC,EAAG,CACxD,CAAC,CAAC,CAAC,SAAS,CACf;cAAA,EAAE,IAAI,CAAC,CACR,CAAC,CAAC,CAAC,SAAS,CACf;UAAA,EAAE,IAAI,CAAC,CACR,CAAC;IACJ,CAAC,CACH;IAAA,EAAE,cAAc,CAAC,CAClB,CAAC;AACJ,CAAC,CAAC;AAEF,IAAM,MAAM,GAAG,UAAU,CAAC,MAAM,CAAC;IAC/B,OAAO,EAAE;QACP,eAAe,EAAE,WAAW;KAC7B;IACD,UAAU,EAAE;QACV,WAAW,EAAE,OAAO;QACpB,WAAW,EAAE,CAAC;QACd,SAAS,EAAE,EAAE;QACb,WAAW,EAAE,EAAE;KAChB;IACD,mBAAmB,EAAE;QACnB,MAAM,EAAE,MAAM;QACd,KAAK,EAAE,EAAE;QACT,KAAK,EAAE,EAAE;QACT,QAAQ,EAAE,UAAU;QACpB,cAAc,EAAE,QAAQ;QACxB,UAAU,EAAE,QAAQ;KACrB;IACD,MAAM,EAAE;QACN,MAAM,EAAE,KAAK;QACb,KAAK,EAAE,MAAM;QACb,UAAU,EAAE,SAAS;QACrB,UAAU,EAAE,QAAQ;KACrB;CACF,CAAC,CAAC;AAEH,eAAe,UAAU,CAAC"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
-
import {
|
|
3
|
-
declare const SubmitButton: React.FunctionComponent<
|
|
2
|
+
import { SubmitButtonProps } from "../types/types";
|
|
3
|
+
declare const SubmitButton: React.FunctionComponent<SubmitButtonProps>;
|
|
4
4
|
export default SubmitButton;
|
|
@@ -1,5 +1,16 @@
|
|
|
1
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
2
|
+
var t = {};
|
|
3
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
4
|
+
t[p] = s[p];
|
|
5
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
6
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
7
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
8
|
+
t[p[i]] = s[p[i]];
|
|
9
|
+
}
|
|
10
|
+
return t;
|
|
11
|
+
};
|
|
1
12
|
import React from "react";
|
|
2
|
-
import {
|
|
13
|
+
import { TouchableOpacity, Text, StyleSheet } from "react-native";
|
|
3
14
|
import { FramesConsumer } from "../Frames";
|
|
4
15
|
var SubmitButton = function (props) {
|
|
5
16
|
return (<FramesConsumer>
|
|
@@ -8,15 +19,24 @@ var SubmitButton = function (props) {
|
|
|
8
19
|
if (!submitCard) {
|
|
9
20
|
throw "It looks like you are trying to render the SubmitButton outside of the Frames Component.";
|
|
10
21
|
}
|
|
11
|
-
|
|
22
|
+
var textStyle = props.textStyle, title = props.title, touchableProps = __rest(props, ["textStyle", "title"]);
|
|
23
|
+
return (<TouchableOpacity {...touchableProps} style={[styles.buttonContainer, touchableProps.style]} onPress={function (e) {
|
|
12
24
|
submitCard();
|
|
13
25
|
if (props.onPress)
|
|
14
26
|
props.onPress(e);
|
|
15
27
|
}}>
|
|
16
|
-
{
|
|
17
|
-
</
|
|
28
|
+
<Text style={[styles.buttonText, textStyle]}>{title}</Text>
|
|
29
|
+
</TouchableOpacity>);
|
|
18
30
|
}}
|
|
19
31
|
</FramesConsumer>);
|
|
20
32
|
};
|
|
33
|
+
var styles = StyleSheet.create({
|
|
34
|
+
buttonText: {
|
|
35
|
+
textAlign: "center",
|
|
36
|
+
},
|
|
37
|
+
buttonContainer: {
|
|
38
|
+
justifyContent: "center",
|
|
39
|
+
},
|
|
40
|
+
});
|
|
21
41
|
export default SubmitButton;
|
|
22
42
|
//# sourceMappingURL=SubmitButton.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SubmitButton.js","sourceRoot":"","sources":["../../src/components/SubmitButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"SubmitButton.js","sourceRoot":"","sources":["../../src/components/SubmitButton.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,gBAAgB,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAElE,OAAO,EAAE,cAAc,EAAE,MAAM,WAAW,CAAC;AAE3C,IAAM,YAAY,GAA+C,UAAC,KAAK;IACrE,OAAO,CACL,CAAC,cAAc,CACb;MAAA,CAAC,UAAC,EAAc;YAAZ,0BAAU;QACZ,IAAI,CAAC,UAAU,EAAE;YACf,MAAM,0FAA0F,CAAC;SAClG;QAEO,IAAA,2BAAoB,EAAE,mBAAY,EAAE,sDAAiB,CAAW;QAExE,OAAO,CACL,CAAC,gBAAgB,CACf,IAAI,cAAc,CAAC,CACnB,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,eAAe,EAAE,cAAc,CAAC,KAAK,CAAC,CAAC,CACtD,OAAO,CAAC,CAAC,UAAC,CAAC;YACT,UAAU,EAAE,CAAC;YACb,IAAI,KAAK,CAAC,OAAO;gBAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;QACtC,CAAC,CAAC,CAEF;YAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,UAAU,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,EAAE,IAAI,CAC5D;UAAA,EAAE,gBAAgB,CAAC,CACpB,CAAC;IACJ,CAAC,CACH;IAAA,EAAE,cAAc,CAAC,CAClB,CAAC;AACJ,CAAC,CAAC;AAEF,IAAM,MAAM,GAAG,UAAU,CAAC,MAAM,CAAC;IAC/B,UAAU,EAAE;QACV,SAAS,EAAE,QAAQ;KACpB;IACD,eAAe,EAAE;QACf,cAAc,EAAE,QAAQ;KACzB;CACF,CAAC,CAAC;AAEH,eAAe,YAAY,CAAC"}
|
|
Binary file
|
package/dist/types/types.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { ImageSourcePropType, TextInputProps, ViewStyle, StyleProp } from "react-native";
|
|
1
|
+
import { ImageSourcePropType, TextInputProps, ViewStyle, StyleProp, TouchableOpacityProps, TextProps } from "react-native";
|
|
2
2
|
export interface Schemes {
|
|
3
3
|
Visa: string;
|
|
4
4
|
Mastercard: string;
|
|
@@ -7,6 +7,7 @@ export interface Schemes {
|
|
|
7
7
|
JCB: string;
|
|
8
8
|
"Diners Club": string;
|
|
9
9
|
Maestro: string;
|
|
10
|
+
Mada: string;
|
|
10
11
|
}
|
|
11
12
|
export interface CardNumberState {
|
|
12
13
|
value: string;
|
|
@@ -14,6 +15,9 @@ export interface CardNumberState {
|
|
|
14
15
|
valid: boolean;
|
|
15
16
|
}
|
|
16
17
|
export declare type FramesFieldProps = Omit<TextInputProps, "value" | "onChangeText">;
|
|
18
|
+
export interface FramesCardFieldProps extends FramesFieldProps {
|
|
19
|
+
showIcon?: boolean;
|
|
20
|
+
}
|
|
17
21
|
interface Validation {
|
|
18
22
|
cardNumber: boolean;
|
|
19
23
|
expiryDate: boolean;
|
|
@@ -22,6 +26,7 @@ interface Validation {
|
|
|
22
26
|
}
|
|
23
27
|
export interface FramesState {
|
|
24
28
|
cardNumber: string;
|
|
29
|
+
cardBin: CardBinChangedEvent;
|
|
25
30
|
cardIcon: ImageSourcePropType;
|
|
26
31
|
cardType: string;
|
|
27
32
|
expiryDate: string;
|
|
@@ -69,6 +74,7 @@ export interface FramesProps extends ViewStyle {
|
|
|
69
74
|
cardValidationChanged?: (e: FrameCardValidationChangedEvent) => void;
|
|
70
75
|
cardTokenized: (e: FrameCardTokenizedEvent) => void;
|
|
71
76
|
cardTokenizationFailed?: (e: FrameCardTokenizationFailedEvent) => void;
|
|
77
|
+
cardBinChanged?: (e: CardBinChangedEvent) => void;
|
|
72
78
|
}
|
|
73
79
|
export interface FrameCardValidationChangedEvent {
|
|
74
80
|
isValid: boolean;
|
|
@@ -101,7 +107,7 @@ export interface TokenizationBody {
|
|
|
101
107
|
export interface Phone {
|
|
102
108
|
number?: string;
|
|
103
109
|
}
|
|
104
|
-
export declare type Scheme = "Visa" | "Mastercard" | "AMERICAN EXPRESS" | "Diners Club International" | "Maestro" | "Discover";
|
|
110
|
+
export declare type Scheme = "Visa" | "Mastercard" | "AMERICAN EXPRESS" | "Diners Club International" | "Maestro" | "Discover" | "Mada";
|
|
105
111
|
export declare type CardType = "Credit" | "Debit" | "Prepaid" | "Charge";
|
|
106
112
|
export declare type CardCategory = "Consumer" | "Commercial";
|
|
107
113
|
export interface GatewayBillingAddress {
|
|
@@ -139,4 +145,12 @@ export interface FrameCardTokenizationFailedEvent {
|
|
|
139
145
|
error_type: string;
|
|
140
146
|
request_id: string;
|
|
141
147
|
}
|
|
148
|
+
export interface CardBinChangedEvent {
|
|
149
|
+
bin: string;
|
|
150
|
+
scheme: string;
|
|
151
|
+
}
|
|
152
|
+
export interface SubmitButtonProps extends TouchableOpacityProps {
|
|
153
|
+
title: string;
|
|
154
|
+
textStyle?: TextProps;
|
|
155
|
+
}
|
|
142
156
|
export {};
|
package/dist/utils/actions.d.ts
CHANGED
|
@@ -5,4 +5,5 @@ declare const CARD_VALIDATION_CHANGE = "CARD_VALIDATION_CHANGE";
|
|
|
5
5
|
declare const DATE_VALIDATION_CHANGE = "DATE_VALIDATION_CHANGE";
|
|
6
6
|
declare const CVV_VALIDATION_CHANGE = "CVV_VALIDATION_CHANGE";
|
|
7
7
|
declare const SUBMIT_CARD = "SUBMIT_CARD";
|
|
8
|
-
|
|
8
|
+
declare const BIN_CHANGE = "BIN_CHANGE";
|
|
9
|
+
export { CARD_CHANGE, DATE_CHANGE, CVV_CHANGE, CARD_VALIDATION_CHANGE, DATE_VALIDATION_CHANGE, CVV_VALIDATION_CHANGE, SUBMIT_CARD, BIN_CHANGE, };
|
package/dist/utils/actions.js
CHANGED
|
@@ -5,5 +5,6 @@ var CARD_VALIDATION_CHANGE = "CARD_VALIDATION_CHANGE";
|
|
|
5
5
|
var DATE_VALIDATION_CHANGE = "DATE_VALIDATION_CHANGE";
|
|
6
6
|
var CVV_VALIDATION_CHANGE = "CVV_VALIDATION_CHANGE";
|
|
7
7
|
var SUBMIT_CARD = "SUBMIT_CARD";
|
|
8
|
-
|
|
8
|
+
var BIN_CHANGE = "BIN_CHANGE";
|
|
9
|
+
export { CARD_CHANGE, DATE_CHANGE, CVV_CHANGE, CARD_VALIDATION_CHANGE, DATE_VALIDATION_CHANGE, CVV_VALIDATION_CHANGE, SUBMIT_CARD, BIN_CHANGE, };
|
|
9
10
|
//# sourceMappingURL=actions.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"actions.js","sourceRoot":"","sources":["../../src/utils/actions.tsx"],"names":[],"mappings":"AAAA,IAAM,WAAW,GAAG,aAAa,CAAC;AAClC,IAAM,WAAW,GAAG,aAAa,CAAC;AAClC,IAAM,UAAU,GAAG,YAAY,CAAC;AAChC,IAAM,sBAAsB,GAAG,wBAAwB,CAAC;AACxD,IAAM,sBAAsB,GAAG,wBAAwB,CAAC;AACxD,IAAM,qBAAqB,GAAG,uBAAuB,CAAC;AACtD,IAAM,WAAW,GAAG,aAAa,CAAC;
|
|
1
|
+
{"version":3,"file":"actions.js","sourceRoot":"","sources":["../../src/utils/actions.tsx"],"names":[],"mappings":"AAAA,IAAM,WAAW,GAAG,aAAa,CAAC;AAClC,IAAM,WAAW,GAAG,aAAa,CAAC;AAClC,IAAM,UAAU,GAAG,YAAY,CAAC;AAChC,IAAM,sBAAsB,GAAG,wBAAwB,CAAC;AACxD,IAAM,sBAAsB,GAAG,wBAAwB,CAAC;AACxD,IAAM,qBAAqB,GAAG,uBAAuB,CAAC;AACtD,IAAM,WAAW,GAAG,aAAa,CAAC;AAClC,IAAM,UAAU,GAAG,YAAY,CAAC;AAEhC,OAAO,EACL,WAAW,EACX,WAAW,EACX,UAAU,EACV,sBAAsB,EACtB,sBAAsB,EACtB,qBAAqB,EACrB,WAAW,EACX,UAAU,GACX,CAAC"}
|
package/dist/utils/card.d.ts
CHANGED
|
@@ -6,12 +6,13 @@ export declare const Icons: {
|
|
|
6
6
|
JCB: any;
|
|
7
7
|
"Diners Club": any;
|
|
8
8
|
Maestro: any;
|
|
9
|
+
Mada: any;
|
|
9
10
|
};
|
|
10
11
|
export declare const formatCard: (text: string) => string;
|
|
11
|
-
export declare const getCardType: (text: string) => "Visa" | "Mastercard" | "American Express" | "
|
|
12
|
+
export declare const getCardType: (text: string) => "Discover" | "Visa" | "Mastercard" | "American Express" | "JCB" | "Diners Club" | "Maestro" | "Mada";
|
|
12
13
|
export declare const isValidCard: (text: string) => any;
|
|
13
14
|
export declare const cvvLength: (text: string) => 4 | 3;
|
|
14
15
|
export declare const isValidCvv: (text: string, type: string) => any;
|
|
15
16
|
export declare const isValidDate: (text: string) => boolean;
|
|
16
|
-
export declare const getIcon: (cardType: "Visa" | "Mastercard" | "American Express" | "
|
|
17
|
+
export declare const getIcon: (cardType: "Discover" | "Visa" | "Mastercard" | "American Express" | "JCB" | "Diners Club" | "Maestro" | "Mada") => number | import("react-native").ImageURISource | import("react-native").ImageURISource[] | undefined;
|
|
17
18
|
export declare type IconKey = keyof typeof Icons;
|
package/dist/utils/card.js
CHANGED
|
@@ -1,18 +1,20 @@
|
|
|
1
|
+
var __spreadArrays = (this && this.__spreadArrays) || function () {
|
|
2
|
+
for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length;
|
|
3
|
+
for (var r = Array(s), k = 0, i = 0; i < il; i++)
|
|
4
|
+
for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++)
|
|
5
|
+
r[k] = a[j];
|
|
6
|
+
return r;
|
|
7
|
+
};
|
|
1
8
|
var Card = require("creditcards/card");
|
|
2
9
|
var Cvc = require("creditcards/cvc");
|
|
3
10
|
var expiration = require("creditcards/expiration");
|
|
4
11
|
import { EXPIRY_DATE_DELIMITER } from "./constants";
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
require("creditcards-types/types/diners-club"),
|
|
12
|
-
require("creditcards-types/types/maestro"),
|
|
13
|
-
];
|
|
14
|
-
var cards = new Card(acceptedTypes);
|
|
15
|
-
var cvc = new Cvc(acceptedTypes);
|
|
12
|
+
import creditcardsTypes from "creditcards-types";
|
|
13
|
+
import mada from "creditcards-types/types/mada";
|
|
14
|
+
var types = __spreadArrays([mada], creditcardsTypes);
|
|
15
|
+
var cards = new Card(types);
|
|
16
|
+
var cvc = new Cvc(types);
|
|
17
|
+
var extendedCardTypeMapWhitelist = { 6011111111111117: "Discover" };
|
|
16
18
|
export var Icons = {
|
|
17
19
|
Visa: require("../icons/visa.png"),
|
|
18
20
|
Mastercard: require("../icons/mastercard.png"),
|
|
@@ -21,13 +23,15 @@ export var Icons = {
|
|
|
21
23
|
JCB: require("../icons/jcb.png"),
|
|
22
24
|
"Diners Club": require("../icons/dinersclub.png"),
|
|
23
25
|
Maestro: require("../icons/maestro.png"),
|
|
26
|
+
Mada: require("../icons/mada.png"),
|
|
24
27
|
};
|
|
25
28
|
export var formatCard = function (text) {
|
|
26
29
|
return cards.format(cards.parse(text));
|
|
27
30
|
};
|
|
28
31
|
export var getCardType = function (text) {
|
|
29
32
|
var sanitizedValue = cards.parse(text);
|
|
30
|
-
var cardType =
|
|
33
|
+
var cardType = extendedCardTypeMapWhitelist[sanitizedValue] ||
|
|
34
|
+
cards.type(sanitizedValue, true);
|
|
31
35
|
return cardType;
|
|
32
36
|
};
|
|
33
37
|
export var isValidCard = function (text) {
|
package/dist/utils/card.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"card.js","sourceRoot":"","sources":["../../src/utils/card.tsx"],"names":[],"mappings":"AACA,IAAM,IAAI,GAAG,OAAO,CAAC,kBAAkB,CAAC,CAAC;AACzC,IAAM,GAAG,GAAG,OAAO,CAAC,iBAAiB,CAAC,CAAC;AACvC,IAAM,UAAU,GAAG,OAAO,CAAC,wBAAwB,CAAC,CAAC;AACrD,OAAO,EAAE,qBAAqB,EAAE,MAAM,aAAa,CAAC;AACpD,
|
|
1
|
+
{"version":3,"file":"card.js","sourceRoot":"","sources":["../../src/utils/card.tsx"],"names":[],"mappings":"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"}
|
package/dist/utils/logger.js
CHANGED
|
@@ -47,7 +47,6 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
|
|
|
47
47
|
};
|
|
48
48
|
import { Platform } from "react-native";
|
|
49
49
|
import { LIVE_LOGGER, SANDBOX_LOGGER, MBC_LIVE_SECRET_KEY_REGEX, NAS_LIVE_SECRET_KEY_REGEX, } from "./constants";
|
|
50
|
-
import { v4 as uuidv4 } from "uuid";
|
|
51
50
|
export var log = function (loglevel, type, config, extra) { return __awaiter(void 0, void 0, void 0, function () {
|
|
52
51
|
var pjson, date, error_1;
|
|
53
52
|
return __generator(this, function (_a) {
|
|
@@ -64,7 +63,7 @@ export var log = function (loglevel, type, config, extra) { return __awaiter(voi
|
|
|
64
63
|
},
|
|
65
64
|
body: JSON.stringify({
|
|
66
65
|
specversion: "1.0",
|
|
67
|
-
id:
|
|
66
|
+
id: generateUUID(),
|
|
68
67
|
type: type,
|
|
69
68
|
source: "frames-react-native-sdk",
|
|
70
69
|
time: date.toISOString(),
|
|
@@ -74,7 +73,6 @@ export var log = function (loglevel, type, config, extra) { return __awaiter(voi
|
|
|
74
73
|
: "sandbox" }),
|
|
75
74
|
cko: {
|
|
76
75
|
ddTags: "source:frames-react-native-sdk",
|
|
77
|
-
correlationId: uuidv4(),
|
|
78
76
|
loglevel: loglevel,
|
|
79
77
|
},
|
|
80
78
|
}),
|
|
@@ -89,6 +87,24 @@ export var log = function (loglevel, type, config, extra) { return __awaiter(voi
|
|
|
89
87
|
}
|
|
90
88
|
});
|
|
91
89
|
}); };
|
|
90
|
+
var generateUUID = function () {
|
|
91
|
+
var d = new Date().getTime(); //Timestamp
|
|
92
|
+
var d2 = 0;
|
|
93
|
+
return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, function (c) {
|
|
94
|
+
var r = Math.random() * 16; //random number between 0 and 16
|
|
95
|
+
if (d > 0) {
|
|
96
|
+
//Use timestamp until depleted
|
|
97
|
+
r = (d + r) % 16 | 0;
|
|
98
|
+
d = Math.floor(d / 16);
|
|
99
|
+
}
|
|
100
|
+
else {
|
|
101
|
+
//Use microseconds since page-load if supported
|
|
102
|
+
r = (d2 + r) % 16 | 0;
|
|
103
|
+
d2 = Math.floor(d2 / 16);
|
|
104
|
+
}
|
|
105
|
+
return (c === "x" ? r : (r & 0x3) | 0x8).toString(16);
|
|
106
|
+
});
|
|
107
|
+
};
|
|
92
108
|
export var getEnvironment = function (key) {
|
|
93
109
|
return MBC_LIVE_SECRET_KEY_REGEX.test(key) || NAS_LIVE_SECRET_KEY_REGEX.test(key)
|
|
94
110
|
? LIVE_LOGGER
|
package/dist/utils/logger.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"logger.js","sourceRoot":"","sources":["../../src/utils/logger.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAExC,OAAO,EACL,WAAW,EACX,cAAc,EACd,yBAAyB,EACzB,yBAAyB,GAC1B,MAAM,aAAa,CAAC;
|
|
1
|
+
{"version":3,"file":"logger.js","sourceRoot":"","sources":["../../src/utils/logger.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAExC,OAAO,EACL,WAAW,EACX,cAAc,EACd,yBAAyB,EACzB,yBAAyB,GAC1B,MAAM,aAAa,CAAC;AAGrB,MAAM,CAAC,IAAM,GAAG,GAAG,UACjB,QAAgB,EAChB,IAAY,EACZ,MAAoB,EACpB,KAAc;;;;;;gBAGN,KAAK,GAAG,OAAO,CAAC,oBAAoB,CAAC,CAAC;gBACtC,IAAI,GAAG,IAAI,IAAI,EAAE,CAAC;gBACxB,qBAAM,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,SAAS,CAAC,EAAE;wBAC5C,MAAM,EAAE,MAAM;wBACd,OAAO,EAAE;4BACP,MAAM,EAAE,kBAAkB;4BAC1B,cAAc,EAAE,8BAA8B;yBAC/C;wBACD,IAAI,EAAE,IAAI,CAAC,SAAS,CAAC;4BACnB,WAAW,EAAE,KAAK;4BAClB,EAAE,EAAE,YAAY,EAAE;4BAClB,IAAI,MAAA;4BACJ,MAAM,EAAE,yBAAyB;4BACjC,IAAI,EAAE,IAAI,CAAC,WAAW,EAAE;4BACxB,IAAI,wBACC,KAAK,KACR,EAAE,EAAE,QAAQ,CAAC,EAAE,EACf,SAAS,EAAE,QAAQ,CAAC,OAAO,EAC3B,UAAU,EAAE,KAAK,CAAC,OAAO,EACzB,WAAW,EACT,yBAAyB,CAAC,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC;oCAChD,yBAAyB,CAAC,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC;oCAC9C,CAAC,CAAC,YAAY;oCACd,CAAC,CAAC,SAAS,GAChB;4BACD,GAAG,EAAE;gCACH,MAAM,EAAE,gCAAgC;gCACxC,QAAQ,UAAA;6BACT;yBACF,CAAC;qBACH,CAAC,EAAA;;gBA5BF,SA4BE,CAAC;;;;gBAEH,MAAM,OAAK,CAAC;;;;KAEf,CAAC;AAEF,IAAM,YAAY,GAAG;IACnB,IAAI,CAAC,GAAG,IAAI,IAAI,EAAE,CAAC,OAAO,EAAE,CAAC,CAAC,WAAW;IACzC,IAAI,EAAE,GAAG,CAAC,CAAC;IACX,OAAO,sCAAsC,CAAC,OAAO,CAAC,OAAO,EAAE,UAAU,CAAC;QACxE,IAAI,CAAC,GAAG,IAAI,CAAC,MAAM,EAAE,GAAG,EAAE,CAAC,CAAC,gCAAgC;QAC5D,IAAI,CAAC,GAAG,CAAC,EAAE;YACT,8BAA8B;YAC9B,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC;YACrB,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,EAAE,CAAC,CAAC;SACxB;aAAM;YACL,+CAA+C;YAC/C,CAAC,GAAG,CAAC,EAAE,GAAG,CAAC,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC;YACtB,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC,EAAE,GAAG,EAAE,CAAC,CAAC;SAC1B;QACD,OAAO,CAAC,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC,GAAG,GAAG,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;IACxD,CAAC,CAAC,CAAC;AACL,CAAC,CAAC;AAEF,MAAM,CAAC,IAAM,cAAc,GAAG,UAAC,GAAW;IACxC,OAAA,yBAAyB,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,yBAAyB,CAAC,IAAI,CAAC,GAAG,CAAC;QACxE,CAAC,CAAC,WAAW;QACb,CAAC,CAAC,cAAc;AAFlB,CAEkB,CAAC"}
|
package/dist/utils/reducer.d.ts
CHANGED
|
@@ -2,7 +2,7 @@ import { FramesState } from "../types/types";
|
|
|
2
2
|
export declare const framesReducer: (prevState: FramesState, dispatchArg?: any) => {
|
|
3
3
|
cardNumber: string;
|
|
4
4
|
cardIcon: number | import("react-native").ImageURISource | import("react-native").ImageURISource[] | undefined;
|
|
5
|
-
cardType: "Visa" | "Mastercard" | "American Express" | "
|
|
5
|
+
cardType: "Discover" | "Visa" | "Mastercard" | "American Express" | "JCB" | "Diners Club" | "Maestro" | "Mada";
|
|
6
6
|
validation: {
|
|
7
7
|
cardNumber: any;
|
|
8
8
|
card: boolean;
|
|
@@ -10,6 +10,7 @@ export declare const framesReducer: (prevState: FramesState, dispatchArg?: any)
|
|
|
10
10
|
cvv: boolean;
|
|
11
11
|
};
|
|
12
12
|
cvvLength: number;
|
|
13
|
+
cardBin: import("../types/types").CardBinChangedEvent;
|
|
13
14
|
expiryDate: string;
|
|
14
15
|
cvv: string;
|
|
15
16
|
} | {
|
|
@@ -21,6 +22,7 @@ export declare const framesReducer: (prevState: FramesState, dispatchArg?: any)
|
|
|
21
22
|
expiryDate: boolean;
|
|
22
23
|
};
|
|
23
24
|
cardNumber: string;
|
|
25
|
+
cardBin: import("../types/types").CardBinChangedEvent;
|
|
24
26
|
cardIcon: import("react-native").ImageSourcePropType;
|
|
25
27
|
cardType: string;
|
|
26
28
|
expiryDate: string;
|
package/dist/utils/reducer.js
CHANGED
|
@@ -11,7 +11,7 @@ var __assign = (this && this.__assign) || function () {
|
|
|
11
11
|
};
|
|
12
12
|
import { formatCard, getCardType, getIcon, isValidCard, cvvLength, isValidCvv, isValidDate, } from "./card";
|
|
13
13
|
import { getFormattedDate } from "./date";
|
|
14
|
-
import { CARD_CHANGE, DATE_CHANGE, CVV_CHANGE } from "./actions";
|
|
14
|
+
import { CARD_CHANGE, DATE_CHANGE, CVV_CHANGE, BIN_CHANGE } from "./actions";
|
|
15
15
|
export var framesReducer = function (prevState, dispatchArg) {
|
|
16
16
|
switch (dispatchArg.type) {
|
|
17
17
|
case CARD_CHANGE:
|
|
@@ -26,6 +26,8 @@ export var framesReducer = function (prevState, dispatchArg) {
|
|
|
26
26
|
return __assign(__assign({}, prevState), { cvv: dispatchArg.payload, validation: __assign(__assign({}, prevState.validation), { cvv: isValidCvv(dispatchArg.payload, prevState.cardNumber), card: isValidCvv(dispatchArg.payload, prevState.cardNumber) &&
|
|
27
27
|
prevState.validation.cardNumber &&
|
|
28
28
|
prevState.validation.expiryDate }) });
|
|
29
|
+
case BIN_CHANGE:
|
|
30
|
+
return __assign(__assign({}, prevState), { cardBin: __assign(__assign({}, prevState.cardBin), { bin: dispatchArg.payload + "", scheme: getCardType(dispatchArg.payload) }) });
|
|
29
31
|
default:
|
|
30
32
|
return prevState;
|
|
31
33
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"reducer.js","sourceRoot":"","sources":["../../src/utils/reducer.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EACL,UAAU,EACV,WAAW,EACX,OAAO,EACP,WAAW,EACX,SAAS,EACT,UAAU,EACV,WAAW,GACZ,MAAM,QAAQ,CAAC;AAChB,OAAO,EAAE,gBAAgB,EAAE,MAAM,QAAQ,CAAC;AAE1C,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,WAAW,CAAC;
|
|
1
|
+
{"version":3,"file":"reducer.js","sourceRoot":"","sources":["../../src/utils/reducer.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EACL,UAAU,EACV,WAAW,EACX,OAAO,EACP,WAAW,EACX,SAAS,EACT,UAAU,EACV,WAAW,GACZ,MAAM,QAAQ,CAAC;AAChB,OAAO,EAAE,gBAAgB,EAAE,MAAM,QAAQ,CAAC;AAE1C,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,WAAW,CAAC;AAE7E,MAAM,CAAC,IAAM,aAAa,GAAG,UAAC,SAAsB,EAAE,WAAiB;IACrE,QAAQ,WAAW,CAAC,IAAI,EAAE;QACxB,KAAK,WAAW;YACd,6BACK,SAAS,KACZ,UAAU,EAAE,UAAU,CAAC,WAAW,CAAC,OAAO,CAAC,EAC3C,QAAQ,EAAE,OAAO,CAAC,WAAW,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC,EACnD,QAAQ,EAAE,WAAW,CAAC,WAAW,CAAC,OAAO,CAAC,EAC1C,UAAU,wBACL,SAAS,CAAC,UAAU,KACvB,UAAU,EAAE,WAAW,CAAC,UAAU,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC,EACxD,IAAI,EACF,WAAW,CAAC,UAAU,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC;wBAC5C,SAAS,CAAC,UAAU,CAAC,UAAU;wBAC/B,SAAS,CAAC,UAAU,CAAC,GAAG,KAE5B,SAAS,EAAE,SAAS,CAAC,WAAW,CAAC,OAAO,CAAC,IACzC;QAEJ,KAAK,WAAW;YACd,6BACK,SAAS,KACZ,UAAU,EAAE,gBAAgB,CAAC,WAAW,CAAC,OAAO,CAAC,EACjD,UAAU,wBACL,SAAS,CAAC,UAAU,KACvB,UAAU,EAAE,WAAW,CAAC,gBAAgB,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC,EAC9D,IAAI,EACF,WAAW,CAAC,gBAAgB,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC;wBAClD,SAAS,CAAC,UAAU,CAAC,UAAU;wBAC/B,SAAS,CAAC,UAAU,CAAC,GAAG,OAE5B;QACJ,KAAK,UAAU;YACb,6BACK,SAAS,KACZ,GAAG,EAAE,WAAW,CAAC,OAAO,EACxB,UAAU,wBACL,SAAS,CAAC,UAAU,KACvB,GAAG,EAAE,UAAU,CAAC,WAAW,CAAC,OAAO,EAAE,SAAS,CAAC,UAAU,CAAC,EAC1D,IAAI,EACF,UAAU,CAAC,WAAW,CAAC,OAAO,EAAE,SAAS,CAAC,UAAU,CAAC;wBACrD,SAAS,CAAC,UAAU,CAAC,UAAU;wBAC/B,SAAS,CAAC,UAAU,CAAC,UAAU,OAEnC;QACJ,KAAK,UAAU;YACb,6BACK,SAAS,KACZ,OAAO,wBACF,SAAS,CAAC,OAAO,KACpB,GAAG,EAAE,WAAW,CAAC,OAAO,GAAG,EAAE,EAC7B,MAAM,EAAE,WAAW,CAAC,WAAW,CAAC,OAAO,CAAC,OAE1C;QACJ;YACE,OAAO,SAAS,CAAC;KACpB;AACH,CAAC,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "frames-react-native",
|
|
3
|
-
"version": "1.
|
|
4
|
-
"description": "
|
|
3
|
+
"version": "1.1.3",
|
|
4
|
+
"description": "Frames React Native",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"scripts": {
|
|
7
7
|
"test": "jest --coverage",
|
|
@@ -9,11 +9,9 @@
|
|
|
9
9
|
"build": "tsc"
|
|
10
10
|
},
|
|
11
11
|
"dependencies": {
|
|
12
|
-
"creditcards": "^
|
|
13
|
-
"creditcards-types": "^
|
|
14
|
-
"node-fetch": "^2.6.1"
|
|
15
|
-
"react-native-get-random-values": "^1.7.0",
|
|
16
|
-
"uuid": "^8.3.2"
|
|
12
|
+
"creditcards": "^4.2.0",
|
|
13
|
+
"creditcards-types": "^3.2.0",
|
|
14
|
+
"node-fetch": "^2.6.1"
|
|
17
15
|
},
|
|
18
16
|
"keywords": [],
|
|
19
17
|
"author": "",
|