@propellerads/kyc-form 5.0.3 → 5.0.5

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/dist/index.js CHANGED
@@ -1,14 +1,13 @@
1
1
  import e, { ButtonVariant as t } from "@propellerads/button";
2
2
  import { useEffect as n, useState as r } from "react";
3
- import { Close as i, Color as a, Delete as o, Insert as s, Pdf as c, Size as l } from "@propellerads/icon";
4
- import u, { Direction as d } from "@propellerads/image-uploader";
5
- import f from "@propellerads/textarea";
6
- import p from "styled-components";
7
- import { black as m, borderRadius as h, errorColor as g, fontNormal as _, fontSmall as v, gray50 as y, gray95 as b, spacing as x, white as S } from "@propellerads/stylevariables";
8
- import { jsx as C, jsxs as w } from "react/jsx-runtime";
9
- import T from "@propellerads/success-label";
3
+ import { Check as i, Close as a, Color as o, Delete as s, Insert as c, Pdf as l, Size as u } from "@propellerads/icon";
4
+ import d, { Direction as f } from "@propellerads/image-uploader";
5
+ import { Textarea as p } from "@propellerads/input";
6
+ import m from "styled-components";
7
+ import { black as h, borderRadius as g, errorColor as _, fontNormal as v, fontSmall as y, gray50 as b, gray95 as x, lineHeight as S, mediumDevices as C, spacing as w, successColor as ee, white as T } from "@propellerads/stylevariables";
8
+ import { jsx as E, jsxs as D } from "react/jsx-runtime";
10
9
  //#region src/document.types.ts
11
- var E = {
10
+ var O = {
12
11
  Id: "id",
13
12
  Ub: "ub",
14
13
  IdExtra: "id_extra",
@@ -22,7 +21,7 @@ var E = {
22
21
  TransactionConfirmation: "transaction_confirmation",
23
22
  Other: "other",
24
23
  Feedback: "feedback"
25
- }, D = {
24
+ }, k = {
26
25
  IdFront: "id_front",
27
26
  IdBack: "id_back",
28
27
  Ub: "ub_item",
@@ -36,118 +35,118 @@ var E = {
36
35
  TransactionConfirmationImage: "transaction_confirmation_image",
37
36
  OtherImage: "other_image",
38
37
  Feedback: "feedback"
39
- }, O = 5242880, ee = 3, k = "application/pdf", A = "image/heic", j = {
38
+ }, A = 5242880, te = 3, j = "application/pdf", M = "image/heic", N = {
40
39
  "image/png": [".png"],
41
40
  "image/jpeg": [
42
41
  ".jpg",
43
42
  ".jpe",
44
43
  ".jpeg"
45
44
  ],
46
- [k]: [".pdf"],
47
- [A]: [".heic"]
48
- }, M = [
49
- E.Card,
50
- E.Card,
51
- E.PaypalDetailsPage,
52
- E.BankWireDetails,
53
- E.TransactionConfirmation,
54
- E.SelfieWithIdCard,
55
- E.PaymentSystemScreen,
56
- E.Other
57
- ], te = {
58
- [E.Id]: { parts: [D.IdBack] },
59
- [E.IdExtra]: { parts: [D.IdBack] }
60
- }, N = p.div`
45
+ [j]: [".pdf"],
46
+ [M]: [".heic"]
47
+ }, P = [
48
+ O.Card,
49
+ O.Card,
50
+ O.PaypalDetailsPage,
51
+ O.BankWireDetails,
52
+ O.TransactionConfirmation,
53
+ O.SelfieWithIdCard,
54
+ O.PaymentSystemScreen,
55
+ O.Other
56
+ ], ne = {
57
+ [O.Id]: { parts: [k.IdBack] },
58
+ [O.IdExtra]: { parts: [k.IdBack] }
59
+ }, re = m.div`
61
60
  display: flex;
62
61
  align-items: center;
63
- color: ${g};
64
- margin-top: ${x * 2}px;
65
- margin-bottom: ${x * 4}px;
66
- `, P = p.span`
62
+ color: ${_};
63
+ margin-top: ${w * 2}px;
64
+ margin-bottom: ${w * 4}px;
65
+ `, F = m.span`
67
66
  display: flex;
68
67
  align-items: center;
69
68
  justify-content: center;
70
69
  width: 14px;
71
70
  height: 14px;
72
71
  border-radius: 100%;
73
- background-color: ${g};
72
+ background-color: ${_};
74
73
 
75
74
  &:before {
76
- font-size: ${v};
77
- color: ${S};
75
+ font-size: ${y};
76
+ color: ${T};
78
77
  content: '!';
79
78
  }
80
- `, F = p.span`
81
- margin-left: ${x * 2}px;
82
- `, I = (e) => /* @__PURE__ */ w(N, { children: [e.isDocumentPartError ? /* @__PURE__ */ C(P, {}) : /* @__PURE__ */ C(i, {
83
- color: a.Error,
84
- hoverColor: a.Error,
85
- size: l.Small
86
- }), /* @__PURE__ */ C(F, { children: e.label })] }), L = (e) => M.includes(e), ne = (e, t) => L(e) && t.every((e) => !!e.data) && t.length < 3 && t.length > 0, R = (e) => e?.match(/[^:]\w+\/[\w-+\d.]+(?=;|,)/)?.[0], z = (e) => R(e) === k, re = (e) => R(e) === A, B = (e, t) => t.every((t) => t.data !== e?.data), ie = async (e) => {
79
+ `, I = m.span`
80
+ margin-left: ${w * 2}px;
81
+ `, L = (e) => /* @__PURE__ */ D(re, { children: [e.isDocumentPartError ? /* @__PURE__ */ E(F, {}) : /* @__PURE__ */ E(a, {
82
+ color: o.Error,
83
+ hoverColor: o.Error,
84
+ size: u.Small
85
+ }), /* @__PURE__ */ E(I, { children: e.label })] }), R = (e) => P.includes(e), ie = (e, t) => R(e) && t.every((e) => !!e.data) && t.length < 3 && t.length > 0, z = (e) => e?.match(/[^:]\w+\/[\w-+\d.]+(?=;|,)/)?.[0], ae = (e) => z(e) === j, oe = (e) => z(e) === M, B = (e, t) => t.every((t) => t.data !== e?.data), V = async (e) => {
87
86
  let t = new FileReader();
88
87
  return new Promise((n, r) => {
89
88
  t.onload = () => n(t.result), t.onerror = (e) => r(e), t.readAsDataURL(e);
90
89
  });
91
- }, V = p.div`
92
- margin-top: ${x * 4}px;
93
- margin-left: ${x * 4}px;
94
- `, H = p.div`
95
- margin-bottom: ${x}px;
96
- `, U = p.div`
90
+ }, H = m.div`
91
+ margin-top: ${w * 4}px;
92
+ margin-left: ${w * 4}px;
93
+ `, U = m.div`
94
+ margin-bottom: ${w}px;
95
+ `, W = m.div`
97
96
  display: flex;
98
97
  align-items: center;
99
- background-color: ${b};
100
- padding: ${x * 2}px;
101
- border-radius: ${h}px;
102
- `, W = p.span`
98
+ background-color: ${x};
99
+ padding: ${w * 2}px;
100
+ border-radius: ${g}px;
101
+ `, G = m.span`
103
102
  width: 100%;
104
- margin-left: ${x * 4}px;
105
- margin-right: ${x * 2}px;
106
- `, G = p.span`
103
+ margin-left: ${w * 4}px;
104
+ margin-right: ${w * 2}px;
105
+ `, K = m.span`
107
106
  cursor: pointer !important;
108
- margin-right: ${x * 2}px;
109
- `, K = p.div`
107
+ margin-right: ${w * 2}px;
108
+ `, q = m.div`
110
109
  height: 66px;
111
- `, q = p.div`
110
+ `, se = m.div`
112
111
  display: flex;
113
112
  flex-direction: column;
114
- margin-top: ${x * 4}px;
115
- margin-left: ${x * 4}px;
116
- `, J = p.img`
113
+ margin-top: ${w * 4}px;
114
+ margin-left: ${w * 4}px;
115
+ `, ce = m.img`
117
116
  width: auto;
118
117
  max-width: 204px;
119
118
  height: 50px;
120
119
  object-fit: contain;
121
- border-radius: ${h}px;
122
- `, ae = p.div`
120
+ border-radius: ${g}px;
121
+ `, le = m.div`
123
122
  display: flex;
124
123
  align-items: center;
125
124
  justify-content: center;
126
125
  min-width: 50px;
127
126
  height: 50px;
128
- border-radius: ${h}px;
129
- background-color: ${S};
130
- `, oe = (e) => {
131
- let { data: t } = e, n = z(t), r = re(t);
132
- return n || r ? /* @__PURE__ */ w(ae, { children: [n && /* @__PURE__ */ C(c, {
133
- color: a.Gray,
134
- hoverColor: a.Gray
135
- }), r && /* @__PURE__ */ C(s, {
136
- color: a.Gray,
137
- hoverColor: a.Gray
138
- })] }) : /* @__PURE__ */ C(J, { src: t });
139
- }, Y = {
127
+ border-radius: ${g}px;
128
+ background-color: ${T};
129
+ `, ue = (e) => {
130
+ let { data: t } = e, n = ae(t), r = oe(t);
131
+ return n || r ? /* @__PURE__ */ D(le, { children: [n && /* @__PURE__ */ E(l, {
132
+ color: o.Gray,
133
+ hoverColor: o.Gray
134
+ }), r && /* @__PURE__ */ E(c, {
135
+ color: o.Gray,
136
+ hoverColor: o.Gray
137
+ })] }) : /* @__PURE__ */ E(ce, { src: t });
138
+ }, J = {
140
139
  KYCFormItemFileExtraPart: (e) => {
141
140
  let { elementId: t, title: n, uploaderLabels: r, onFileAdd: i } = e;
142
- return /* @__PURE__ */ w(q, {
141
+ return /* @__PURE__ */ D(se, {
143
142
  id: t,
144
- children: [n && /* @__PURE__ */ C(H, { children: n }), /* @__PURE__ */ C(K, { children: /* @__PURE__ */ C(u, {
143
+ children: [n && /* @__PURE__ */ E(U, { children: n }), /* @__PURE__ */ E(q, { children: /* @__PURE__ */ E(d, {
145
144
  title: r.title,
146
145
  action: r.action,
147
- maxSize: O,
148
- acceptFormats: j,
146
+ maxSize: A,
147
+ acceptFormats: N,
149
148
  elementId: `${t}_uploader`,
150
- direction: d.Row,
149
+ direction: f.Row,
151
150
  onDrop: (e) => {
152
151
  let [t] = e;
153
152
  t && i(t);
@@ -156,34 +155,34 @@ var E = {
156
155
  });
157
156
  },
158
157
  KYCFormItemFile: (e) => {
159
- let { name: t, title: n, data: r, error: i, elementId: s, uploaderLabels: c, onFileChange: l, onFileRemove: f } = e;
160
- return /* @__PURE__ */ w(V, {
161
- id: s,
158
+ let { name: t, title: n, data: r, error: i, elementId: a, uploaderLabels: c, onFileChange: l, onFileRemove: u } = e;
159
+ return /* @__PURE__ */ D(H, {
160
+ id: a,
162
161
  children: [
163
- n && /* @__PURE__ */ C(H, { children: n }),
164
- r ? /* @__PURE__ */ w(U, { children: [
165
- /* @__PURE__ */ C(oe, { data: r }),
166
- /* @__PURE__ */ C(W, { children: t }),
167
- /* @__PURE__ */ C(G, {
168
- onClick: f,
169
- children: /* @__PURE__ */ C(o, {
170
- color: a.Blue,
171
- hoverColor: a.Blue
162
+ n && /* @__PURE__ */ E(U, { children: n }),
163
+ r ? /* @__PURE__ */ D(W, { children: [
164
+ /* @__PURE__ */ E(ue, { data: r }),
165
+ /* @__PURE__ */ E(G, { children: t }),
166
+ /* @__PURE__ */ E(K, {
167
+ onClick: u,
168
+ children: /* @__PURE__ */ E(s, {
169
+ color: o.Blue,
170
+ hoverColor: o.Blue
172
171
  })
173
172
  })
174
- ] }) : /* @__PURE__ */ C(K, { children: /* @__PURE__ */ C(u, {
173
+ ] }) : /* @__PURE__ */ E(q, { children: /* @__PURE__ */ E(d, {
175
174
  title: c.title,
176
175
  action: c.action,
177
- maxSize: O,
178
- acceptFormats: j,
179
- elementId: `${s}_uploader`,
180
- direction: d.Row,
176
+ maxSize: A,
177
+ acceptFormats: N,
178
+ elementId: `${a}_uploader`,
179
+ direction: f.Row,
181
180
  onDrop: (e) => {
182
181
  let [t] = e;
183
182
  t && l(t);
184
183
  }
185
184
  }) }),
186
- i && /* @__PURE__ */ C(I, {
185
+ i && /* @__PURE__ */ E(L, {
187
186
  label: i,
188
187
  isDocumentPartError: !0
189
188
  })
@@ -191,34 +190,35 @@ var E = {
191
190
  });
192
191
  },
193
192
  KYCFormItemText: (e) => {
194
- let { onFeedbackChange: t, value: n = "" } = e, r = (e) => t(e);
195
- return /* @__PURE__ */ C(V, { children: /* @__PURE__ */ C(f, {
196
- onChange: r,
197
- onBlur: r,
193
+ let { onFeedbackChange: t, value: n = "" } = e;
194
+ return /* @__PURE__ */ E(H, { children: /* @__PURE__ */ E(p, {
195
+ onChange: (e) => t(e.target.value),
196
+ onBlur: (e) => t(e.target.value),
198
197
  value: n,
199
- errors: [],
198
+ rows: 5,
200
199
  name: "kyc-client-comments",
201
- elementId: "kyc-feedback-textarea"
200
+ id: "kyc-feedback-textarea",
201
+ "aria-label": "Comments"
202
202
  }) });
203
203
  }
204
- }, se = p.div`
205
- margin-top: ${x * 6}px;
206
- `, ce = p.div`
207
- font-size: ${_}px;
208
- font-weight: bold;
209
- color: ${m};
210
- margin-bottom: ${x}px;
211
- `, le = p.div`
204
+ }, de = m.div`
205
+ margin-top: ${w * 6}px;
206
+ `, fe = m.div`
212
207
  font-size: ${v}px;
213
- color: ${y};
214
- margin-left: ${x * 4}px;
215
- `, X = (e, t) => `[${e}].parts[${t}].data`, ue = (e) => {
216
- let { type: t, index: n, uploaderLabels: i, documentLabels: a, elementId: o, parts: s, errors: c, onDocumentChange: l } = e, [u, d] = r(/* @__PURE__ */ new Map()), f = ne(t, s), p = a?.parts, m = s[0], h = m ? p?.[m.type]?.title : void 0, [g, _] = r(/* @__PURE__ */ new Map()), v = (e) => {
208
+ font-weight: bold;
209
+ color: ${h};
210
+ margin-bottom: ${w}px;
211
+ `, pe = m.div`
212
+ font-size: ${y}px;
213
+ color: ${b};
214
+ margin-left: ${w * 4}px;
215
+ `, Y = (e, t) => `[${e}].parts[${t}].data`, me = (e) => {
216
+ let { type: t, index: n, uploaderLabels: i, documentLabels: a, elementId: o, parts: s, errors: c, onDocumentChange: l } = e, [u, d] = r(/* @__PURE__ */ new Map()), f = ie(t, s), p = a?.parts, m = s[0], h = m ? p?.[m.type]?.title : void 0, [g, _] = r(/* @__PURE__ */ new Map()), v = (e) => {
217
217
  let t = new Map(u);
218
- t.set(X(n, e), i.oversizeError), d(t);
218
+ t.set(Y(n, e), i.oversizeError), d(t);
219
219
  }, y = (e) => {
220
220
  let t = new Map(u);
221
- t.delete(X(n, e)), d(t);
221
+ t.delete(Y(n, e)), d(t);
222
222
  }, b = (e, n, r) => {
223
223
  let i = {
224
224
  ...e,
@@ -235,7 +235,7 @@ var E = {
235
235
  }
236
236
  let n = s[e] ?? s[0];
237
237
  if (!n) return;
238
- let r = await ie(t);
238
+ let r = await V(t);
239
239
  b(n, e, r);
240
240
  let i = new Map(g);
241
241
  i.set(r, t.name), _(i), y(e);
@@ -245,29 +245,29 @@ var E = {
245
245
  b(t, e);
246
246
  let n = s[e], r = new Map(g);
247
247
  n?.data && B(n, s) && r.delete(n?.data), _(r), y(e);
248
- }, T = (e) => {
248
+ }, C = (e) => {
249
249
  if (e) return g.get(e);
250
- }, E = (e, t) => {
250
+ }, w = (e, t) => {
251
251
  let n = s[e] ?? s[0];
252
252
  n && b(n, e, t);
253
253
  };
254
- return /* @__PURE__ */ w(se, {
254
+ return /* @__PURE__ */ D(de, {
255
255
  id: o,
256
256
  children: [
257
- /* @__PURE__ */ C(ce, { children: `${n + 1}. ${a?.title}` }),
258
- a?.description && /* @__PURE__ */ C(le, { children: a?.description }),
257
+ /* @__PURE__ */ E(fe, { children: `${n + 1}. ${a?.title}` }),
258
+ a?.description && /* @__PURE__ */ E(pe, { children: a?.description }),
259
259
  s.map((e, r) => {
260
- let a = `kyc-form_item_file_${e.type}`, l = L(t), d = p?.[e.type], f = l ? void 0 : d?.title;
261
- L(t) && e.data && (a = `${a}_${e.data?.substr(-32)}`, B(e, s) || (a = `${a}_${r}`));
262
- let m = c?.[X(n, r)], h = u.get(X(n, r));
263
- return e.type === D.Feedback ? /* @__PURE__ */ C(Y.KYCFormItemText, {
260
+ let a = `kyc-form_item_file_${e.type}`, l = R(t), d = p?.[e.type], f = l ? void 0 : d?.title;
261
+ R(t) && e.data && (a = `${a}_${e.data?.substr(-32)}`, B(e, s) || (a = `${a}_${r}`));
262
+ let m = c?.[Y(n, r)], h = u.get(Y(n, r));
263
+ return e.type === k.Feedback ? /* @__PURE__ */ E(J.KYCFormItemText, {
264
264
  value: e.data,
265
- onFeedbackChange: (e) => E(r, e)
266
- }, a) : /* @__PURE__ */ C(Y.KYCFormItemFile, {
265
+ onFeedbackChange: (e) => w(r, e)
266
+ }, a) : /* @__PURE__ */ E(J.KYCFormItemFile, {
267
267
  title: f,
268
268
  data: e.data,
269
269
  type: e.type,
270
- name: T(e.data),
270
+ name: C(e.data),
271
271
  uploaderLabels: i,
272
272
  error: h || m,
273
273
  elementId: `${o}_part_${e.type}_${r}`,
@@ -275,7 +275,7 @@ var E = {
275
275
  onFileRemove: () => S(r)
276
276
  }, a);
277
277
  }),
278
- f && m && /* @__PURE__ */ C(Y.KYCFormItemFileExtraPart, {
278
+ f && m && /* @__PURE__ */ E(J.KYCFormItemFileExtraPart, {
279
279
  elementId: `${o}_extra`,
280
280
  title: h,
281
281
  uploaderLabels: i,
@@ -283,55 +283,69 @@ var E = {
283
283
  })
284
284
  ]
285
285
  });
286
- }, de = p.div`
286
+ }, he = m.div`
287
287
  display: flex;
288
288
  flex-direction: column;
289
- `, Z = p.span`
290
- margin-bottom: ${x * 8}px;
291
- `, fe = p.span`
292
- color: ${y};
293
- `, pe = p.div`
289
+ `, X = m.span`
290
+ margin-bottom: ${w * 8}px;
291
+ `, ge = m.span`
292
+ color: ${b};
293
+ `, _e = m.span`
294
+ display: inline-flex;
295
+ align-items: center;
296
+ gap: ${w}px;
297
+ min-height: ${S}px;
298
+ color: ${ee};
299
+
300
+ @media (min-width: ${C}px) {
301
+ max-width: 350px;
302
+ white-space: nowrap;
303
+ }
304
+ `, ve = m.div`
294
305
  display: flex;
295
306
  flex-direction: column;
296
- `, me = p.span`
297
- margin-bottom: ${x * 6}px;
307
+ `, Z = m.span`
308
+ margin-bottom: ${w * 6}px;
298
309
  `, Q = {
299
310
  KYCSuccessScreen: (e) => {
300
- let { elementId: t, title: n, description: r, support: i } = e;
301
- return /* @__PURE__ */ w(de, {
311
+ let { elementId: t, title: n, description: r, support: a } = e;
312
+ return /* @__PURE__ */ D(he, {
302
313
  id: t,
303
314
  children: [
304
- /* @__PURE__ */ C(Z, { children: /* @__PURE__ */ C(T, {
305
- show: !0,
306
- elementId: `${t}_success`,
307
- children: n
315
+ /* @__PURE__ */ E(X, { children: /* @__PURE__ */ D(_e, {
316
+ id: `${t}_success`,
317
+ role: "status",
318
+ children: [/* @__PURE__ */ E(i, {
319
+ color: o.Success,
320
+ size: u.Small
321
+ }), n]
308
322
  }) }),
309
- r && /* @__PURE__ */ C(Z, { children: r }),
310
- i && /* @__PURE__ */ C(fe, { children: i })
323
+ r && /* @__PURE__ */ E(X, { children: r }),
324
+ a && /* @__PURE__ */ E(ge, { children: a })
311
325
  ]
312
326
  });
313
327
  },
314
328
  KYCFailScreen: (e) => {
315
329
  let { elementId: t, title: n, support: r } = e;
316
- return /* @__PURE__ */ w(pe, {
330
+ return /* @__PURE__ */ D(ve, {
317
331
  id: t,
318
- children: [/* @__PURE__ */ C(me, { children: /* @__PURE__ */ C(I, {
332
+ children: [/* @__PURE__ */ E(Z, { children: /* @__PURE__ */ E(L, {
319
333
  label: n,
320
334
  isDocumentPartError: !1
321
335
  }) }), r]
322
336
  });
323
337
  }
324
- }, he = p.div`
338
+ }, ye = m.div`
325
339
  display: flex;
326
340
  flex-direction: column;
327
341
  align-items: flex-start;
328
342
  width: 100%;
329
- `, ge = p.div`
330
- font-size: ${_}px;
331
- `, _e = p.div`
343
+ `, be = m.div`
344
+ font-size: ${v}px;
345
+ `, xe = m.div`
332
346
  width: 100%;
333
- margin-bottom: ${x * 6}px;
334
- `, ve = p.div`
347
+ margin-bottom: ${w * 6}px;
348
+ `, Se = m.div`
335
349
  display: flex;
336
350
  justify-content: flex-end;
337
351
  width: 100%;
@@ -346,13 +360,13 @@ var E = {
346
360
  let n = [...h];
347
361
  n.splice(e, 1, t), g(n);
348
362
  };
349
- return /* @__PURE__ */ w(he, {
363
+ return /* @__PURE__ */ D(ye, {
350
364
  id: a,
351
365
  children: [
352
- o && /* @__PURE__ */ C(ge, { children: o }),
353
- /* @__PURE__ */ C(_e, { children: h.map((e, t) => {
366
+ o && /* @__PURE__ */ E(be, { children: o }),
367
+ /* @__PURE__ */ E(xe, { children: h.map((e, t) => {
354
368
  let n = `kyc-form_item_${e.type}_${t}`;
355
- return /* @__PURE__ */ C(ue, {
369
+ return /* @__PURE__ */ E(me, {
356
370
  index: t,
357
371
  type: e.type,
358
372
  parts: e.parts,
@@ -363,7 +377,7 @@ var E = {
363
377
  onDocumentChange: (e) => y(t, e)
364
378
  }, n);
365
379
  }) }),
366
- /* @__PURE__ */ C(ve, { children: /* @__PURE__ */ C(e, {
380
+ /* @__PURE__ */ E(Se, { children: /* @__PURE__ */ E(e, {
367
381
  id: `${a}_button`,
368
382
  variant: t.Primary,
369
383
  isDisabled: _,
@@ -376,6 +390,6 @@ var E = {
376
390
  };
377
391
  $.SuccessScreen = Q.KYCSuccessScreen, $.FailScreen = Q.KYCFailScreen;
378
392
  //#endregion
379
- export { j as ACCEPT_FORMATS, M as AVAILABLE_EXTRA_PARTS_DOCUMENTS, E as DocumentType, ee as MAX_EXTRA_PARTS_COUNT, O as MAX_FILE_SIZE, te as OPTIONAL_DOCUMENT_PARTS, k as PDF_MIME_TYPE, D as PartType, $ as default };
393
+ export { N as ACCEPT_FORMATS, P as AVAILABLE_EXTRA_PARTS_DOCUMENTS, O as DocumentType, te as MAX_EXTRA_PARTS_COUNT, A as MAX_FILE_SIZE, ne as OPTIONAL_DOCUMENT_PARTS, j as PDF_MIME_TYPE, k as PartType, $ as default };
380
394
 
381
395
  //# sourceMappingURL=index.js.map
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":[],"sources":["../src/document.types.ts","../src/constants.ts","../src/KYCErrorLabel/style.tsx","../src/KYCErrorLabel/index.tsx","../src/utils.ts","../src/KYCDocumentParts/style.tsx","../src/KYCDocumentParts/index.tsx","../src/KYCFormItem/style.tsx","../src/KYCFormItem/index.tsx","../src/KYCStatusScreen/style.tsx","../src/KYCStatusScreen/index.tsx","../src/style.tsx","../src/index.tsx"],"sourcesContent":["export const DocumentType = {\n Id: 'id',\n Ub: 'ub',\n IdExtra: 'id_extra',\n Card: 'bank_card',\n PaymentSystemScreen: 'payment_system_screen',\n OnlineBankingStatement: 'online_banking_statement',\n CompanyRegistrationDocument: 'company_registration_document',\n SelfieWithIdCard: 'selfie_with_id_card_or_bank_card',\n PaypalDetailsPage: 'pay_pal_details_page',\n BankWireDetails: 'bank_wire_details',\n TransactionConfirmation: 'transaction_confirmation',\n Other: 'other',\n Feedback: 'feedback',\n} as const;\nexport type DocumentType = (typeof DocumentType)[keyof typeof DocumentType];\n\nexport const PartType = {\n IdFront: 'id_front',\n IdBack: 'id_back',\n Ub: 'ub_item',\n Card: 'card_item',\n PaymentSystemScreen: 'screen_item',\n OnlineBankingStatement: 'obs_item',\n CompanyRegistrationDocument: 'crd_item',\n SelfieWithIdCard: 'selfie_item',\n PaypalDetailsPageImage: 'pay_pal_details_page_image',\n BankWireDetailsPage: 'bank_wire_details_image',\n TransactionConfirmationImage: 'transaction_confirmation_image',\n OtherImage: 'other_image',\n Feedback: 'feedback',\n} as const;\nexport type PartType = (typeof PartType)[keyof typeof PartType];\n\nexport type KYCFileData = string | undefined;\n\nexport type KYCFile = {\n type: PartType;\n data?: KYCFileData;\n};\n\nexport type KYCDocument = {\n type: DocumentType;\n parts: KYCFile[];\n};\n","import type {ImageUploaderProps} from '@propellerads/image-uploader';\nimport {DocumentType, PartType} from './document.types';\n\nexport const MAX_FILE_SIZE = 5242880;\n\nexport const MAX_EXTRA_PARTS_COUNT = 3;\n\nexport const PDF_MIME_TYPE = 'application/pdf';\nexport const HEIC_MIME_TYPE = 'image/heic';\nexport const ACCEPT_FORMATS: ImageUploaderProps['acceptFormats'] = {\n 'image/png': ['.png'],\n 'image/jpeg': ['.jpg', '.jpe', '.jpeg'],\n [PDF_MIME_TYPE]: ['.pdf'],\n [HEIC_MIME_TYPE]: ['.heic'],\n};\n\nexport const AVAILABLE_EXTRA_PARTS_DOCUMENTS: DocumentType[] = [\n DocumentType.Card,\n DocumentType.Card,\n DocumentType.PaypalDetailsPage,\n DocumentType.BankWireDetails,\n DocumentType.TransactionConfirmation,\n DocumentType.SelfieWithIdCard,\n DocumentType.PaymentSystemScreen,\n DocumentType.Other,\n];\n\nexport const OPTIONAL_DOCUMENT_PARTS = {\n [DocumentType.Id]: {\n parts: [PartType.IdBack],\n },\n [DocumentType.IdExtra]: {\n parts: [PartType.IdBack],\n },\n};\n","import styled from 'styled-components';\nimport {fontSmall, spacing, white, errorColor} from '@propellerads/stylevariables';\n\nconst StyledKYCErrorLabel = styled.div`\n display: flex;\n align-items: center;\n color: ${errorColor};\n margin-top: ${spacing * 2}px;\n margin-bottom: ${spacing * 4}px;\n`;\n\nconst StyledKYCErrorLabelIcon = styled.span`\n display: flex;\n align-items: center;\n justify-content: center;\n width: 14px;\n height: 14px;\n border-radius: 100%;\n background-color: ${errorColor};\n\n &:before {\n font-size: ${fontSmall};\n color: ${white};\n content: '!';\n }\n`;\n\nconst StyledKYCErrorLabelText = styled.span`\n margin-left: ${spacing * 2}px;\n`;\n\nexport {StyledKYCErrorLabel, StyledKYCErrorLabelIcon, StyledKYCErrorLabelText};\n","import {Close, Color, Size} from '@propellerads/icon';\nimport {StyledKYCErrorLabel, StyledKYCErrorLabelIcon, StyledKYCErrorLabelText} from './style';\nimport {KYCErrorLabelProps} from './types';\n\nconst KYCErrorLabel = (props: KYCErrorLabelProps) => (\n <StyledKYCErrorLabel>\n {props.isDocumentPartError ? (\n <StyledKYCErrorLabelIcon />\n ) : (\n <Close color={Color.Error} hoverColor={Color.Error} size={Size.Small} />\n )}\n <StyledKYCErrorLabelText>{props.label}</StyledKYCErrorLabelText>\n </StyledKYCErrorLabel>\n);\n\nexport default KYCErrorLabel;\n","import {AVAILABLE_EXTRA_PARTS_DOCUMENTS, HEIC_MIME_TYPE, MAX_EXTRA_PARTS_COUNT, PDF_MIME_TYPE} from './constants';\nimport {DocumentType, KYCFile, KYCFileData} from './document.types';\n\nconst isDocumentExtraPartAvailable = (documentType: DocumentType): boolean =>\n AVAILABLE_EXTRA_PARTS_DOCUMENTS.includes(documentType);\n\nconst canAddExtraPart = (documentType: DocumentType, parts: KYCFile[]): boolean =>\n isDocumentExtraPartAvailable(documentType) &&\n parts.every((part: KYCFile) => Boolean(part.data)) &&\n parts.length < MAX_EXTRA_PARTS_COUNT &&\n parts.length > 0;\n\nconst canRemoveExtraPart = (documentType: DocumentType, parts: KYCFile[]): boolean =>\n AVAILABLE_EXTRA_PARTS_DOCUMENTS.includes(documentType) && parts.length > 1;\n\nconst getMimeType = (partData: KYCFileData): string | undefined => partData?.match(/[^:]\\w+\\/[\\w-+\\d.]+(?=;|,)/)?.[0];\n\nconst isPDF = (partData: KYCFileData): boolean => {\n const mimeType: string | undefined = getMimeType(partData);\n return mimeType === PDF_MIME_TYPE;\n};\n\nconst isHEIC = (partData: KYCFileData): boolean => {\n const mimeType: string | undefined = getMimeType(partData);\n return mimeType === HEIC_MIME_TYPE;\n};\n\nconst isFileUniqueInDocument = (file: KYCFile, parts: KYCFile[]): boolean =>\n parts.every((part: KYCFile) => part.data !== file?.data);\n\nconst getFileBase64 = async (file: File): Promise<string> => {\n const reader: FileReader = new FileReader();\n\n return new Promise<string>((resolve, reject) => {\n reader.onload = () => resolve(reader.result as string);\n reader.onerror = (error) => reject(error);\n\n reader.readAsDataURL(file);\n });\n};\n\nexport {\n canAddExtraPart,\n canRemoveExtraPart,\n getFileBase64,\n isDocumentExtraPartAvailable,\n isFileUniqueInDocument,\n isHEIC,\n isPDF,\n};\n","import styled from 'styled-components';\nimport {borderRadius, spacing, gray95, white} from '@propellerads/stylevariables';\n\nconst StyledKYCFormItem = styled.div`\n margin-top: ${spacing * 4}px;\n margin-left: ${spacing * 4}px;\n`;\n\nconst StyledKYCFormItemFileTitle = styled.div`\n margin-bottom: ${spacing}px;\n`;\n\nconst StyledKYCFormItemFilePreview = styled.div`\n display: flex;\n align-items: center;\n background-color: ${gray95};\n padding: ${spacing * 2}px;\n border-radius: ${borderRadius}px;\n`;\n\nconst StyledKYCFormItemFilePreviewName = styled.span`\n width: 100%;\n margin-left: ${spacing * 4}px;\n margin-right: ${spacing * 2}px;\n`;\n\nconst StyledKYCFormItemFilePreviewRemove = styled.span`\n cursor: pointer !important;\n margin-right: ${spacing * 2}px;\n`;\n\nconst StyledKYCFormItemFileUploaderContainer = styled.div`\n height: 66px;\n`;\n\nconst StyledKYCFormItemFileExtraPart = styled.div`\n display: flex;\n flex-direction: column;\n margin-top: ${spacing * 4}px;\n margin-left: ${spacing * 4}px;\n`;\n\nconst StyledKYCDocumentPartImgMiniature = styled.img`\n width: auto;\n max-width: 204px;\n height: 50px;\n object-fit: contain;\n border-radius: ${borderRadius}px;\n`;\n\nconst StyledKYCDocumentPartIconMiniature = styled.div`\n display: flex;\n align-items: center;\n justify-content: center;\n min-width: 50px;\n height: 50px;\n border-radius: ${borderRadius}px;\n background-color: ${white};\n`;\n\nexport {\n StyledKYCFormItem,\n StyledKYCFormItemFilePreview,\n StyledKYCFormItemFilePreviewName,\n StyledKYCFormItemFilePreviewRemove,\n StyledKYCFormItemFileTitle,\n StyledKYCFormItemFileUploaderContainer,\n StyledKYCFormItemFileExtraPart,\n StyledKYCDocumentPartImgMiniature,\n StyledKYCDocumentPartIconMiniature,\n};\n","import {Color, Delete, Insert, Pdf} from '@propellerads/icon';\nimport ImageUploader, {Direction} from '@propellerads/image-uploader';\nimport TextArea from '@propellerads/textarea';\nimport {ACCEPT_FORMATS, MAX_FILE_SIZE} from '../constants';\nimport KYCErrorLabel from '../KYCErrorLabel';\nimport {isHEIC, isPDF} from '../utils';\nimport {\n StyledKYCDocumentPartIconMiniature,\n StyledKYCDocumentPartImgMiniature,\n StyledKYCFormItem,\n StyledKYCFormItemFileExtraPart,\n StyledKYCFormItemFilePreview,\n StyledKYCFormItemFilePreviewName,\n StyledKYCFormItemFilePreviewRemove,\n StyledKYCFormItemFileTitle,\n StyledKYCFormItemFileUploaderContainer,\n} from './style';\nimport {\n KYCDocumentPartMiniatureProps,\n KYCFormItemFileExtraPartProps,\n KYCFormItemFileProps,\n KYCFormItemTextProps,\n} from './types';\n\nconst KYCDocumentPartMiniature = (props: KYCDocumentPartMiniatureProps) => {\n const {data} = props;\n const isPDFPart: boolean = isPDF(data);\n const isHEICPart: boolean = isHEIC(data);\n\n if (isPDFPart || isHEICPart) {\n return (\n <StyledKYCDocumentPartIconMiniature>\n {isPDFPart && <Pdf color={Color.Gray} hoverColor={Color.Gray} />}\n {isHEICPart && <Insert color={Color.Gray} hoverColor={Color.Gray} />}\n </StyledKYCDocumentPartIconMiniature>\n );\n }\n\n return <StyledKYCDocumentPartImgMiniature src={data} />;\n};\n\nconst KYCFormItemFileExtraPart = (props: KYCFormItemFileExtraPartProps) => {\n const {elementId, title, uploaderLabels, onFileAdd} = props;\n const handleDrop = (files: File[]) => {\n const [file] = files;\n\n if (file) {\n onFileAdd(file);\n }\n };\n\n return (\n <StyledKYCFormItemFileExtraPart id={elementId}>\n {title && <StyledKYCFormItemFileTitle>{title}</StyledKYCFormItemFileTitle>}\n\n <StyledKYCFormItemFileUploaderContainer>\n <ImageUploader\n title={uploaderLabels.title}\n action={uploaderLabels.action}\n maxSize={MAX_FILE_SIZE}\n acceptFormats={ACCEPT_FORMATS}\n elementId={`${elementId}_uploader`}\n direction={Direction.Row}\n onDrop={handleDrop}\n />\n </StyledKYCFormItemFileUploaderContainer>\n </StyledKYCFormItemFileExtraPart>\n );\n};\n\nconst KYCFormItemFile = (props: KYCFormItemFileProps) => {\n const {name, title, data, error, elementId, uploaderLabels, onFileChange, onFileRemove} = props;\n const handleDrop = (files: File[]) => {\n const [file] = files;\n\n if (file) {\n onFileChange(file);\n }\n };\n\n return (\n <StyledKYCFormItem id={elementId}>\n {title && <StyledKYCFormItemFileTitle>{title}</StyledKYCFormItemFileTitle>}\n\n {data ? (\n <StyledKYCFormItemFilePreview>\n <KYCDocumentPartMiniature data={data} />\n <StyledKYCFormItemFilePreviewName>{name}</StyledKYCFormItemFilePreviewName>\n <StyledKYCFormItemFilePreviewRemove onClick={onFileRemove}>\n <Delete color={Color.Blue} hoverColor={Color.Blue} />\n </StyledKYCFormItemFilePreviewRemove>\n </StyledKYCFormItemFilePreview>\n ) : (\n <StyledKYCFormItemFileUploaderContainer>\n <ImageUploader\n title={uploaderLabels.title}\n action={uploaderLabels.action}\n maxSize={MAX_FILE_SIZE}\n acceptFormats={ACCEPT_FORMATS}\n elementId={`${elementId}_uploader`}\n direction={Direction.Row}\n onDrop={handleDrop}\n />\n </StyledKYCFormItemFileUploaderContainer>\n )}\n\n {error && <KYCErrorLabel label={error} isDocumentPartError />}\n </StyledKYCFormItem>\n );\n};\n\nconst KYCFormItemText = (props: KYCFormItemTextProps) => {\n const {onFeedbackChange, value = ''} = props;\n\n const handleChange = (newValue: string) => onFeedbackChange(newValue);\n\n return (\n <StyledKYCFormItem>\n <TextArea\n onChange={handleChange}\n onBlur={handleChange}\n value={value}\n errors={[]}\n name=\"kyc-client-comments\"\n elementId=\"kyc-feedback-textarea\"\n />\n </StyledKYCFormItem>\n );\n};\n\nexport default {\n KYCFormItemFileExtraPart,\n KYCFormItemFile,\n KYCFormItemText,\n};\n","import styled from 'styled-components';\nimport {fontNormal, fontSmall, spacing, gray50, black} from '@propellerads/stylevariables';\n\nconst StyledKYCFormItem = styled.div`\n margin-top: ${spacing * 6}px;\n`;\n\nconst StyledKYCFormItemTitle = styled.div`\n font-size: ${fontNormal}px;\n font-weight: bold;\n color: ${black};\n margin-bottom: ${spacing}px;\n`;\n\nconst StyledKYCFormItemDescription = styled.div`\n font-size: ${fontSmall}px;\n color: ${gray50};\n margin-left: ${spacing * 4}px;\n`;\n\nexport {StyledKYCFormItem, StyledKYCFormItemTitle, StyledKYCFormItemDescription};\n","import {useState} from 'react';\nimport {KYCDocument, KYCFile, KYCFileData, PartType} from '../document.types';\nimport KYCDocumentParts from '../KYCDocumentParts';\nimport {PartLabels, PartsLabels} from '../labels.types';\nimport {canAddExtraPart, getFileBase64, isDocumentExtraPartAvailable, isFileUniqueInDocument} from '../utils';\nimport {StyledKYCFormItem, StyledKYCFormItemDescription, StyledKYCFormItemTitle} from './style';\nimport {KYCFormItemProps} from './types';\n\nconst getErrorKey = (documentIndex: number, partIndex: number) => `[${documentIndex}].parts[${partIndex}].data`;\n\nconst KYCFormItem = (props: KYCFormItemProps) => {\n const {type, index, uploaderLabels, documentLabels, elementId, parts, errors, onDocumentChange} = props;\n const [localErrors, setLocalErrors] = useState<Map<string, string>>(new Map<string, string>());\n\n const isAddExtraPartAvailable: boolean = canAddExtraPart(type, parts);\n const documentLabelsParts: PartsLabels | undefined = documentLabels?.parts;\n const firstPart = parts[0];\n const extraPartTitle = firstPart ? documentLabelsParts?.[firstPart.type]?.title : undefined;\n\n const [fileNames, setFileNames] = useState<Map<string, string>>(new Map<string, string>());\n\n const setLocalErrorByPartIndex = (partIndex: number) => {\n const newLocalErrors = new Map<string, string>(localErrors);\n newLocalErrors.set(getErrorKey(index, partIndex), uploaderLabels.oversizeError);\n setLocalErrors(newLocalErrors);\n };\n\n const deleteLocalErrorByPartIndex = (partIndex: number) => {\n const newLocalErrors = new Map<string, string>(localErrors);\n newLocalErrors.delete(getErrorKey(index, partIndex));\n setLocalErrors(newLocalErrors);\n };\n\n const updateDocumentPart = (part: KYCFile, partIndex: number, data?: KYCFileData) => {\n const newPart: KYCFile = {\n ...part,\n data,\n };\n\n const newParts: KYCFile[] = [...parts];\n newParts.splice(partIndex, 1, newPart);\n\n const newDocument: KYCDocument = {\n type,\n parts: newParts,\n };\n\n onDocumentChange(newDocument);\n };\n\n const onFileChange = async (partIndex: number, file: File) => {\n if (!file) {\n setLocalErrorByPartIndex(partIndex);\n return;\n }\n\n const part = parts[partIndex] ?? parts[0];\n\n if (!part) {\n return;\n }\n\n const data: string = await getFileBase64(file);\n\n updateDocumentPart(part, partIndex, data);\n\n const newFileNames = new Map<string, string>(fileNames);\n newFileNames.set(data, file.name);\n setFileNames(newFileNames);\n\n deleteLocalErrorByPartIndex(partIndex);\n };\n\n const onFileRemove = (partIndex: number) => {\n const part = parts[partIndex];\n\n if (!part) {\n return;\n }\n\n updateDocumentPart(part, partIndex);\n\n const removedPart = parts[partIndex];\n const newFileNames = new Map<string, string>(fileNames);\n\n if (removedPart?.data && isFileUniqueInDocument(removedPart, parts)) {\n newFileNames.delete(removedPart?.data);\n }\n\n setFileNames(newFileNames);\n\n deleteLocalErrorByPartIndex(partIndex);\n };\n\n const getFileName = (key: string | undefined): string | undefined => {\n if (!key) {\n return undefined;\n }\n\n return fileNames.get(key);\n };\n\n const onFeedbackChange = (partIndex: number, data: string) => {\n const part = parts[partIndex] ?? parts[0];\n\n if (!part) {\n return;\n }\n\n updateDocumentPart(part, partIndex, data);\n };\n\n return (\n <StyledKYCFormItem id={elementId}>\n <StyledKYCFormItemTitle>{`${index + 1}. ${documentLabels?.title}`}</StyledKYCFormItemTitle>\n\n {documentLabels?.description && (\n <StyledKYCFormItemDescription>{documentLabels?.description}</StyledKYCFormItemDescription>\n )}\n\n {parts.map((part, partIndex) => {\n let itemKey = `kyc-form_item_file_${part.type}`;\n\n const isExtraPartAvailable: boolean = isDocumentExtraPartAvailable(type);\n const partLabels: PartLabels | undefined = documentLabelsParts?.[part.type];\n const partTitle = isExtraPartAvailable ? undefined : partLabels?.title;\n\n if (isDocumentExtraPartAvailable(type) && part.data) {\n itemKey = `${itemKey}_${part.data?.substr(-32)}`;\n\n if (!isFileUniqueInDocument(part, parts)) {\n itemKey = `${itemKey}_${partIndex}`;\n }\n }\n\n const partError = errors?.[getErrorKey(index, partIndex)];\n const localPartError = localErrors.get(getErrorKey(index, partIndex));\n\n if (part.type === PartType.Feedback) {\n return (\n <KYCDocumentParts.KYCFormItemText\n key={itemKey}\n value={part.data}\n onFeedbackChange={(value) => onFeedbackChange(partIndex, value)}\n />\n );\n }\n\n return (\n <KYCDocumentParts.KYCFormItemFile\n title={partTitle}\n data={part.data}\n type={part.type}\n name={getFileName(part.data)}\n uploaderLabels={uploaderLabels}\n error={localPartError || partError}\n key={itemKey}\n elementId={`${elementId}_part_${part.type}_${partIndex}`}\n onFileChange={(file) => onFileChange(partIndex, file)}\n onFileRemove={() => onFileRemove(partIndex)}\n />\n );\n })}\n\n {isAddExtraPartAvailable && firstPart && (\n <KYCDocumentParts.KYCFormItemFileExtraPart\n elementId={`${elementId}_extra`}\n title={extraPartTitle}\n uploaderLabels={uploaderLabels}\n onFileAdd={(file) => onFileChange(parts.length, file)}\n />\n )}\n </StyledKYCFormItem>\n );\n};\n\nexport default KYCFormItem;\n","import styled from 'styled-components';\nimport {spacing, gray50} from '@propellerads/stylevariables';\n\nconst StyledKYCSucessScreen = styled.div`\n display: flex;\n flex-direction: column;\n`;\n\nconst StyledKYCSucessScreenItem = styled.span`\n margin-bottom: ${spacing * 8}px;\n`;\n\nconst StyledKYCSucessScreenSuppport = styled.span`\n color: ${gray50};\n`;\n\nconst StyledKYCFailScreen = styled.div`\n display: flex;\n flex-direction: column;\n`;\n\nconst StyledKYCFailScreenItem = styled.span`\n margin-bottom: ${spacing * 6}px;\n`;\n\nexport {\n StyledKYCSucessScreen,\n StyledKYCSucessScreenItem,\n StyledKYCSucessScreenSuppport,\n StyledKYCFailScreen,\n StyledKYCFailScreenItem,\n};\n","import SuccessLabel from '@propellerads/success-label';\nimport {\n ACCEPT_FORMATS,\n AVAILABLE_EXTRA_PARTS_DOCUMENTS,\n MAX_EXTRA_PARTS_COUNT,\n MAX_FILE_SIZE,\n PDF_MIME_TYPE,\n} from '../constants';\nimport KYCErrorLabel from '../KYCErrorLabel';\nimport {\n StyledKYCFailScreen,\n StyledKYCFailScreenItem,\n StyledKYCSucessScreen,\n StyledKYCSucessScreenItem,\n StyledKYCSucessScreenSuppport,\n} from './style';\nimport {KYCFailScreenProps, KYCSuccessScreenProps} from './types';\n\nconst KYCSuccessScreen = (props: KYCSuccessScreenProps) => {\n const {elementId, title, description, support} = props;\n\n return (\n <StyledKYCSucessScreen id={elementId}>\n <StyledKYCSucessScreenItem>\n <SuccessLabel show elementId={`${elementId}_success`}>\n {title}\n </SuccessLabel>\n </StyledKYCSucessScreenItem>\n\n {description && <StyledKYCSucessScreenItem>{description}</StyledKYCSucessScreenItem>}\n\n {support && <StyledKYCSucessScreenSuppport>{support}</StyledKYCSucessScreenSuppport>}\n </StyledKYCSucessScreen>\n );\n};\n\nconst KYCFailScreen = (props: KYCFailScreenProps) => {\n const {elementId, title, support} = props;\n\n return (\n <StyledKYCFailScreen id={elementId}>\n <StyledKYCFailScreenItem>\n <KYCErrorLabel label={title} isDocumentPartError={false} />\n </StyledKYCFailScreenItem>\n\n {support}\n </StyledKYCFailScreen>\n );\n};\n\nexport default {\n KYCSuccessScreen,\n KYCFailScreen,\n};\n\nexport {ACCEPT_FORMATS, AVAILABLE_EXTRA_PARTS_DOCUMENTS, MAX_EXTRA_PARTS_COUNT, MAX_FILE_SIZE, PDF_MIME_TYPE};\n","import styled from 'styled-components';\nimport {fontNormal, spacing} from '@propellerads/stylevariables';\n\nconst StyledKYCForm = styled.div`\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n width: 100%;\n`;\n\nconst StyledKYCFormTitle = styled.div`\n font-size: ${fontNormal}px;\n`;\n\nconst StyledKYCFormDocuments = styled.div`\n width: 100%;\n margin-bottom: ${spacing * 6}px;\n`;\n\nconst StyledKYCFormButton = styled.div`\n display: flex;\n justify-content: flex-end;\n width: 100%;\n`;\n\nexport {StyledKYCForm, StyledKYCFormTitle, StyledKYCFormDocuments, StyledKYCFormButton};\n","import Button, {ButtonVariant} from '@propellerads/button';\nimport {useEffect, useState} from 'react';\nimport {\n ACCEPT_FORMATS,\n AVAILABLE_EXTRA_PARTS_DOCUMENTS,\n MAX_EXTRA_PARTS_COUNT,\n MAX_FILE_SIZE,\n OPTIONAL_DOCUMENT_PARTS,\n PDF_MIME_TYPE,\n} from './constants';\nimport {DocumentType, KYCDocument, PartType, KYCFile} from './document.types';\nimport KYCFormItem from './KYCFormItem';\nimport KYCStatusScreen from './KYCStatusScreen';\nimport {StyledKYCForm, StyledKYCFormButton, StyledKYCFormDocuments, StyledKYCFormTitle} from './style';\nimport {KYCFormProps} from './types';\n\nconst KYCForm = (props: KYCFormProps) => {\n const {\n elementId,\n title,\n uploadButtonLabel,\n uploaderLabels,\n documentsLabels,\n documents,\n errors,\n isLoading,\n validator,\n onUploadClick,\n } = props;\n\n const [userDocuments, setUserDocuments] = useState<KYCDocument[]>(documents);\n const [isButtonDisabled, setButtonDisabled] = useState<boolean>(true);\n\n useEffect(() => {\n setUserDocuments(documents);\n }, [documents]);\n\n useEffect(() => {\n const isValid: boolean = validator(userDocuments);\n setButtonDisabled(!isValid);\n }, [userDocuments, validator]);\n\n const onDocumentChange = (index: number, document: KYCDocument) => {\n const newDocuments: KYCDocument[] = [...userDocuments];\n newDocuments.splice(index, 1, document);\n\n setUserDocuments(newDocuments);\n };\n\n return (\n <StyledKYCForm id={elementId}>\n {title && <StyledKYCFormTitle>{title}</StyledKYCFormTitle>}\n\n <StyledKYCFormDocuments>\n {userDocuments.map((document, index) => {\n const key = `kyc-form_item_${document.type}_${index}`;\n\n return (\n <KYCFormItem\n index={index}\n type={document.type}\n parts={document.parts}\n documentLabels={documentsLabels[document.type]}\n uploaderLabels={uploaderLabels}\n errors={errors}\n elementId={`${elementId}_item_${document.type}`}\n key={key}\n onDocumentChange={(doc) => onDocumentChange(index, doc)}\n />\n );\n })}\n </StyledKYCFormDocuments>\n <StyledKYCFormButton>\n <Button\n id={`${elementId}_button`}\n variant={ButtonVariant.Primary}\n isDisabled={isButtonDisabled}\n isLoading={isLoading || false}\n onClick={() => onUploadClick(userDocuments)}\n >\n {uploadButtonLabel}\n </Button>\n </StyledKYCFormButton>\n </StyledKYCForm>\n );\n};\n\nKYCForm.SuccessScreen = KYCStatusScreen.KYCSuccessScreen;\nKYCForm.FailScreen = KYCStatusScreen.KYCFailScreen;\n\nexport default KYCForm;\n\nexport {\n ACCEPT_FORMATS,\n AVAILABLE_EXTRA_PARTS_DOCUMENTS,\n DocumentType,\n MAX_EXTRA_PARTS_COUNT,\n MAX_FILE_SIZE,\n OPTIONAL_DOCUMENT_PARTS,\n PartType,\n PDF_MIME_TYPE,\n};\nexport type {KYCDocument, KYCFile};\n"],"mappings":"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"}
1
+ {"version":3,"file":"index.js","names":[],"sources":["../src/document.types.ts","../src/constants.ts","../src/KYCErrorLabel/style.tsx","../src/KYCErrorLabel/index.tsx","../src/utils.ts","../src/KYCDocumentParts/style.tsx","../src/KYCDocumentParts/index.tsx","../src/KYCFormItem/style.tsx","../src/KYCFormItem/index.tsx","../src/KYCStatusScreen/style.tsx","../src/KYCStatusScreen/index.tsx","../src/style.tsx","../src/index.tsx"],"sourcesContent":["export const DocumentType = {\n Id: 'id',\n Ub: 'ub',\n IdExtra: 'id_extra',\n Card: 'bank_card',\n PaymentSystemScreen: 'payment_system_screen',\n OnlineBankingStatement: 'online_banking_statement',\n CompanyRegistrationDocument: 'company_registration_document',\n SelfieWithIdCard: 'selfie_with_id_card_or_bank_card',\n PaypalDetailsPage: 'pay_pal_details_page',\n BankWireDetails: 'bank_wire_details',\n TransactionConfirmation: 'transaction_confirmation',\n Other: 'other',\n Feedback: 'feedback',\n} as const;\nexport type DocumentType = (typeof DocumentType)[keyof typeof DocumentType];\n\nexport const PartType = {\n IdFront: 'id_front',\n IdBack: 'id_back',\n Ub: 'ub_item',\n Card: 'card_item',\n PaymentSystemScreen: 'screen_item',\n OnlineBankingStatement: 'obs_item',\n CompanyRegistrationDocument: 'crd_item',\n SelfieWithIdCard: 'selfie_item',\n PaypalDetailsPageImage: 'pay_pal_details_page_image',\n BankWireDetailsPage: 'bank_wire_details_image',\n TransactionConfirmationImage: 'transaction_confirmation_image',\n OtherImage: 'other_image',\n Feedback: 'feedback',\n} as const;\nexport type PartType = (typeof PartType)[keyof typeof PartType];\n\nexport type KYCFileData = string | undefined;\n\nexport type KYCFile = {\n type: PartType;\n data?: KYCFileData;\n};\n\nexport type KYCDocument = {\n type: DocumentType;\n parts: KYCFile[];\n};\n","import type {ImageUploaderProps} from '@propellerads/image-uploader';\nimport {DocumentType, PartType} from './document.types';\n\nexport const MAX_FILE_SIZE = 5242880;\n\nexport const MAX_EXTRA_PARTS_COUNT = 3;\n\nexport const PDF_MIME_TYPE = 'application/pdf';\nexport const HEIC_MIME_TYPE = 'image/heic';\nexport const ACCEPT_FORMATS: ImageUploaderProps['acceptFormats'] = {\n 'image/png': ['.png'],\n 'image/jpeg': ['.jpg', '.jpe', '.jpeg'],\n [PDF_MIME_TYPE]: ['.pdf'],\n [HEIC_MIME_TYPE]: ['.heic'],\n};\n\nexport const AVAILABLE_EXTRA_PARTS_DOCUMENTS: DocumentType[] = [\n DocumentType.Card,\n DocumentType.Card,\n DocumentType.PaypalDetailsPage,\n DocumentType.BankWireDetails,\n DocumentType.TransactionConfirmation,\n DocumentType.SelfieWithIdCard,\n DocumentType.PaymentSystemScreen,\n DocumentType.Other,\n];\n\nexport const OPTIONAL_DOCUMENT_PARTS = {\n [DocumentType.Id]: {\n parts: [PartType.IdBack],\n },\n [DocumentType.IdExtra]: {\n parts: [PartType.IdBack],\n },\n};\n","import styled from 'styled-components';\nimport {fontSmall, spacing, white, errorColor} from '@propellerads/stylevariables';\n\nconst StyledKYCErrorLabel = styled.div`\n display: flex;\n align-items: center;\n color: ${errorColor};\n margin-top: ${spacing * 2}px;\n margin-bottom: ${spacing * 4}px;\n`;\n\nconst StyledKYCErrorLabelIcon = styled.span`\n display: flex;\n align-items: center;\n justify-content: center;\n width: 14px;\n height: 14px;\n border-radius: 100%;\n background-color: ${errorColor};\n\n &:before {\n font-size: ${fontSmall};\n color: ${white};\n content: '!';\n }\n`;\n\nconst StyledKYCErrorLabelText = styled.span`\n margin-left: ${spacing * 2}px;\n`;\n\nexport {StyledKYCErrorLabel, StyledKYCErrorLabelIcon, StyledKYCErrorLabelText};\n","import {Close, Color, Size} from '@propellerads/icon';\nimport {StyledKYCErrorLabel, StyledKYCErrorLabelIcon, StyledKYCErrorLabelText} from './style';\nimport {KYCErrorLabelProps} from './types';\n\nconst KYCErrorLabel = (props: KYCErrorLabelProps) => (\n <StyledKYCErrorLabel>\n {props.isDocumentPartError ? (\n <StyledKYCErrorLabelIcon />\n ) : (\n <Close color={Color.Error} hoverColor={Color.Error} size={Size.Small} />\n )}\n <StyledKYCErrorLabelText>{props.label}</StyledKYCErrorLabelText>\n </StyledKYCErrorLabel>\n);\n\nexport default KYCErrorLabel;\n","import {AVAILABLE_EXTRA_PARTS_DOCUMENTS, HEIC_MIME_TYPE, MAX_EXTRA_PARTS_COUNT, PDF_MIME_TYPE} from './constants';\nimport {DocumentType, KYCFile, KYCFileData} from './document.types';\n\nconst isDocumentExtraPartAvailable = (documentType: DocumentType): boolean =>\n AVAILABLE_EXTRA_PARTS_DOCUMENTS.includes(documentType);\n\nconst canAddExtraPart = (documentType: DocumentType, parts: KYCFile[]): boolean =>\n isDocumentExtraPartAvailable(documentType) &&\n parts.every((part: KYCFile) => Boolean(part.data)) &&\n parts.length < MAX_EXTRA_PARTS_COUNT &&\n parts.length > 0;\n\nconst canRemoveExtraPart = (documentType: DocumentType, parts: KYCFile[]): boolean =>\n AVAILABLE_EXTRA_PARTS_DOCUMENTS.includes(documentType) && parts.length > 1;\n\nconst getMimeType = (partData: KYCFileData): string | undefined => partData?.match(/[^:]\\w+\\/[\\w-+\\d.]+(?=;|,)/)?.[0];\n\nconst isPDF = (partData: KYCFileData): boolean => {\n const mimeType: string | undefined = getMimeType(partData);\n return mimeType === PDF_MIME_TYPE;\n};\n\nconst isHEIC = (partData: KYCFileData): boolean => {\n const mimeType: string | undefined = getMimeType(partData);\n return mimeType === HEIC_MIME_TYPE;\n};\n\nconst isFileUniqueInDocument = (file: KYCFile, parts: KYCFile[]): boolean =>\n parts.every((part: KYCFile) => part.data !== file?.data);\n\nconst getFileBase64 = async (file: File): Promise<string> => {\n const reader: FileReader = new FileReader();\n\n return new Promise<string>((resolve, reject) => {\n reader.onload = () => resolve(reader.result as string);\n reader.onerror = (error) => reject(error);\n\n reader.readAsDataURL(file);\n });\n};\n\nexport {\n canAddExtraPart,\n canRemoveExtraPart,\n getFileBase64,\n isDocumentExtraPartAvailable,\n isFileUniqueInDocument,\n isHEIC,\n isPDF,\n};\n","import styled from 'styled-components';\nimport {borderRadius, spacing, gray95, white} from '@propellerads/stylevariables';\n\nconst StyledKYCFormItem = styled.div`\n margin-top: ${spacing * 4}px;\n margin-left: ${spacing * 4}px;\n`;\n\nconst StyledKYCFormItemFileTitle = styled.div`\n margin-bottom: ${spacing}px;\n`;\n\nconst StyledKYCFormItemFilePreview = styled.div`\n display: flex;\n align-items: center;\n background-color: ${gray95};\n padding: ${spacing * 2}px;\n border-radius: ${borderRadius}px;\n`;\n\nconst StyledKYCFormItemFilePreviewName = styled.span`\n width: 100%;\n margin-left: ${spacing * 4}px;\n margin-right: ${spacing * 2}px;\n`;\n\nconst StyledKYCFormItemFilePreviewRemove = styled.span`\n cursor: pointer !important;\n margin-right: ${spacing * 2}px;\n`;\n\nconst StyledKYCFormItemFileUploaderContainer = styled.div`\n height: 66px;\n`;\n\nconst StyledKYCFormItemFileExtraPart = styled.div`\n display: flex;\n flex-direction: column;\n margin-top: ${spacing * 4}px;\n margin-left: ${spacing * 4}px;\n`;\n\nconst StyledKYCDocumentPartImgMiniature = styled.img`\n width: auto;\n max-width: 204px;\n height: 50px;\n object-fit: contain;\n border-radius: ${borderRadius}px;\n`;\n\nconst StyledKYCDocumentPartIconMiniature = styled.div`\n display: flex;\n align-items: center;\n justify-content: center;\n min-width: 50px;\n height: 50px;\n border-radius: ${borderRadius}px;\n background-color: ${white};\n`;\n\nexport {\n StyledKYCFormItem,\n StyledKYCFormItemFilePreview,\n StyledKYCFormItemFilePreviewName,\n StyledKYCFormItemFilePreviewRemove,\n StyledKYCFormItemFileTitle,\n StyledKYCFormItemFileUploaderContainer,\n StyledKYCFormItemFileExtraPart,\n StyledKYCDocumentPartImgMiniature,\n StyledKYCDocumentPartIconMiniature,\n};\n","import {Color, Delete, Insert, Pdf} from '@propellerads/icon';\nimport ImageUploader, {Direction} from '@propellerads/image-uploader';\nimport {Textarea} from '@propellerads/input';\nimport {ACCEPT_FORMATS, MAX_FILE_SIZE} from '../constants';\nimport KYCErrorLabel from '../KYCErrorLabel';\nimport {isHEIC, isPDF} from '../utils';\nimport {\n StyledKYCDocumentPartIconMiniature,\n StyledKYCDocumentPartImgMiniature,\n StyledKYCFormItem,\n StyledKYCFormItemFileExtraPart,\n StyledKYCFormItemFilePreview,\n StyledKYCFormItemFilePreviewName,\n StyledKYCFormItemFilePreviewRemove,\n StyledKYCFormItemFileTitle,\n StyledKYCFormItemFileUploaderContainer,\n} from './style';\nimport {\n KYCDocumentPartMiniatureProps,\n KYCFormItemFileExtraPartProps,\n KYCFormItemFileProps,\n KYCFormItemTextProps,\n} from './types';\n\nconst KYCDocumentPartMiniature = (props: KYCDocumentPartMiniatureProps) => {\n const {data} = props;\n const isPDFPart: boolean = isPDF(data);\n const isHEICPart: boolean = isHEIC(data);\n\n if (isPDFPart || isHEICPart) {\n return (\n <StyledKYCDocumentPartIconMiniature>\n {isPDFPart && <Pdf color={Color.Gray} hoverColor={Color.Gray} />}\n {isHEICPart && <Insert color={Color.Gray} hoverColor={Color.Gray} />}\n </StyledKYCDocumentPartIconMiniature>\n );\n }\n\n return <StyledKYCDocumentPartImgMiniature src={data} />;\n};\n\nconst KYCFormItemFileExtraPart = (props: KYCFormItemFileExtraPartProps) => {\n const {elementId, title, uploaderLabels, onFileAdd} = props;\n const handleDrop = (files: File[]) => {\n const [file] = files;\n\n if (file) {\n onFileAdd(file);\n }\n };\n\n return (\n <StyledKYCFormItemFileExtraPart id={elementId}>\n {title && <StyledKYCFormItemFileTitle>{title}</StyledKYCFormItemFileTitle>}\n\n <StyledKYCFormItemFileUploaderContainer>\n <ImageUploader\n title={uploaderLabels.title}\n action={uploaderLabels.action}\n maxSize={MAX_FILE_SIZE}\n acceptFormats={ACCEPT_FORMATS}\n elementId={`${elementId}_uploader`}\n direction={Direction.Row}\n onDrop={handleDrop}\n />\n </StyledKYCFormItemFileUploaderContainer>\n </StyledKYCFormItemFileExtraPart>\n );\n};\n\nconst KYCFormItemFile = (props: KYCFormItemFileProps) => {\n const {name, title, data, error, elementId, uploaderLabels, onFileChange, onFileRemove} = props;\n const handleDrop = (files: File[]) => {\n const [file] = files;\n\n if (file) {\n onFileChange(file);\n }\n };\n\n return (\n <StyledKYCFormItem id={elementId}>\n {title && <StyledKYCFormItemFileTitle>{title}</StyledKYCFormItemFileTitle>}\n\n {data ? (\n <StyledKYCFormItemFilePreview>\n <KYCDocumentPartMiniature data={data} />\n <StyledKYCFormItemFilePreviewName>{name}</StyledKYCFormItemFilePreviewName>\n <StyledKYCFormItemFilePreviewRemove onClick={onFileRemove}>\n <Delete color={Color.Blue} hoverColor={Color.Blue} />\n </StyledKYCFormItemFilePreviewRemove>\n </StyledKYCFormItemFilePreview>\n ) : (\n <StyledKYCFormItemFileUploaderContainer>\n <ImageUploader\n title={uploaderLabels.title}\n action={uploaderLabels.action}\n maxSize={MAX_FILE_SIZE}\n acceptFormats={ACCEPT_FORMATS}\n elementId={`${elementId}_uploader`}\n direction={Direction.Row}\n onDrop={handleDrop}\n />\n </StyledKYCFormItemFileUploaderContainer>\n )}\n\n {error && <KYCErrorLabel label={error} isDocumentPartError />}\n </StyledKYCFormItem>\n );\n};\n\nconst KYCFormItemText = (props: KYCFormItemTextProps) => {\n const {onFeedbackChange, value = ''} = props;\n\n return (\n <StyledKYCFormItem>\n <Textarea\n onChange={(event) => onFeedbackChange(event.target.value)}\n onBlur={(event) => onFeedbackChange(event.target.value)}\n value={value}\n rows={5}\n name=\"kyc-client-comments\"\n id=\"kyc-feedback-textarea\"\n aria-label=\"Comments\"\n />\n </StyledKYCFormItem>\n );\n};\n\nexport default {\n KYCFormItemFileExtraPart,\n KYCFormItemFile,\n KYCFormItemText,\n};\n","import styled from 'styled-components';\nimport {fontNormal, fontSmall, spacing, gray50, black} from '@propellerads/stylevariables';\n\nconst StyledKYCFormItem = styled.div`\n margin-top: ${spacing * 6}px;\n`;\n\nconst StyledKYCFormItemTitle = styled.div`\n font-size: ${fontNormal}px;\n font-weight: bold;\n color: ${black};\n margin-bottom: ${spacing}px;\n`;\n\nconst StyledKYCFormItemDescription = styled.div`\n font-size: ${fontSmall}px;\n color: ${gray50};\n margin-left: ${spacing * 4}px;\n`;\n\nexport {StyledKYCFormItem, StyledKYCFormItemTitle, StyledKYCFormItemDescription};\n","import {useState} from 'react';\nimport {KYCDocument, KYCFile, KYCFileData, PartType} from '../document.types';\nimport KYCDocumentParts from '../KYCDocumentParts';\nimport {PartLabels, PartsLabels} from '../labels.types';\nimport {canAddExtraPart, getFileBase64, isDocumentExtraPartAvailable, isFileUniqueInDocument} from '../utils';\nimport {StyledKYCFormItem, StyledKYCFormItemDescription, StyledKYCFormItemTitle} from './style';\nimport {KYCFormItemProps} from './types';\n\nconst getErrorKey = (documentIndex: number, partIndex: number) => `[${documentIndex}].parts[${partIndex}].data`;\n\nconst KYCFormItem = (props: KYCFormItemProps) => {\n const {type, index, uploaderLabels, documentLabels, elementId, parts, errors, onDocumentChange} = props;\n const [localErrors, setLocalErrors] = useState<Map<string, string>>(new Map<string, string>());\n\n const isAddExtraPartAvailable: boolean = canAddExtraPart(type, parts);\n const documentLabelsParts: PartsLabels | undefined = documentLabels?.parts;\n const firstPart = parts[0];\n const extraPartTitle = firstPart ? documentLabelsParts?.[firstPart.type]?.title : undefined;\n\n const [fileNames, setFileNames] = useState<Map<string, string>>(new Map<string, string>());\n\n const setLocalErrorByPartIndex = (partIndex: number) => {\n const newLocalErrors = new Map<string, string>(localErrors);\n newLocalErrors.set(getErrorKey(index, partIndex), uploaderLabels.oversizeError);\n setLocalErrors(newLocalErrors);\n };\n\n const deleteLocalErrorByPartIndex = (partIndex: number) => {\n const newLocalErrors = new Map<string, string>(localErrors);\n newLocalErrors.delete(getErrorKey(index, partIndex));\n setLocalErrors(newLocalErrors);\n };\n\n const updateDocumentPart = (part: KYCFile, partIndex: number, data?: KYCFileData) => {\n const newPart: KYCFile = {\n ...part,\n data,\n };\n\n const newParts: KYCFile[] = [...parts];\n newParts.splice(partIndex, 1, newPart);\n\n const newDocument: KYCDocument = {\n type,\n parts: newParts,\n };\n\n onDocumentChange(newDocument);\n };\n\n const onFileChange = async (partIndex: number, file: File) => {\n if (!file) {\n setLocalErrorByPartIndex(partIndex);\n return;\n }\n\n const part = parts[partIndex] ?? parts[0];\n\n if (!part) {\n return;\n }\n\n const data: string = await getFileBase64(file);\n\n updateDocumentPart(part, partIndex, data);\n\n const newFileNames = new Map<string, string>(fileNames);\n newFileNames.set(data, file.name);\n setFileNames(newFileNames);\n\n deleteLocalErrorByPartIndex(partIndex);\n };\n\n const onFileRemove = (partIndex: number) => {\n const part = parts[partIndex];\n\n if (!part) {\n return;\n }\n\n updateDocumentPart(part, partIndex);\n\n const removedPart = parts[partIndex];\n const newFileNames = new Map<string, string>(fileNames);\n\n if (removedPart?.data && isFileUniqueInDocument(removedPart, parts)) {\n newFileNames.delete(removedPart?.data);\n }\n\n setFileNames(newFileNames);\n\n deleteLocalErrorByPartIndex(partIndex);\n };\n\n const getFileName = (key: string | undefined): string | undefined => {\n if (!key) {\n return undefined;\n }\n\n return fileNames.get(key);\n };\n\n const onFeedbackChange = (partIndex: number, data: string) => {\n const part = parts[partIndex] ?? parts[0];\n\n if (!part) {\n return;\n }\n\n updateDocumentPart(part, partIndex, data);\n };\n\n return (\n <StyledKYCFormItem id={elementId}>\n <StyledKYCFormItemTitle>{`${index + 1}. ${documentLabels?.title}`}</StyledKYCFormItemTitle>\n\n {documentLabels?.description && (\n <StyledKYCFormItemDescription>{documentLabels?.description}</StyledKYCFormItemDescription>\n )}\n\n {parts.map((part, partIndex) => {\n let itemKey = `kyc-form_item_file_${part.type}`;\n\n const isExtraPartAvailable: boolean = isDocumentExtraPartAvailable(type);\n const partLabels: PartLabels | undefined = documentLabelsParts?.[part.type];\n const partTitle = isExtraPartAvailable ? undefined : partLabels?.title;\n\n if (isDocumentExtraPartAvailable(type) && part.data) {\n itemKey = `${itemKey}_${part.data?.substr(-32)}`;\n\n if (!isFileUniqueInDocument(part, parts)) {\n itemKey = `${itemKey}_${partIndex}`;\n }\n }\n\n const partError = errors?.[getErrorKey(index, partIndex)];\n const localPartError = localErrors.get(getErrorKey(index, partIndex));\n\n if (part.type === PartType.Feedback) {\n return (\n <KYCDocumentParts.KYCFormItemText\n key={itemKey}\n value={part.data}\n onFeedbackChange={(value) => onFeedbackChange(partIndex, value)}\n />\n );\n }\n\n return (\n <KYCDocumentParts.KYCFormItemFile\n title={partTitle}\n data={part.data}\n type={part.type}\n name={getFileName(part.data)}\n uploaderLabels={uploaderLabels}\n error={localPartError || partError}\n key={itemKey}\n elementId={`${elementId}_part_${part.type}_${partIndex}`}\n onFileChange={(file) => onFileChange(partIndex, file)}\n onFileRemove={() => onFileRemove(partIndex)}\n />\n );\n })}\n\n {isAddExtraPartAvailable && firstPart && (\n <KYCDocumentParts.KYCFormItemFileExtraPart\n elementId={`${elementId}_extra`}\n title={extraPartTitle}\n uploaderLabels={uploaderLabels}\n onFileAdd={(file) => onFileChange(parts.length, file)}\n />\n )}\n </StyledKYCFormItem>\n );\n};\n\nexport default KYCFormItem;\n","import {gray50, lineHeight, mediumDevices, spacing, successColor} from '@propellerads/stylevariables';\nimport styled from 'styled-components';\n\nconst StyledKYCSucessScreen = styled.div`\n display: flex;\n flex-direction: column;\n`;\n\nconst StyledKYCSucessScreenItem = styled.span`\n margin-bottom: ${spacing * 8}px;\n`;\n\nconst StyledKYCSucessScreenSuppport = styled.span`\n color: ${gray50};\n`;\n\n// The success title, as @propellerads/success-label drew it: a check and the\n// text in the success colour.\nconst StyledKYCSuccessTitle = styled.span`\n display: inline-flex;\n align-items: center;\n gap: ${spacing}px;\n min-height: ${lineHeight}px;\n color: ${successColor};\n\n @media (min-width: ${mediumDevices}px) {\n max-width: 350px;\n white-space: nowrap;\n }\n`;\n\nconst StyledKYCFailScreen = styled.div`\n display: flex;\n flex-direction: column;\n`;\n\nconst StyledKYCFailScreenItem = styled.span`\n margin-bottom: ${spacing * 6}px;\n`;\n\nexport {\n StyledKYCFailScreen,\n StyledKYCFailScreenItem,\n StyledKYCSuccessTitle,\n StyledKYCSucessScreen,\n StyledKYCSucessScreenItem,\n StyledKYCSucessScreenSuppport,\n};\n","import {Check, Color, Size} from '@propellerads/icon';\nimport {\n ACCEPT_FORMATS,\n AVAILABLE_EXTRA_PARTS_DOCUMENTS,\n MAX_EXTRA_PARTS_COUNT,\n MAX_FILE_SIZE,\n PDF_MIME_TYPE,\n} from '../constants';\nimport KYCErrorLabel from '../KYCErrorLabel';\nimport {\n StyledKYCFailScreen,\n StyledKYCFailScreenItem,\n StyledKYCSuccessTitle,\n StyledKYCSucessScreen,\n StyledKYCSucessScreenItem,\n StyledKYCSucessScreenSuppport,\n} from './style';\nimport {KYCFailScreenProps, KYCSuccessScreenProps} from './types';\n\nconst KYCSuccessScreen = (props: KYCSuccessScreenProps) => {\n const {elementId, title, description, support} = props;\n\n return (\n <StyledKYCSucessScreen id={elementId}>\n <StyledKYCSucessScreenItem>\n <StyledKYCSuccessTitle id={`${elementId}_success`} role=\"status\">\n <Check color={Color.Success} size={Size.Small} />\n {title}\n </StyledKYCSuccessTitle>\n </StyledKYCSucessScreenItem>\n\n {description && <StyledKYCSucessScreenItem>{description}</StyledKYCSucessScreenItem>}\n\n {support && <StyledKYCSucessScreenSuppport>{support}</StyledKYCSucessScreenSuppport>}\n </StyledKYCSucessScreen>\n );\n};\n\nconst KYCFailScreen = (props: KYCFailScreenProps) => {\n const {elementId, title, support} = props;\n\n return (\n <StyledKYCFailScreen id={elementId}>\n <StyledKYCFailScreenItem>\n <KYCErrorLabel label={title} isDocumentPartError={false} />\n </StyledKYCFailScreenItem>\n\n {support}\n </StyledKYCFailScreen>\n );\n};\n\nexport default {\n KYCSuccessScreen,\n KYCFailScreen,\n};\n\nexport {ACCEPT_FORMATS, AVAILABLE_EXTRA_PARTS_DOCUMENTS, MAX_EXTRA_PARTS_COUNT, MAX_FILE_SIZE, PDF_MIME_TYPE};\n","import styled from 'styled-components';\nimport {fontNormal, spacing} from '@propellerads/stylevariables';\n\nconst StyledKYCForm = styled.div`\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n width: 100%;\n`;\n\nconst StyledKYCFormTitle = styled.div`\n font-size: ${fontNormal}px;\n`;\n\nconst StyledKYCFormDocuments = styled.div`\n width: 100%;\n margin-bottom: ${spacing * 6}px;\n`;\n\nconst StyledKYCFormButton = styled.div`\n display: flex;\n justify-content: flex-end;\n width: 100%;\n`;\n\nexport {StyledKYCForm, StyledKYCFormTitle, StyledKYCFormDocuments, StyledKYCFormButton};\n","import Button, {ButtonVariant} from '@propellerads/button';\nimport {useEffect, useState} from 'react';\nimport {\n ACCEPT_FORMATS,\n AVAILABLE_EXTRA_PARTS_DOCUMENTS,\n MAX_EXTRA_PARTS_COUNT,\n MAX_FILE_SIZE,\n OPTIONAL_DOCUMENT_PARTS,\n PDF_MIME_TYPE,\n} from './constants';\nimport {DocumentType, KYCDocument, PartType, KYCFile} from './document.types';\nimport KYCFormItem from './KYCFormItem';\nimport KYCStatusScreen from './KYCStatusScreen';\nimport {StyledKYCForm, StyledKYCFormButton, StyledKYCFormDocuments, StyledKYCFormTitle} from './style';\nimport {KYCFormProps} from './types';\n\nconst KYCForm = (props: KYCFormProps) => {\n const {\n elementId,\n title,\n uploadButtonLabel,\n uploaderLabels,\n documentsLabels,\n documents,\n errors,\n isLoading,\n validator,\n onUploadClick,\n } = props;\n\n const [userDocuments, setUserDocuments] = useState<KYCDocument[]>(documents);\n const [isButtonDisabled, setButtonDisabled] = useState<boolean>(true);\n\n useEffect(() => {\n setUserDocuments(documents);\n }, [documents]);\n\n useEffect(() => {\n const isValid: boolean = validator(userDocuments);\n setButtonDisabled(!isValid);\n }, [userDocuments, validator]);\n\n const onDocumentChange = (index: number, document: KYCDocument) => {\n const newDocuments: KYCDocument[] = [...userDocuments];\n newDocuments.splice(index, 1, document);\n\n setUserDocuments(newDocuments);\n };\n\n return (\n <StyledKYCForm id={elementId}>\n {title && <StyledKYCFormTitle>{title}</StyledKYCFormTitle>}\n\n <StyledKYCFormDocuments>\n {userDocuments.map((document, index) => {\n const key = `kyc-form_item_${document.type}_${index}`;\n\n return (\n <KYCFormItem\n index={index}\n type={document.type}\n parts={document.parts}\n documentLabels={documentsLabels[document.type]}\n uploaderLabels={uploaderLabels}\n errors={errors}\n elementId={`${elementId}_item_${document.type}`}\n key={key}\n onDocumentChange={(doc) => onDocumentChange(index, doc)}\n />\n );\n })}\n </StyledKYCFormDocuments>\n <StyledKYCFormButton>\n <Button\n id={`${elementId}_button`}\n variant={ButtonVariant.Primary}\n isDisabled={isButtonDisabled}\n isLoading={isLoading || false}\n onClick={() => onUploadClick(userDocuments)}\n >\n {uploadButtonLabel}\n </Button>\n </StyledKYCFormButton>\n </StyledKYCForm>\n );\n};\n\nKYCForm.SuccessScreen = KYCStatusScreen.KYCSuccessScreen;\nKYCForm.FailScreen = KYCStatusScreen.KYCFailScreen;\n\nexport default KYCForm;\n\nexport {\n ACCEPT_FORMATS,\n AVAILABLE_EXTRA_PARTS_DOCUMENTS,\n DocumentType,\n MAX_EXTRA_PARTS_COUNT,\n MAX_FILE_SIZE,\n OPTIONAL_DOCUMENT_PARTS,\n PartType,\n PDF_MIME_TYPE,\n};\nexport type {KYCDocument, KYCFile};\n"],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@propellerads/kyc-form",
3
- "version": "5.0.3",
3
+ "version": "5.0.5",
4
4
  "type": "module",
5
5
  "types": "dist/index.d.ts",
6
6
  "exports": {
@@ -26,10 +26,9 @@
26
26
  "dependencies": {
27
27
  "@propellerads/button": "^11.0.0",
28
28
  "@propellerads/icon": "^8.0.0",
29
- "@propellerads/image-uploader": "^4.0.0",
30
- "@propellerads/stylevariables": "^2.0.2",
31
- "@propellerads/success-label": "^4.0.1",
32
- "@propellerads/textarea": "^5.0.3"
29
+ "@propellerads/image-uploader": "^4.0.1",
30
+ "@propellerads/input": "^0.1.0",
31
+ "@propellerads/stylevariables": "^2.0.2"
33
32
  },
34
33
  "peerDependencies": {
35
34
  "react": "^18.0.0 || ^19.0.0",