@everymatrix/player-kyc-verification 1.27.5 → 1.27.7

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.
Files changed (11) hide show
  1. package/dist/cjs/player-kyc-verification.cjs.entry.js +27 -18
  2. package/dist/collection/components/player-kyc-verification/player-kyc-verification.js +34 -21
  3. package/dist/components/player-kyc-verification.js +27 -18
  4. package/dist/esm/player-kyc-verification.entry.js +27 -18
  5. package/dist/player-kyc-verification/p-28c876fe.entry.js +1 -0
  6. package/dist/player-kyc-verification/player-kyc-verification.esm.js +1 -1
  7. package/dist/types/Users/dragos.bodea/Documents/everymatrix-prjs/emfe-widgets/widgets-stencil/packages/player-kyc-verification/.stencil/packages/player-kyc-verification/stencil.config.d.ts +2 -0
  8. package/dist/types/components/player-kyc-verification/player-kyc-verification.d.ts +1 -0
  9. package/package.json +1 -1
  10. package/dist/player-kyc-verification/p-c3a42c2a.entry.js +0 -1
  11. package/dist/types/Users/adrian.pripon/Documents/Work/widgets-stencil/packages/player-kyc-verification/.stencil/packages/player-kyc-verification/stencil.config.d.ts +0 -2
package/dist/cjs/player-kyc-verification.cjs.entry.js CHANGED
@@ -370,7 +370,6 @@ const PlayerKycVerificationWidget = class {
370
370
  });
371
371
  }
372
372
  renderVerificationTypeBox(verificationType) {
373
- var _a, _b;
374
373
  if (this.expandedOnDesktop) {
375
374
  verificationType.expanded = true;
376
375
  }
@@ -380,24 +379,34 @@ const PlayerKycVerificationWidget = class {
380
379
  let status = verificationType.status;
381
380
  let documents = verificationType.documents;
382
381
  let flowInfo = verificationType.flowInfo;
383
- //not working yet
384
- if ((flowInfo === null || flowInfo === void 0 ? void 0 : flowInfo.type) === 'Widget') {
385
- this.importScript(flowInfo.url)
386
- .then(() => {
387
- // Script imported successfully
388
- console.log('Script imported correctly');
389
- // Open/show the widget
390
- // You'll need to check the widget documentation for how to open/show it
391
- })
392
- .catch(error => {
393
- // Handle script import error
394
- console.error('Error importing script:', error);
395
- });
396
- }
397
382
  const isVerified = status === 'Verified';
398
383
  const isFailedOrExpired = status === 'Failed' || status === 'Expired';
399
- return (index.h("div", { class: `verification-box ${expanded ? 'expanded' : ''} ${isFailedOrExpired ? 'failed' : ''} ${isVerified ? 'success' : ''}` }, index.h("div", { class: `box box-header ${expanded ? 'expanded' : ''}`, onClick: () => { var _a; return this.toggleVerificationType(verificationType.type, (_a = verificationType.flowInfo) === null || _a === void 0 ? void 0 : _a.type); } }, index.h("div", { class: "box-icon" }, isVerified ? (index.h("div", null, this.verifiedIcon ? (index.h("img", { class: "CustomVerifiedIcon", src: this.verifiedIcon, alt: "" })) : (index.h("svg", { width: "100", height: "100", viewBox: "0 0 100 100", xmlns: "http://www.w3.org/2000/svg" }, index.h("circle", { cx: "50", cy: "50", r: "40", fill: "#388D79" }), index.h("circle", { cx: "50", cy: "50", r: "34", fill: "none", stroke: "#fff", "stroke-width": "12px" }), index.h("polyline", { points: "30,50 45,63 70,35", fill: "none", stroke: "#fff", "stroke-width": "8px" }))))) : (isFailedOrExpired ? (index.h("div", null, this.failedIcon ? (index.h("img", { class: "CustomFailedIcon", src: this.failedIcon, alt: "" })) : (index.h("svg", { width: "100", height: "100", viewBox: "0 0 100 100", xmlns: "http://www.w3.org/2000/svg" }, index.h("circle", { cx: "50", cy: "50", r: "40", fill: "red" }), index.h("line", { x1: "30", y1: "30", x2: "70", y2: "70", stroke: "#fff", "stroke-width": "10px" }), index.h("line", { x1: "30", y1: "70", x2: "70", y2: "30", stroke: "#fff", "stroke-width": "10px" }))))) : (index.h("div", null, this.defaultIcon ? (index.h("img", { class: "CustomDefaultIcon", src: this.defaultIcon, alt: "" })) : (index.h("svg", { width: "800px", height: "800px", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { d: "M4 4V20C4 21.1046 4.89543 22 6 22L18 22C19.1046 22 20 21.1046 20 20V8.34162C20 7.8034 19.7831 7.28789 19.3982 6.91161L14.9579 2.56999C14.5842 2.20459 14.0824 2 13.5597 2L6 2C4.89543 2 4 2.89543 4 4Z", stroke: "#000000", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }), index.h("path", { d: "M9 13H15", stroke: "#000000", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }), index.h("path", { d: "M9 17H12", stroke: "#000000", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }), index.h("path", { d: "M14 2V6C14 7.10457 14.8954 8 16 8H20", stroke: "#000000", "stroke-width": "2", "stroke-linejoin": "round" }))))))), index.h("div", { class: "box-title" }, name), index.h("div", { class: "chevron-icon" }, index.h("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }, index.h("path", { d: expanded ? 'M6 15l6-6 6 6' : 'M6 9l6 6 6-6' })))), expanded && (flowInfo === null || flowInfo === void 0 ? void 0 : flowInfo.type) != 'Widget' ? (index.h("div", { class: "box box-content" }, index.h(index.Fragment, null, isVerified ? (index.h("div", { class: "verification-status" }, translate('verificationComplete', this.language))) : isFailedOrExpired ? (index.h("div", { class: "verification-status" }, status === 'Failed' ? translate('verificationFailed', this.language) : translate('verificationExpired', this.language))) : documents.length > 0 ? (index.h("div", { class: "documents-dropdown" }, index.h("select", { class: "nice-select", onChange: (event) => this.handleOptionChange(event, verificationType.type) }, index.h("option", { value: "", selected: true, disabled: true, hidden: true }, translate('chooseDocument', this.language)), documents.map((document) => (index.h("option", { selected: optionChosen == document.code ? true : false, value: document.code }, document.type.replace(/([A-Z])/g, ' $1'))))), ((_a = documents.find((e) => e.code == optionChosen)) === null || _a === void 0 ? void 0 : _a.statusUploaded) ? (index.h("div", { class: "upload-status" }, (_b = documents.find((e) => e.code == optionChosen)) === null || _b === void 0 ? void 0 : _b.statusUploaded)) : (index.h("div", { class: "upload-button" }, optionChosen ? (index.h("label", null, index.h("input", { type: "file", accept: "*", multiple: true, onChange: ($event) => this.handleFileSelection($event.target.files, this.selectedOption, verificationType.type), style: { display: 'none' } }), index.h("svg", { width: "100", height: "100", xmlns: "http://www.w3.org/2000/svg" }, index.h("circle", { cx: "50", cy: "50", r: "40", fill: "#388D79" }), index.h("line", { x1: "30", y1: "50", x2: "70", y2: "50", stroke: "white", "stroke-width": "6" }), index.h("line", { x1: "50", y1: "30", x2: "50", y2: "70", stroke: "white", "stroke-width": "6" })))) : null)))) : null))) :
400
- index.h("div", { class: "box box-content" }, index.h("div", { id: "__avs-wrapper" }))));
384
+ return (index.h("div", { class: `verification-box ${expanded ? 'expanded' : ''} ${isFailedOrExpired ? 'failed' : ''} ${isVerified ? 'success' : ''}` }, index.h("div", { class: `box box-header ${expanded ? 'expanded' : ''}`, onClick: () => { var _a; return this.toggleVerificationType(verificationType.type, (_a = verificationType.flowInfo) === null || _a === void 0 ? void 0 : _a.type); } }, index.h("div", { class: "box-icon" }, isVerified ? (index.h("div", null, this.verifiedIcon ? (index.h("img", { class: "CustomVerifiedIcon", src: this.verifiedIcon, alt: "" })) : (index.h("svg", { width: "100", height: "100", viewBox: "0 0 100 100", xmlns: "http://www.w3.org/2000/svg" }, index.h("circle", { cx: "50", cy: "50", r: "40", fill: "#388D79" }), index.h("circle", { cx: "50", cy: "50", r: "34", fill: "none", stroke: "#fff", "stroke-width": "12px" }), index.h("polyline", { points: "30,50 45,63 70,35", fill: "none", stroke: "#fff", "stroke-width": "8px" }))))) : (isFailedOrExpired ? (index.h("div", null, this.failedIcon ? (index.h("img", { class: "CustomFailedIcon", src: this.failedIcon, alt: "" })) : (index.h("svg", { width: "100", height: "100", viewBox: "0 0 100 100", xmlns: "http://www.w3.org/2000/svg" }, index.h("circle", { cx: "50", cy: "50", r: "40", fill: "red" }), index.h("line", { x1: "30", y1: "30", x2: "70", y2: "70", stroke: "#fff", "stroke-width": "10px" }), index.h("line", { x1: "30", y1: "70", x2: "70", y2: "30", stroke: "#fff", "stroke-width": "10px" }))))) : (index.h("div", null, this.defaultIcon ? (index.h("img", { class: "CustomDefaultIcon", src: this.defaultIcon, alt: "" })) : (index.h("svg", { width: "800px", height: "800px", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { d: "M4 4V20C4 21.1046 4.89543 22 6 22L18 22C19.1046 22 20 21.1046 20 20V8.34162C20 7.8034 19.7831 7.28789 19.3982 6.91161L14.9579 2.56999C14.5842 2.20459 14.0824 2 13.5597 2L6 2C4.89543 2 4 2.89543 4 4Z", stroke: "#000000", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }), index.h("path", { d: "M9 13H15", stroke: "#000000", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }), index.h("path", { d: "M9 17H12", stroke: "#000000", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }), index.h("path", { d: "M14 2V6C14 7.10457 14.8954 8 16 8H20", stroke: "#000000", "stroke-width": "2", "stroke-linejoin": "round" }))))))), index.h("div", { class: "box-title" }, name), index.h("div", { class: "chevron-icon" }, index.h("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }, index.h("path", { d: expanded ? 'M6 15l6-6 6 6' : 'M6 9l6 6 6-6' })))), expanded ? (this.renderExpandedContent(verificationType, optionChosen, status, documents, flowInfo, isVerified, isFailedOrExpired)) :
385
+ (index.h("div", { class: "box box-content" }, index.h("div", { id: "__avs-wrapper" })))));
386
+ }
387
+ renderExpandedContent(verificationType, optionChosen, status, documents, flowInfo, isVerified, isFailedOrExpired) {
388
+ var _a, _b;
389
+ if ((flowInfo === null || flowInfo === void 0 ? void 0 : flowInfo.type) === 'Widget') {
390
+ return (index.h("div", null, index.h("hr", { style: { margin: '5px' } }), index.h("iframe", { src: flowInfo.url, frameborder: "0", height: "400px", width: "100%", allowfullScreen: true })));
391
+ // comment the functionality under because it might have a different type of script that we might have to handle
392
+ // this.importScript(flowInfo.url)
393
+ // .then(() => {
394
+ // // Script imported successfully
395
+ // console.log('Script imported correctly');
396
+ // // Open/show the widget
397
+ // // You'll need to check the widget documentation for how to open/show it
398
+ // })
399
+ // .catch(error => {
400
+ // // Handle script import error
401
+ // console.error('Error importing script:', error);
402
+ // });
403
+ }
404
+ else if ((flowInfo === null || flowInfo === void 0 ? void 0 : flowInfo.type) === 'Redirect' && verificationType.vendorName !== "Manual") {
405
+ return (index.h("div", null, index.h("hr", { style: { margin: '5px' } }), index.h("iframe", { src: flowInfo.url, frameborder: "0", height: "400px", width: "100%", allowfullScreen: true })));
406
+ }
407
+ else {
408
+ return (index.h("div", { class: "box box-content" }, index.h(index.Fragment, null, isVerified ? (index.h("div", { class: "verification-status" }, translate('verificationComplete', this.language))) : isFailedOrExpired ? (index.h("div", { class: "verification-status" }, status === 'Failed' ? translate('verificationFailed', this.language) : translate('verificationExpired', this.language))) : documents.length > 0 ? (index.h("div", { class: "documents-dropdown" }, index.h("select", { class: "nice-select", onChange: (event) => this.handleOptionChange(event, verificationType.type) }, index.h("option", { value: "", selected: true, disabled: true, hidden: true }, translate('chooseDocument', this.language)), documents.map((doc) => (index.h("option", { selected: optionChosen == doc.code ? true : false, value: doc.code }, doc.type.replace(/([A-Z])/g, ' $1'))))), ((_a = documents.find((e) => e.code == optionChosen)) === null || _a === void 0 ? void 0 : _a.statusUploaded) ? (index.h("div", { class: "upload-status" }, (_b = documents.find((e) => e.code == optionChosen)) === null || _b === void 0 ? void 0 : _b.statusUploaded)) : (index.h("div", { class: "upload-button" }, optionChosen ? (index.h("label", null, index.h("input", { type: "file", accept: "*", multiple: true, onChange: ($event) => this.handleFileSelection($event.target.files, this.selectedOption, verificationType.type), style: { display: 'none' } }), index.h("svg", { width: "100", height: "100", xmlns: "http://www.w3.org/2000/svg" }, index.h("circle", { cx: "50", cy: "50", r: "40", fill: "#388D79" }), index.h("line", { x1: "30", y1: "50", x2: "70", y2: "50", stroke: "white", "stroke-width": "6" }), index.h("line", { x1: "50", y1: "30", x2: "50", y2: "70", stroke: "white", "stroke-width": "6" })))) : null)))) : null)));
409
+ }
401
410
  }
402
411
  render() {
403
412
  if (this.isLoading) {
@@ -408,7 +417,7 @@ const PlayerKycVerificationWidget = class {
408
417
  return index.h("div", { style: { padding: '24px', fontSize: '18px' } }, translate('noVerificationRequired', this.language));
409
418
  }
410
419
  else {
411
- return (index.h("div", { class: "ModalContainer", ref: el => this.stylingContainer = el }, index.h("div", { class: "player-kyc-verification-widget" }, index.h("h2", null, translate('kycTitle', this.language)), index.h("div", { class: "widget-description" }, translate('kycDescription', this.language)), index.h("div", { class: "verification-types" }, this.verificationType.map((verificationType) => verificationType.vendorName === "Manual" || verificationType.vendorName === "Insic" ? this.renderVerificationTypeBox(verificationType) : null)))));
420
+ return (index.h("div", { class: "ModalContainer", ref: el => this.stylingContainer = el }, index.h("div", { class: "player-kyc-verification-widget" }, index.h("h2", null, translate('kycTitle', this.language)), index.h("div", { class: "widget-description" }, translate('kycDescription', this.language)), index.h("div", { class: "verification-types" }, this.verificationType.map((verificationType) => verificationType ? this.renderVerificationTypeBox(verificationType) : null)))));
412
421
  }
413
422
  }
414
423
  }
package/dist/collection/components/player-kyc-verification/player-kyc-verification.js CHANGED
@@ -242,7 +242,6 @@ export class PlayerKycVerificationWidget {
242
242
  });
243
243
  }
244
244
  renderVerificationTypeBox(verificationType) {
245
- var _a, _b;
246
245
  if (this.expandedOnDesktop) {
247
246
  verificationType.expanded = true;
248
247
  }
@@ -252,20 +251,6 @@ export class PlayerKycVerificationWidget {
252
251
  let status = verificationType.status;
253
252
  let documents = verificationType.documents;
254
253
  let flowInfo = verificationType.flowInfo;
255
- //not working yet
256
- if ((flowInfo === null || flowInfo === void 0 ? void 0 : flowInfo.type) === 'Widget') {
257
- this.importScript(flowInfo.url)
258
- .then(() => {
259
- // Script imported successfully
260
- console.log('Script imported correctly');
261
- // Open/show the widget
262
- // You'll need to check the widget documentation for how to open/show it
263
- })
264
- .catch(error => {
265
- // Handle script import error
266
- console.error('Error importing script:', error);
267
- });
268
- }
269
254
  const isVerified = status === 'Verified';
270
255
  const isFailedOrExpired = status === 'Failed' || status === 'Expired';
271
256
  return (h("div", { class: `verification-box ${expanded ? 'expanded' : ''} ${isFailedOrExpired ? 'failed' : ''} ${isVerified ? 'success' : ''}` },
@@ -285,19 +270,47 @@ export class PlayerKycVerificationWidget {
285
270
  h("div", { class: "chevron-icon" },
286
271
  h("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" },
287
272
  h("path", { d: expanded ? 'M6 15l6-6 6 6' : 'M6 9l6 6 6-6' })))),
288
- expanded && (flowInfo === null || flowInfo === void 0 ? void 0 : flowInfo.type) != 'Widget' ? (h("div", { class: "box box-content" },
273
+ expanded ? (this.renderExpandedContent(verificationType, optionChosen, status, documents, flowInfo, isVerified, isFailedOrExpired)) :
274
+ (h("div", { class: "box box-content" },
275
+ h("div", { id: "__avs-wrapper" })))));
276
+ }
277
+ renderExpandedContent(verificationType, optionChosen, status, documents, flowInfo, isVerified, isFailedOrExpired) {
278
+ var _a, _b;
279
+ if ((flowInfo === null || flowInfo === void 0 ? void 0 : flowInfo.type) === 'Widget') {
280
+ return (h("div", null,
281
+ h("hr", { style: { margin: '5px' } }),
282
+ h("iframe", { src: flowInfo.url, frameborder: "0", height: "400px", width: "100%", allowfullScreen: true })));
283
+ // comment the functionality under because it might have a different type of script that we might have to handle
284
+ // this.importScript(flowInfo.url)
285
+ // .then(() => {
286
+ // // Script imported successfully
287
+ // console.log('Script imported correctly');
288
+ // // Open/show the widget
289
+ // // You'll need to check the widget documentation for how to open/show it
290
+ // })
291
+ // .catch(error => {
292
+ // // Handle script import error
293
+ // console.error('Error importing script:', error);
294
+ // });
295
+ }
296
+ else if ((flowInfo === null || flowInfo === void 0 ? void 0 : flowInfo.type) === 'Redirect' && verificationType.vendorName !== "Manual") {
297
+ return (h("div", null,
298
+ h("hr", { style: { margin: '5px' } }),
299
+ h("iframe", { src: flowInfo.url, frameborder: "0", height: "400px", width: "100%", allowfullScreen: true })));
300
+ }
301
+ else {
302
+ return (h("div", { class: "box box-content" },
289
303
  h(Fragment, null, isVerified ? (h("div", { class: "verification-status" }, translate('verificationComplete', this.language))) : isFailedOrExpired ? (h("div", { class: "verification-status" }, status === 'Failed' ? translate('verificationFailed', this.language) : translate('verificationExpired', this.language))) : documents.length > 0 ? (h("div", { class: "documents-dropdown" },
290
304
  h("select", { class: "nice-select", onChange: (event) => this.handleOptionChange(event, verificationType.type) },
291
305
  h("option", { value: "", selected: true, disabled: true, hidden: true }, translate('chooseDocument', this.language)),
292
- documents.map((document) => (h("option", { selected: optionChosen == document.code ? true : false, value: document.code }, document.type.replace(/([A-Z])/g, ' $1'))))),
306
+ documents.map((doc) => (h("option", { selected: optionChosen == doc.code ? true : false, value: doc.code }, doc.type.replace(/([A-Z])/g, ' $1'))))),
293
307
  ((_a = documents.find((e) => e.code == optionChosen)) === null || _a === void 0 ? void 0 : _a.statusUploaded) ? (h("div", { class: "upload-status" }, (_b = documents.find((e) => e.code == optionChosen)) === null || _b === void 0 ? void 0 : _b.statusUploaded)) : (h("div", { class: "upload-button" }, optionChosen ? (h("label", null,
294
308
  h("input", { type: "file", accept: "*", multiple: true, onChange: ($event) => this.handleFileSelection($event.target.files, this.selectedOption, verificationType.type), style: { display: 'none' } }),
295
309
  h("svg", { width: "100", height: "100", xmlns: "http://www.w3.org/2000/svg" },
296
310
  h("circle", { cx: "50", cy: "50", r: "40", fill: "#388D79" }),
297
311
  h("line", { x1: "30", y1: "50", x2: "70", y2: "50", stroke: "white", "stroke-width": "6" }),
298
- h("line", { x1: "50", y1: "30", x2: "50", y2: "70", stroke: "white", "stroke-width": "6" })))) : null)))) : null))) :
299
- h("div", { class: "box box-content" },
300
- h("div", { id: "__avs-wrapper" }))));
312
+ h("line", { x1: "50", y1: "30", x2: "50", y2: "70", stroke: "white", "stroke-width": "6" })))) : null)))) : null)));
313
+ }
301
314
  }
302
315
  render() {
303
316
  if (this.isLoading) {
@@ -313,7 +326,7 @@ export class PlayerKycVerificationWidget {
313
326
  h("div", { class: "player-kyc-verification-widget" },
314
327
  h("h2", null, translate('kycTitle', this.language)),
315
328
  h("div", { class: "widget-description" }, translate('kycDescription', this.language)),
316
- h("div", { class: "verification-types" }, this.verificationType.map((verificationType) => verificationType.vendorName === "Manual" || verificationType.vendorName === "Insic" ? this.renderVerificationTypeBox(verificationType) : null)))));
329
+ h("div", { class: "verification-types" }, this.verificationType.map((verificationType) => verificationType ? this.renderVerificationTypeBox(verificationType) : null)))));
317
330
  }
318
331
  }
319
332
  }
package/dist/components/player-kyc-verification.js CHANGED
@@ -368,7 +368,6 @@ const PlayerKycVerificationWidget = /*@__PURE__*/ proxyCustomElement(class exten
368
368
  });
369
369
  }
370
370
  renderVerificationTypeBox(verificationType) {
371
- var _a, _b;
372
371
  if (this.expandedOnDesktop) {
373
372
  verificationType.expanded = true;
374
373
  }
@@ -378,24 +377,34 @@ const PlayerKycVerificationWidget = /*@__PURE__*/ proxyCustomElement(class exten
378
377
  let status = verificationType.status;
379
378
  let documents = verificationType.documents;
380
379
  let flowInfo = verificationType.flowInfo;
381
- //not working yet
382
- if ((flowInfo === null || flowInfo === void 0 ? void 0 : flowInfo.type) === 'Widget') {
383
- this.importScript(flowInfo.url)
384
- .then(() => {
385
- // Script imported successfully
386
- console.log('Script imported correctly');
387
- // Open/show the widget
388
- // You'll need to check the widget documentation for how to open/show it
389
- })
390
- .catch(error => {
391
- // Handle script import error
392
- console.error('Error importing script:', error);
393
- });
394
- }
395
380
  const isVerified = status === 'Verified';
396
381
  const isFailedOrExpired = status === 'Failed' || status === 'Expired';
397
- return (h("div", { class: `verification-box ${expanded ? 'expanded' : ''} ${isFailedOrExpired ? 'failed' : ''} ${isVerified ? 'success' : ''}` }, h("div", { class: `box box-header ${expanded ? 'expanded' : ''}`, onClick: () => { var _a; return this.toggleVerificationType(verificationType.type, (_a = verificationType.flowInfo) === null || _a === void 0 ? void 0 : _a.type); } }, h("div", { class: "box-icon" }, isVerified ? (h("div", null, this.verifiedIcon ? (h("img", { class: "CustomVerifiedIcon", src: this.verifiedIcon, alt: "" })) : (h("svg", { width: "100", height: "100", viewBox: "0 0 100 100", xmlns: "http://www.w3.org/2000/svg" }, h("circle", { cx: "50", cy: "50", r: "40", fill: "#388D79" }), h("circle", { cx: "50", cy: "50", r: "34", fill: "none", stroke: "#fff", "stroke-width": "12px" }), h("polyline", { points: "30,50 45,63 70,35", fill: "none", stroke: "#fff", "stroke-width": "8px" }))))) : (isFailedOrExpired ? (h("div", null, this.failedIcon ? (h("img", { class: "CustomFailedIcon", src: this.failedIcon, alt: "" })) : (h("svg", { width: "100", height: "100", viewBox: "0 0 100 100", xmlns: "http://www.w3.org/2000/svg" }, h("circle", { cx: "50", cy: "50", r: "40", fill: "red" }), h("line", { x1: "30", y1: "30", x2: "70", y2: "70", stroke: "#fff", "stroke-width": "10px" }), h("line", { x1: "30", y1: "70", x2: "70", y2: "30", stroke: "#fff", "stroke-width": "10px" }))))) : (h("div", null, this.defaultIcon ? (h("img", { class: "CustomDefaultIcon", src: this.defaultIcon, alt: "" })) : (h("svg", { width: "800px", height: "800px", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M4 4V20C4 21.1046 4.89543 22 6 22L18 22C19.1046 22 20 21.1046 20 20V8.34162C20 7.8034 19.7831 7.28789 19.3982 6.91161L14.9579 2.56999C14.5842 2.20459 14.0824 2 13.5597 2L6 2C4.89543 2 4 2.89543 4 4Z", stroke: "#000000", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { d: "M9 13H15", stroke: "#000000", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { d: "M9 17H12", stroke: "#000000", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { d: "M14 2V6C14 7.10457 14.8954 8 16 8H20", stroke: "#000000", "stroke-width": "2", "stroke-linejoin": "round" }))))))), h("div", { class: "box-title" }, name), h("div", { class: "chevron-icon" }, h("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }, h("path", { d: expanded ? 'M6 15l6-6 6 6' : 'M6 9l6 6 6-6' })))), expanded && (flowInfo === null || flowInfo === void 0 ? void 0 : flowInfo.type) != 'Widget' ? (h("div", { class: "box box-content" }, h(Fragment, null, isVerified ? (h("div", { class: "verification-status" }, translate('verificationComplete', this.language))) : isFailedOrExpired ? (h("div", { class: "verification-status" }, status === 'Failed' ? translate('verificationFailed', this.language) : translate('verificationExpired', this.language))) : documents.length > 0 ? (h("div", { class: "documents-dropdown" }, h("select", { class: "nice-select", onChange: (event) => this.handleOptionChange(event, verificationType.type) }, h("option", { value: "", selected: true, disabled: true, hidden: true }, translate('chooseDocument', this.language)), documents.map((document) => (h("option", { selected: optionChosen == document.code ? true : false, value: document.code }, document.type.replace(/([A-Z])/g, ' $1'))))), ((_a = documents.find((e) => e.code == optionChosen)) === null || _a === void 0 ? void 0 : _a.statusUploaded) ? (h("div", { class: "upload-status" }, (_b = documents.find((e) => e.code == optionChosen)) === null || _b === void 0 ? void 0 : _b.statusUploaded)) : (h("div", { class: "upload-button" }, optionChosen ? (h("label", null, h("input", { type: "file", accept: "*", multiple: true, onChange: ($event) => this.handleFileSelection($event.target.files, this.selectedOption, verificationType.type), style: { display: 'none' } }), h("svg", { width: "100", height: "100", xmlns: "http://www.w3.org/2000/svg" }, h("circle", { cx: "50", cy: "50", r: "40", fill: "#388D79" }), h("line", { x1: "30", y1: "50", x2: "70", y2: "50", stroke: "white", "stroke-width": "6" }), h("line", { x1: "50", y1: "30", x2: "50", y2: "70", stroke: "white", "stroke-width": "6" })))) : null)))) : null))) :
398
- h("div", { class: "box box-content" }, h("div", { id: "__avs-wrapper" }))));
382
+ return (h("div", { class: `verification-box ${expanded ? 'expanded' : ''} ${isFailedOrExpired ? 'failed' : ''} ${isVerified ? 'success' : ''}` }, h("div", { class: `box box-header ${expanded ? 'expanded' : ''}`, onClick: () => { var _a; return this.toggleVerificationType(verificationType.type, (_a = verificationType.flowInfo) === null || _a === void 0 ? void 0 : _a.type); } }, h("div", { class: "box-icon" }, isVerified ? (h("div", null, this.verifiedIcon ? (h("img", { class: "CustomVerifiedIcon", src: this.verifiedIcon, alt: "" })) : (h("svg", { width: "100", height: "100", viewBox: "0 0 100 100", xmlns: "http://www.w3.org/2000/svg" }, h("circle", { cx: "50", cy: "50", r: "40", fill: "#388D79" }), h("circle", { cx: "50", cy: "50", r: "34", fill: "none", stroke: "#fff", "stroke-width": "12px" }), h("polyline", { points: "30,50 45,63 70,35", fill: "none", stroke: "#fff", "stroke-width": "8px" }))))) : (isFailedOrExpired ? (h("div", null, this.failedIcon ? (h("img", { class: "CustomFailedIcon", src: this.failedIcon, alt: "" })) : (h("svg", { width: "100", height: "100", viewBox: "0 0 100 100", xmlns: "http://www.w3.org/2000/svg" }, h("circle", { cx: "50", cy: "50", r: "40", fill: "red" }), h("line", { x1: "30", y1: "30", x2: "70", y2: "70", stroke: "#fff", "stroke-width": "10px" }), h("line", { x1: "30", y1: "70", x2: "70", y2: "30", stroke: "#fff", "stroke-width": "10px" }))))) : (h("div", null, this.defaultIcon ? (h("img", { class: "CustomDefaultIcon", src: this.defaultIcon, alt: "" })) : (h("svg", { width: "800px", height: "800px", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M4 4V20C4 21.1046 4.89543 22 6 22L18 22C19.1046 22 20 21.1046 20 20V8.34162C20 7.8034 19.7831 7.28789 19.3982 6.91161L14.9579 2.56999C14.5842 2.20459 14.0824 2 13.5597 2L6 2C4.89543 2 4 2.89543 4 4Z", stroke: "#000000", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { d: "M9 13H15", stroke: "#000000", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { d: "M9 17H12", stroke: "#000000", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { d: "M14 2V6C14 7.10457 14.8954 8 16 8H20", stroke: "#000000", "stroke-width": "2", "stroke-linejoin": "round" }))))))), h("div", { class: "box-title" }, name), h("div", { class: "chevron-icon" }, h("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }, h("path", { d: expanded ? 'M6 15l6-6 6 6' : 'M6 9l6 6 6-6' })))), expanded ? (this.renderExpandedContent(verificationType, optionChosen, status, documents, flowInfo, isVerified, isFailedOrExpired)) :
383
+ (h("div", { class: "box box-content" }, h("div", { id: "__avs-wrapper" })))));
384
+ }
385
+ renderExpandedContent(verificationType, optionChosen, status, documents, flowInfo, isVerified, isFailedOrExpired) {
386
+ var _a, _b;
387
+ if ((flowInfo === null || flowInfo === void 0 ? void 0 : flowInfo.type) === 'Widget') {
388
+ return (h("div", null, h("hr", { style: { margin: '5px' } }), h("iframe", { src: flowInfo.url, frameborder: "0", height: "400px", width: "100%", allowfullScreen: true })));
389
+ // comment the functionality under because it might have a different type of script that we might have to handle
390
+ // this.importScript(flowInfo.url)
391
+ // .then(() => {
392
+ // // Script imported successfully
393
+ // console.log('Script imported correctly');
394
+ // // Open/show the widget
395
+ // // You'll need to check the widget documentation for how to open/show it
396
+ // })
397
+ // .catch(error => {
398
+ // // Handle script import error
399
+ // console.error('Error importing script:', error);
400
+ // });
401
+ }
402
+ else if ((flowInfo === null || flowInfo === void 0 ? void 0 : flowInfo.type) === 'Redirect' && verificationType.vendorName !== "Manual") {
403
+ return (h("div", null, h("hr", { style: { margin: '5px' } }), h("iframe", { src: flowInfo.url, frameborder: "0", height: "400px", width: "100%", allowfullScreen: true })));
404
+ }
405
+ else {
406
+ return (h("div", { class: "box box-content" }, h(Fragment, null, isVerified ? (h("div", { class: "verification-status" }, translate('verificationComplete', this.language))) : isFailedOrExpired ? (h("div", { class: "verification-status" }, status === 'Failed' ? translate('verificationFailed', this.language) : translate('verificationExpired', this.language))) : documents.length > 0 ? (h("div", { class: "documents-dropdown" }, h("select", { class: "nice-select", onChange: (event) => this.handleOptionChange(event, verificationType.type) }, h("option", { value: "", selected: true, disabled: true, hidden: true }, translate('chooseDocument', this.language)), documents.map((doc) => (h("option", { selected: optionChosen == doc.code ? true : false, value: doc.code }, doc.type.replace(/([A-Z])/g, ' $1'))))), ((_a = documents.find((e) => e.code == optionChosen)) === null || _a === void 0 ? void 0 : _a.statusUploaded) ? (h("div", { class: "upload-status" }, (_b = documents.find((e) => e.code == optionChosen)) === null || _b === void 0 ? void 0 : _b.statusUploaded)) : (h("div", { class: "upload-button" }, optionChosen ? (h("label", null, h("input", { type: "file", accept: "*", multiple: true, onChange: ($event) => this.handleFileSelection($event.target.files, this.selectedOption, verificationType.type), style: { display: 'none' } }), h("svg", { width: "100", height: "100", xmlns: "http://www.w3.org/2000/svg" }, h("circle", { cx: "50", cy: "50", r: "40", fill: "#388D79" }), h("line", { x1: "30", y1: "50", x2: "70", y2: "50", stroke: "white", "stroke-width": "6" }), h("line", { x1: "50", y1: "30", x2: "50", y2: "70", stroke: "white", "stroke-width": "6" })))) : null)))) : null)));
407
+ }
399
408
  }
400
409
  render() {
401
410
  if (this.isLoading) {
@@ -406,7 +415,7 @@ const PlayerKycVerificationWidget = /*@__PURE__*/ proxyCustomElement(class exten
406
415
  return h("div", { style: { padding: '24px', fontSize: '18px' } }, translate('noVerificationRequired', this.language));
407
416
  }
408
417
  else {
409
- return (h("div", { class: "ModalContainer", ref: el => this.stylingContainer = el }, h("div", { class: "player-kyc-verification-widget" }, h("h2", null, translate('kycTitle', this.language)), h("div", { class: "widget-description" }, translate('kycDescription', this.language)), h("div", { class: "verification-types" }, this.verificationType.map((verificationType) => verificationType.vendorName === "Manual" || verificationType.vendorName === "Insic" ? this.renderVerificationTypeBox(verificationType) : null)))));
418
+ return (h("div", { class: "ModalContainer", ref: el => this.stylingContainer = el }, h("div", { class: "player-kyc-verification-widget" }, h("h2", null, translate('kycTitle', this.language)), h("div", { class: "widget-description" }, translate('kycDescription', this.language)), h("div", { class: "verification-types" }, this.verificationType.map((verificationType) => verificationType ? this.renderVerificationTypeBox(verificationType) : null)))));
410
419
  }
411
420
  }
412
421
  }
package/dist/esm/player-kyc-verification.entry.js CHANGED
@@ -366,7 +366,6 @@ const PlayerKycVerificationWidget = class {
366
366
  });
367
367
  }
368
368
  renderVerificationTypeBox(verificationType) {
369
- var _a, _b;
370
369
  if (this.expandedOnDesktop) {
371
370
  verificationType.expanded = true;
372
371
  }
@@ -376,24 +375,34 @@ const PlayerKycVerificationWidget = class {
376
375
  let status = verificationType.status;
377
376
  let documents = verificationType.documents;
378
377
  let flowInfo = verificationType.flowInfo;
379
- //not working yet
380
- if ((flowInfo === null || flowInfo === void 0 ? void 0 : flowInfo.type) === 'Widget') {
381
- this.importScript(flowInfo.url)
382
- .then(() => {
383
- // Script imported successfully
384
- console.log('Script imported correctly');
385
- // Open/show the widget
386
- // You'll need to check the widget documentation for how to open/show it
387
- })
388
- .catch(error => {
389
- // Handle script import error
390
- console.error('Error importing script:', error);
391
- });
392
- }
393
378
  const isVerified = status === 'Verified';
394
379
  const isFailedOrExpired = status === 'Failed' || status === 'Expired';
395
- return (h("div", { class: `verification-box ${expanded ? 'expanded' : ''} ${isFailedOrExpired ? 'failed' : ''} ${isVerified ? 'success' : ''}` }, h("div", { class: `box box-header ${expanded ? 'expanded' : ''}`, onClick: () => { var _a; return this.toggleVerificationType(verificationType.type, (_a = verificationType.flowInfo) === null || _a === void 0 ? void 0 : _a.type); } }, h("div", { class: "box-icon" }, isVerified ? (h("div", null, this.verifiedIcon ? (h("img", { class: "CustomVerifiedIcon", src: this.verifiedIcon, alt: "" })) : (h("svg", { width: "100", height: "100", viewBox: "0 0 100 100", xmlns: "http://www.w3.org/2000/svg" }, h("circle", { cx: "50", cy: "50", r: "40", fill: "#388D79" }), h("circle", { cx: "50", cy: "50", r: "34", fill: "none", stroke: "#fff", "stroke-width": "12px" }), h("polyline", { points: "30,50 45,63 70,35", fill: "none", stroke: "#fff", "stroke-width": "8px" }))))) : (isFailedOrExpired ? (h("div", null, this.failedIcon ? (h("img", { class: "CustomFailedIcon", src: this.failedIcon, alt: "" })) : (h("svg", { width: "100", height: "100", viewBox: "0 0 100 100", xmlns: "http://www.w3.org/2000/svg" }, h("circle", { cx: "50", cy: "50", r: "40", fill: "red" }), h("line", { x1: "30", y1: "30", x2: "70", y2: "70", stroke: "#fff", "stroke-width": "10px" }), h("line", { x1: "30", y1: "70", x2: "70", y2: "30", stroke: "#fff", "stroke-width": "10px" }))))) : (h("div", null, this.defaultIcon ? (h("img", { class: "CustomDefaultIcon", src: this.defaultIcon, alt: "" })) : (h("svg", { width: "800px", height: "800px", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M4 4V20C4 21.1046 4.89543 22 6 22L18 22C19.1046 22 20 21.1046 20 20V8.34162C20 7.8034 19.7831 7.28789 19.3982 6.91161L14.9579 2.56999C14.5842 2.20459 14.0824 2 13.5597 2L6 2C4.89543 2 4 2.89543 4 4Z", stroke: "#000000", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { d: "M9 13H15", stroke: "#000000", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { d: "M9 17H12", stroke: "#000000", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { d: "M14 2V6C14 7.10457 14.8954 8 16 8H20", stroke: "#000000", "stroke-width": "2", "stroke-linejoin": "round" }))))))), h("div", { class: "box-title" }, name), h("div", { class: "chevron-icon" }, h("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }, h("path", { d: expanded ? 'M6 15l6-6 6 6' : 'M6 9l6 6 6-6' })))), expanded && (flowInfo === null || flowInfo === void 0 ? void 0 : flowInfo.type) != 'Widget' ? (h("div", { class: "box box-content" }, h(Fragment, null, isVerified ? (h("div", { class: "verification-status" }, translate('verificationComplete', this.language))) : isFailedOrExpired ? (h("div", { class: "verification-status" }, status === 'Failed' ? translate('verificationFailed', this.language) : translate('verificationExpired', this.language))) : documents.length > 0 ? (h("div", { class: "documents-dropdown" }, h("select", { class: "nice-select", onChange: (event) => this.handleOptionChange(event, verificationType.type) }, h("option", { value: "", selected: true, disabled: true, hidden: true }, translate('chooseDocument', this.language)), documents.map((document) => (h("option", { selected: optionChosen == document.code ? true : false, value: document.code }, document.type.replace(/([A-Z])/g, ' $1'))))), ((_a = documents.find((e) => e.code == optionChosen)) === null || _a === void 0 ? void 0 : _a.statusUploaded) ? (h("div", { class: "upload-status" }, (_b = documents.find((e) => e.code == optionChosen)) === null || _b === void 0 ? void 0 : _b.statusUploaded)) : (h("div", { class: "upload-button" }, optionChosen ? (h("label", null, h("input", { type: "file", accept: "*", multiple: true, onChange: ($event) => this.handleFileSelection($event.target.files, this.selectedOption, verificationType.type), style: { display: 'none' } }), h("svg", { width: "100", height: "100", xmlns: "http://www.w3.org/2000/svg" }, h("circle", { cx: "50", cy: "50", r: "40", fill: "#388D79" }), h("line", { x1: "30", y1: "50", x2: "70", y2: "50", stroke: "white", "stroke-width": "6" }), h("line", { x1: "50", y1: "30", x2: "50", y2: "70", stroke: "white", "stroke-width": "6" })))) : null)))) : null))) :
396
- h("div", { class: "box box-content" }, h("div", { id: "__avs-wrapper" }))));
380
+ return (h("div", { class: `verification-box ${expanded ? 'expanded' : ''} ${isFailedOrExpired ? 'failed' : ''} ${isVerified ? 'success' : ''}` }, h("div", { class: `box box-header ${expanded ? 'expanded' : ''}`, onClick: () => { var _a; return this.toggleVerificationType(verificationType.type, (_a = verificationType.flowInfo) === null || _a === void 0 ? void 0 : _a.type); } }, h("div", { class: "box-icon" }, isVerified ? (h("div", null, this.verifiedIcon ? (h("img", { class: "CustomVerifiedIcon", src: this.verifiedIcon, alt: "" })) : (h("svg", { width: "100", height: "100", viewBox: "0 0 100 100", xmlns: "http://www.w3.org/2000/svg" }, h("circle", { cx: "50", cy: "50", r: "40", fill: "#388D79" }), h("circle", { cx: "50", cy: "50", r: "34", fill: "none", stroke: "#fff", "stroke-width": "12px" }), h("polyline", { points: "30,50 45,63 70,35", fill: "none", stroke: "#fff", "stroke-width": "8px" }))))) : (isFailedOrExpired ? (h("div", null, this.failedIcon ? (h("img", { class: "CustomFailedIcon", src: this.failedIcon, alt: "" })) : (h("svg", { width: "100", height: "100", viewBox: "0 0 100 100", xmlns: "http://www.w3.org/2000/svg" }, h("circle", { cx: "50", cy: "50", r: "40", fill: "red" }), h("line", { x1: "30", y1: "30", x2: "70", y2: "70", stroke: "#fff", "stroke-width": "10px" }), h("line", { x1: "30", y1: "70", x2: "70", y2: "30", stroke: "#fff", "stroke-width": "10px" }))))) : (h("div", null, this.defaultIcon ? (h("img", { class: "CustomDefaultIcon", src: this.defaultIcon, alt: "" })) : (h("svg", { width: "800px", height: "800px", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M4 4V20C4 21.1046 4.89543 22 6 22L18 22C19.1046 22 20 21.1046 20 20V8.34162C20 7.8034 19.7831 7.28789 19.3982 6.91161L14.9579 2.56999C14.5842 2.20459 14.0824 2 13.5597 2L6 2C4.89543 2 4 2.89543 4 4Z", stroke: "#000000", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { d: "M9 13H15", stroke: "#000000", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { d: "M9 17H12", stroke: "#000000", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { d: "M14 2V6C14 7.10457 14.8954 8 16 8H20", stroke: "#000000", "stroke-width": "2", "stroke-linejoin": "round" }))))))), h("div", { class: "box-title" }, name), h("div", { class: "chevron-icon" }, h("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }, h("path", { d: expanded ? 'M6 15l6-6 6 6' : 'M6 9l6 6 6-6' })))), expanded ? (this.renderExpandedContent(verificationType, optionChosen, status, documents, flowInfo, isVerified, isFailedOrExpired)) :
381
+ (h("div", { class: "box box-content" }, h("div", { id: "__avs-wrapper" })))));
382
+ }
383
+ renderExpandedContent(verificationType, optionChosen, status, documents, flowInfo, isVerified, isFailedOrExpired) {
384
+ var _a, _b;
385
+ if ((flowInfo === null || flowInfo === void 0 ? void 0 : flowInfo.type) === 'Widget') {
386
+ return (h("div", null, h("hr", { style: { margin: '5px' } }), h("iframe", { src: flowInfo.url, frameborder: "0", height: "400px", width: "100%", allowfullScreen: true })));
387
+ // comment the functionality under because it might have a different type of script that we might have to handle
388
+ // this.importScript(flowInfo.url)
389
+ // .then(() => {
390
+ // // Script imported successfully
391
+ // console.log('Script imported correctly');
392
+ // // Open/show the widget
393
+ // // You'll need to check the widget documentation for how to open/show it
394
+ // })
395
+ // .catch(error => {
396
+ // // Handle script import error
397
+ // console.error('Error importing script:', error);
398
+ // });
399
+ }
400
+ else if ((flowInfo === null || flowInfo === void 0 ? void 0 : flowInfo.type) === 'Redirect' && verificationType.vendorName !== "Manual") {
401
+ return (h("div", null, h("hr", { style: { margin: '5px' } }), h("iframe", { src: flowInfo.url, frameborder: "0", height: "400px", width: "100%", allowfullScreen: true })));
402
+ }
403
+ else {
404
+ return (h("div", { class: "box box-content" }, h(Fragment, null, isVerified ? (h("div", { class: "verification-status" }, translate('verificationComplete', this.language))) : isFailedOrExpired ? (h("div", { class: "verification-status" }, status === 'Failed' ? translate('verificationFailed', this.language) : translate('verificationExpired', this.language))) : documents.length > 0 ? (h("div", { class: "documents-dropdown" }, h("select", { class: "nice-select", onChange: (event) => this.handleOptionChange(event, verificationType.type) }, h("option", { value: "", selected: true, disabled: true, hidden: true }, translate('chooseDocument', this.language)), documents.map((doc) => (h("option", { selected: optionChosen == doc.code ? true : false, value: doc.code }, doc.type.replace(/([A-Z])/g, ' $1'))))), ((_a = documents.find((e) => e.code == optionChosen)) === null || _a === void 0 ? void 0 : _a.statusUploaded) ? (h("div", { class: "upload-status" }, (_b = documents.find((e) => e.code == optionChosen)) === null || _b === void 0 ? void 0 : _b.statusUploaded)) : (h("div", { class: "upload-button" }, optionChosen ? (h("label", null, h("input", { type: "file", accept: "*", multiple: true, onChange: ($event) => this.handleFileSelection($event.target.files, this.selectedOption, verificationType.type), style: { display: 'none' } }), h("svg", { width: "100", height: "100", xmlns: "http://www.w3.org/2000/svg" }, h("circle", { cx: "50", cy: "50", r: "40", fill: "#388D79" }), h("line", { x1: "30", y1: "50", x2: "70", y2: "50", stroke: "white", "stroke-width": "6" }), h("line", { x1: "50", y1: "30", x2: "50", y2: "70", stroke: "white", "stroke-width": "6" })))) : null)))) : null)));
405
+ }
397
406
  }
398
407
  render() {
399
408
  if (this.isLoading) {
@@ -404,7 +413,7 @@ const PlayerKycVerificationWidget = class {
404
413
  return h("div", { style: { padding: '24px', fontSize: '18px' } }, translate('noVerificationRequired', this.language));
405
414
  }
406
415
  else {
407
- return (h("div", { class: "ModalContainer", ref: el => this.stylingContainer = el }, h("div", { class: "player-kyc-verification-widget" }, h("h2", null, translate('kycTitle', this.language)), h("div", { class: "widget-description" }, translate('kycDescription', this.language)), h("div", { class: "verification-types" }, this.verificationType.map((verificationType) => verificationType.vendorName === "Manual" || verificationType.vendorName === "Insic" ? this.renderVerificationTypeBox(verificationType) : null)))));
416
+ return (h("div", { class: "ModalContainer", ref: el => this.stylingContainer = el }, h("div", { class: "player-kyc-verification-widget" }, h("h2", null, translate('kycTitle', this.language)), h("div", { class: "widget-description" }, translate('kycDescription', this.language)), h("div", { class: "verification-types" }, this.verificationType.map((verificationType) => verificationType ? this.renderVerificationTypeBox(verificationType) : null)))));
408
417
  }
409
418
  }
410
419
  }
package/dist/player-kyc-verification/p-28c876fe.entry.js ADDED
@@ -0,0 +1 @@
1
+ import{r as e,h as i,F as t}from"./p-1f2596d0.js";const n=["de","en","hr"];let o={en:{loading:"Loading, please wait ...",noVerificationRequired:"There is no verification required for your account at this moment.",verificationComplete:"Verification complete",verificationFailed:"Verification failed",verificationExpired:"Verification expired",fileSizeExceeded:"Maximum file size exceeded. Max file size is: 50mb",uploading:"Uploading ... ",successUpload:"Your document has been uploaded and it will be reviewed shortly",successUploadMultipleFiles:"Your documents have been uploaded and it will be reviewed shortly",failedUpload:"Upload failed please try again",chooseDocument:"Choose Document",kycTitle:"Account Verification",kycDescription:"We require some documents to protect your account and to comply with legal and license requirements."},de:{loading:"Loading, please wait ...",noVerificationRequired:"There is no verification required for your account at this moment.",verificationComplete:"Verification complete",verificationFailed:"Verification failed",verificationExpired:"Verification expired",fileSizeExceeded:"Maximum file size exceeded. Max file size is: 50mb",uploading:"Uploading ... ",successUpload:"Your document has been uploaded and it will be reviewed shortly",successUploadMultipleFiles:"Your documents have been uploaded and it will be reviewed shortly",failedUpload:"Upload failed please try again",chooseDocument:"Choose Document",kycTitle:"Account-Verifizierung",kycDescription:"Wir benötigen einige Dokumente, um Ihr Konto zu schützen und den rechtlichen und Lizenzanforderungen zu entsprechen."},ro:{loading:"Loading, please wait ...",noVerificationRequired:"There is no verification required for your account at this moment.",verificationComplete:"Verification complete",verificationFailed:"Verification failed",verificationExpired:"Verification expired",fileSizeExceeded:"Maximum file size exceeded. Max file size is: 50mb",uploading:"Uploading ... ",successUpload:"Your document has been uploaded and it will be reviewed shortly",successUploadMultipleFiles:"Your documents have been uploaded and it will be reviewed shortly",failedUpload:"Upload failed please try again",chooseDocument:"Choose Document",kycTitle:"Verificarea contului",kycDescription:"Avem nevoie de câteva documente pentru a proteja contul dvs. și pentru a respecta cerințele legale și de licență."},fr:{loading:"Loading, please wait ...",noVerificationRequired:"There is no verification required for your account at this moment.",verificationComplete:"Verification complete",verificationFailed:"Verification failed",verificationExpired:"Verification expired",fileSizeExceeded:"Maximum file size exceeded. Max file size is: 50mb",uploading:"Uploading ... ",successUpload:"Your document has been uploaded and it will be reviewed shortly",successUploadMultipleFiles:"Your documents have been uploaded and it will be reviewed shortly",failedUpload:"Upload failed please try again",chooseDocument:"Choose Document",kycTitle:"Vérification de compte",kycDescription:"Nous avons besoin de certains documents pour protéger votre compte et pour nous conformer aux exigences légales et de licence."},ar:{loading:"Loading, please wait ...",noVerificationRequired:"There is no verification required for your account at this moment.",verificationComplete:"Verification complete",verificationFailed:"Verification failed",verificationExpired:"Verification expired",fileSizeExceeded:"Maximum file size exceeded. Max file size is: 50mb",uploading:"Uploading ... ",successUpload:"Your document has been uploaded and it will be reviewed shortly",successUploadMultipleFiles:"Your documents have been uploaded and it will be reviewed shortly",failedUpload:"Upload failed please try again",chooseDocument:"Choose Document",kycTitle:"التحقق من الحساب",kycDescription:"نحتاج إلى بعض الوثائق لحماية حسابك والامتثال للمتطلبات القانونية والترخيص."},hr:{loading:"Učitavanje, molimo pričekajte ...",noVerificationRequired:"Trenutačno nije potrebna provjera vašeg računa.",verificationComplete:"Provjera dovršena",verificationFailed:"Provjera nije uspjela",verificationExpired:"Provjera je istekla",fileSizeExceeded:"Premašena je maksimalna veličina datoteke. Maksimalna veličina datoteke je: 50mb",uploading:"Prijenos…",successUpload:"Vaš dokument je učitan i uskoro će biti pregledan",successUploadMultipleFiles:"Vaši su dokumenti učitani i uskoro će biti pregledani",failedUpload:"Prijenos nije uspio pokušajte ponovo",chooseDocument:"Odaberite Dokument",kycTitle:"Verifikacija računa",kycDescription:"Potrebni su nam neki dokumenti kako bismo zaštitili vaš račun i kako bismo se pridržavali zakonskih i licencijskih zahtjeva."}};const a=e=>new Promise((i=>{fetch(e).then((e=>e.json())).then((e=>{Object.keys(e).forEach((i=>{for(let t in e[i])o[i][t]=e[i][t]})),i(!0)}))})),r=(e,i,t)=>{const a=i;let r=o[void 0!==a&&n.includes(a)?a:"en"][e];if(void 0!==t)for(const[e,i]of Object.entries(t.values)){const t=new RegExp(`{${e}}`,"g");r=r.replace(t,i)}return r},s=class{constructor(i){e(this,i),this.userId="",this.session="",this.endpoint="",this.translationUrl="",this.clientStyling="",this.verifiedIcon="",this.failedIcon="",this.defaultIcon="",this.clientStylingUrl="",this.verificationType=[],this.isLoading=!1,this.stylingAppends=!1,this.selectedFiles=null,this.uploadSizeExceeded=!1,this.expandedOnDesktop=!1,this.scriptInjected=!1,this.MAX_UPLOAD_SIZE=5e7,this.setClientStyling=()=>{let e=document.createElement("style");e.innerHTML=this.clientStyling,this.stylingContainer.prepend(e)},this.setClientStylingURL=()=>{let e=new URL(this.clientStylingUrl),i=document.createElement("style");fetch(e.href).then((e=>e.text())).then((e=>{i.innerHTML=e,setTimeout((()=>{this.stylingContainer.prepend(i)}),1)})).catch((e=>{console.log("error ",e)}))}}handleNewTranslations(){this.isLoading=!0,a(this.translationUrl).then((()=>{this.isLoading=!1}))}async componentWillLoad(){this.translationUrl.length>2&&await a(this.translationUrl)}componentDidRender(){!this.stylingAppends&&this.stylingContainer&&(this.clientStyling&&this.setClientStyling(),this.clientStylingUrl&&this.setClientStylingURL(),this.stylingAppends=!0)}async componentDidLoad(){window.innerWidth>700&&(this.expandedOnDesktop=!0);try{let e=new URL(`${this.endpoint}/v2/player/${this.userId}/verification/GetKYCCustomerStatus`);const i={method:"POST",headers:{"X-SessionId":this.session,"Content-Type":"application/json"},body:JSON.stringify({})};fetch(e.href,i).then((e=>{if(200===e.status)return e.json();throw new Error("HTTP status "+e.status)})).then((e=>{this.verificationType=e.verifications})).catch((e=>{console.error(e)}))}catch(e){console.error("Error fetching verification types:",e)}}handleOptionChange(e,i){const t=e.target;this.selectedOption=t.value,this.verificationType=this.verificationType.map((e=>(e.type===i&&(e.optionChosen=t.value),e)))}handleDocumentsStatus(e,i,t){this.verificationType=this.verificationType.map((n=>{if(n.type===e){const e=n.documents.find((e=>e.code===t));e&&(e.statusUploaded=i)}return n}))}toggleVerificationType(e,i){this.expandedOnDesktop=!1,this.verificationType=this.verificationType.map((t=>{var n;return t.type===e&&(null===(n=t.flowInfo)||void 0===n?void 0:n.type)==i&&(t.expanded=!t.expanded),t}))}checkFileSize(e){let i=0;return Object.keys(e).forEach((t=>{i+=e[t].size})),i<=this.MAX_UPLOAD_SIZE}handleFileSelection(e,i,t){if(this.selectedFiles=e,this.selectedFiles)if(this.checkFileSize(this.selectedFiles)){const e={method:"POST",headers:{"Content-Type":"application/json","X-SessionId":this.session},body:JSON.stringify({DocumentCode:i})};fetch(`${this.endpoint}/v1/player/${this.userId}/verification/GetKYCVerificationDocumentUploadUrl`,e).then((e=>{if(e.ok)return this.uploadingStatus=r("uploading",this.language),this.handleDocumentsStatus(t,this.uploadingStatus,i),e.json()})).then((e=>{const n=new FormData,o=this.selectedFiles;for(let e=0;e<o.length;e++)n.append("files",o[e]);fetch(e.Url,{method:"POST",body:n}).then((e=>{e.ok?(this.uploadingStatus=r(this.selectedFiles.length>1?"successUploadMultipleFiles":"successUpload",this.language),this.handleDocumentsStatus(t,this.uploadingStatus,i)):(this.uploadingStatus=r("failedUpload",this.language),this.handleDocumentsStatus(t,this.uploadingStatus,i),console.error("File upload error:",e.status))})).catch((e=>{console.error("File upload error:",e)}))})).catch((e=>{console.error("File upload error:",e)}))}else console.error(r("fileSizeExceeded",this.language)),this.uploadingStatus=r("fileSizeExceeded",this.language),this.handleDocumentsStatus(t,this.uploadingStatus,i),this.uploadSizeExceeded=!0}importScript(e){return new Promise(((i,t)=>{fetch(e).then((e=>e.text())).then((e=>{if(new Function(e)(),this.scriptInjected)i(!0);else{const e=document.createElement("script");e.src="https://test.insic.de/frontend3/static/js/avs-loader.min.js",document.head.appendChild(e),this.scriptInjected=!0,i(!0)}})).catch((e=>{t(e)}))}))}renderVerificationTypeBox(e){this.expandedOnDesktop&&(e.expanded=!0);let t=e.expanded,n=e.type.replace(/([A-Z])/g," $1"),o=e.optionChosen,a=e.status,r=e.documents,s=e.flowInfo;const c="Verified"===a,l="Failed"===a||"Expired"===a;return i("div",{class:`verification-box ${t?"expanded":""} ${l?"failed":""} ${c?"success":""}`},i("div",{class:"box box-header "+(t?"expanded":""),onClick:()=>{var i;return this.toggleVerificationType(e.type,null===(i=e.flowInfo)||void 0===i?void 0:i.type)}},i("div",{class:"box-icon"},i("div",null,c?this.verifiedIcon?i("img",{class:"CustomVerifiedIcon",src:this.verifiedIcon,alt:""}):i("svg",{width:"100",height:"100",viewBox:"0 0 100 100",xmlns:"http://www.w3.org/2000/svg"},i("circle",{cx:"50",cy:"50",r:"40",fill:"#388D79"}),i("circle",{cx:"50",cy:"50",r:"34",fill:"none",stroke:"#fff","stroke-width":"12px"}),i("polyline",{points:"30,50 45,63 70,35",fill:"none",stroke:"#fff","stroke-width":"8px"})):l?this.failedIcon?i("img",{class:"CustomFailedIcon",src:this.failedIcon,alt:""}):i("svg",{width:"100",height:"100",viewBox:"0 0 100 100",xmlns:"http://www.w3.org/2000/svg"},i("circle",{cx:"50",cy:"50",r:"40",fill:"red"}),i("line",{x1:"30",y1:"30",x2:"70",y2:"70",stroke:"#fff","stroke-width":"10px"}),i("line",{x1:"30",y1:"70",x2:"70",y2:"30",stroke:"#fff","stroke-width":"10px"})):this.defaultIcon?i("img",{class:"CustomDefaultIcon",src:this.defaultIcon,alt:""}):i("svg",{width:"800px",height:"800px",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg"},i("path",{d:"M4 4V20C4 21.1046 4.89543 22 6 22L18 22C19.1046 22 20 21.1046 20 20V8.34162C20 7.8034 19.7831 7.28789 19.3982 6.91161L14.9579 2.56999C14.5842 2.20459 14.0824 2 13.5597 2L6 2C4.89543 2 4 2.89543 4 4Z",stroke:"#000000","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"}),i("path",{d:"M9 13H15",stroke:"#000000","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"}),i("path",{d:"M9 17H12",stroke:"#000000","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"}),i("path",{d:"M14 2V6C14 7.10457 14.8954 8 16 8H20",stroke:"#000000","stroke-width":"2","stroke-linejoin":"round"})))),i("div",{class:"box-title"},n),i("div",{class:"chevron-icon"},i("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"},i("path",{d:t?"M6 15l6-6 6 6":"M6 9l6 6 6-6"})))),t?this.renderExpandedContent(e,o,a,r,s,c,l):i("div",{class:"box box-content"},i("div",{id:"__avs-wrapper"})))}renderExpandedContent(e,n,o,a,s,c,l){var d,p;return"Widget"===(null==s?void 0:s.type)||"Redirect"===(null==s?void 0:s.type)&&"Manual"!==e.vendorName?i("div",null,i("hr",{style:{margin:"5px"}}),i("iframe",{src:s.url,frameborder:"0",height:"400px",width:"100%",allowfullScreen:!0})):i("div",{class:"box box-content"},i(t,null,c?i("div",{class:"verification-status"},r("verificationComplete",this.language)):l?i("div",{class:"verification-status"},r("Failed"===o?"verificationFailed":"verificationExpired",this.language)):a.length>0?i("div",{class:"documents-dropdown"},i("select",{class:"nice-select",onChange:i=>this.handleOptionChange(i,e.type)},i("option",{value:"",selected:!0,disabled:!0,hidden:!0},r("chooseDocument",this.language)),a.map((e=>i("option",{selected:n==e.code,value:e.code},e.type.replace(/([A-Z])/g," $1"))))),(null===(d=a.find((e=>e.code==n)))||void 0===d?void 0:d.statusUploaded)?i("div",{class:"upload-status"},null===(p=a.find((e=>e.code==n)))||void 0===p?void 0:p.statusUploaded):i("div",{class:"upload-button"},n?i("label",null,i("input",{type:"file",accept:"*",multiple:!0,onChange:i=>this.handleFileSelection(i.target.files,this.selectedOption,e.type),style:{display:"none"}}),i("svg",{width:"100",height:"100",xmlns:"http://www.w3.org/2000/svg"},i("circle",{cx:"50",cy:"50",r:"40",fill:"#388D79"}),i("line",{x1:"30",y1:"50",x2:"70",y2:"50",stroke:"white","stroke-width":"6"}),i("line",{x1:"50",y1:"30",x2:"50",y2:"70",stroke:"white","stroke-width":"6"}))):null)):null))}render(){return this.isLoading?i("div",null,i("p",null,r("loading",this.language))):0===this.verificationType.length?i("div",{style:{padding:"24px",fontSize:"18px"}},r("noVerificationRequired",this.language)):i("div",{class:"ModalContainer",ref:e=>this.stylingContainer=e},i("div",{class:"player-kyc-verification-widget"},i("h2",null,r("kycTitle",this.language)),i("div",{class:"widget-description"},r("kycDescription",this.language)),i("div",{class:"verification-types"},this.verificationType.map((e=>e?this.renderVerificationTypeBox(e):null)))))}static get watchers(){return{translationUrl:["handleNewTranslations"]}}};s.style='@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@100&display=swap");\n:host {\n font-family: "Roboto", sans-serif;\n}\n\n.ModalContainer {\n container-type: inline-size;\n}\n\n.player-kyc-verification-widget {\n padding: 20px;\n align-items: center;\n}\n.player-kyc-verification-widget h2 {\n margin: 4px;\n}\n.player-kyc-verification-widget .widget-description {\n margin: 24px 0px;\n}\n.player-kyc-verification-widget .verification-types {\n width: 100%;\n display: grid;\n grid-template-columns: repeat(3, 1fr);\n grid-gap: 34px;\n}\n.player-kyc-verification-widget .verification-types .verification-box {\n transition: height 0.3s, border-color 0.3s;\n border: solid 1.4px #b5b5b5;\n border-radius: 2px;\n display: flex;\n flex-direction: column;\n padding: 0px 14px;\n border-width: 2px 2px 8px 2px;\n align-self: start;\n}\n.player-kyc-verification-widget .verification-types .verification-box .box {\n flex-shrink: 0;\n}\n.player-kyc-verification-widget .verification-types .verification-box .box-header {\n display: flex;\n padding: 14px 0px;\n justify-content: space-between;\n cursor: pointer;\n align-items: center;\n}\n.player-kyc-verification-widget .verification-types .verification-box .box-header .box-icon {\n flex-grow: 1;\n display: flex;\n justify-content: center;\n}\n.player-kyc-verification-widget .verification-types .verification-box .box-header .box-icon svg {\n height: 24px;\n width: 24px;\n}\n.player-kyc-verification-widget .verification-types .verification-box .box-header .box-title {\n flex-grow: 1;\n font-size: 18px;\n}\n.player-kyc-verification-widget .verification-types .verification-box .box-header .chevron-icon {\n flex-grow: 10;\n width: 14px;\n height: 14px;\n display: flex;\n justify-content: flex-end;\n}\n.player-kyc-verification-widget .verification-types .verification-box .box-header .chevron-icon svg {\n width: 20px;\n height: 22px;\n}\n.player-kyc-verification-widget .verification-types .verification-box .box-content {\n display: none;\n flex-grow: 1;\n border-top: 0.4px solid #bcbcbc;\n padding: 10px 0px;\n flex-grow: 1;\n}\n.player-kyc-verification-widget .verification-types .verification-box .box-content .upload-status {\n text-align: center;\n padding: 20px;\n}\n.player-kyc-verification-widget .verification-types .verification-box .box-content .documents-dropdown {\n display: flex;\n flex-direction: column;\n width: 100%;\n align-items: center;\n}\n.player-kyc-verification-widget .verification-types .verification-box .box-content .documents-dropdown svg {\n margin: 16px;\n cursor: pointer;\n}\n.player-kyc-verification-widget .verification-types .verification-box .box-content .documents-dropdown .nice-select {\n cursor: pointer;\n width: 100%;\n height: 30px;\n padding: 4px 14px;\n font-size: 14px;\n border: 1px solid #ccc;\n border-radius: 2px;\n background-color: #fff;\n color: #333;\n appearance: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n padding-right: 30px;\n background-repeat: no-repeat;\n background-position: right 10px center;\n background-image: url(\'data:image/svg+xml;charset=utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20"><path fill="%23333" d="M10 18.4l-6.5-6.5h13z"/><path fill="%23333" d="M10 1.6l6.5 6.5H3.5z"/></svg>\');\n}\n.player-kyc-verification-widget .verification-types .verification-box.expanded {\n border-color: green;\n min-height: 120px;\n}\n.player-kyc-verification-widget .verification-types .verification-box.failed {\n border-color: #d42323;\n}\n.player-kyc-verification-widget .verification-types .verification-box.success {\n border-color: green;\n}\n.player-kyc-verification-widget .verification-types .verification-box.expanded .box-content {\n display: flex;\n justify-content: center;\n flex-direction: column;\n}\n.player-kyc-verification-widget .verification-types .verification-box.expanded .box-content .verification-status {\n margin: 12px 0px 16px;\n font-size: 18px;\n text-align: center;\n color: #9b9b9b;\n}\n\n@container (min-width: 700px) {\n .player-kyc-verification-widget {\n padding: 100px 60px;\n }\n}\n@container (max-width: 700px) {\n .player-kyc-verification-widget h2 {\n margin: 4px;\n text-align: center;\n }\n .player-kyc-verification-widget .verification-types {\n grid-template-columns: 1fr;\n grid-gap: 16px;\n }\n}\n@container (max-width: 1240px) and (min-width: 701px) {\n .player-kyc-verification-widget .verification-types {\n grid-template-columns: repeat(2, 1fr);\n }\n}';export{s as player_kyc_verification}
package/dist/player-kyc-verification/player-kyc-verification.esm.js CHANGED
@@ -1 +1 @@
1
- import{p as e,b as i}from"./p-1f2596d0.js";(()=>{const i=import.meta.url,n={};return""!==i&&(n.resourcesUrl=new URL(".",i).href),e(n)})().then((e=>i([["p-c3a42c2a",[[1,"player-kyc-verification",{userId:[1,"user-id"],session:[1],language:[1],endpoint:[1],translationUrl:[1,"translation-url"],clientStyling:[1,"client-styling"],verifiedIcon:[1,"verified-icon"],failedIcon:[1,"failed-icon"],defaultIcon:[1,"default-icon"],clientStylingUrl:[1,"client-styling-url"],verificationType:[32],isLoading:[32],stylingAppends:[32],selectedFiles:[32],uploadingStatus:[32],uploadSizeExceeded:[32],selectedOption:[32],expandedOnDesktop:[32]}]]]],e)));
1
+ import{p as e,b as i}from"./p-1f2596d0.js";(()=>{const i=import.meta.url,n={};return""!==i&&(n.resourcesUrl=new URL(".",i).href),e(n)})().then((e=>i([["p-28c876fe",[[1,"player-kyc-verification",{userId:[1,"user-id"],session:[1],language:[1],endpoint:[1],translationUrl:[1,"translation-url"],clientStyling:[1,"client-styling"],verifiedIcon:[1,"verified-icon"],failedIcon:[1,"failed-icon"],defaultIcon:[1,"default-icon"],clientStylingUrl:[1,"client-styling-url"],verificationType:[32],isLoading:[32],stylingAppends:[32],selectedFiles:[32],uploadingStatus:[32],uploadSizeExceeded:[32],selectedOption:[32],expandedOnDesktop:[32]}]]]],e)));
package/dist/types/Users/dragos.bodea/Documents/everymatrix-prjs/emfe-widgets/widgets-stencil/packages/player-kyc-verification/.stencil/packages/player-kyc-verification/stencil.config.d.ts ADDED
@@ -0,0 +1,2 @@
1
+ import { Config } from '../../../../../../../../../../../stencil-public-runtime';
2
+ export declare const config: Config;
package/dist/types/components/player-kyc-verification/player-kyc-verification.d.ts CHANGED
@@ -63,5 +63,6 @@ export declare class PlayerKycVerificationWidget {
63
63
  handleFileSelection(files: FileList | null, documentType: string, verificationTypeId: string): void;
64
64
  importScript(url: any): Promise<unknown>;
65
65
  renderVerificationTypeBox(verificationType: any): any;
66
+ renderExpandedContent(verificationType: any, optionChosen: any, status: string, documents: any, flowInfo: any, isVerified: boolean, isFailedOrExpired: boolean): void;
66
67
  render(): any;
67
68
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@everymatrix/player-kyc-verification",
3
- "version": "1.27.5",
3
+ "version": "1.27.7",
4
4
  "main": "./dist/index.cjs.js",
5
5
  "module": "./dist/index.js",
6
6
  "es2015": "./dist/esm/index.mjs",
package/dist/player-kyc-verification/p-c3a42c2a.entry.js DELETED
@@ -1 +0,0 @@
1
- import{r as e,h as i,F as t}from"./p-1f2596d0.js";const n=["de","en","hr"];let o={en:{loading:"Loading, please wait ...",noVerificationRequired:"There is no verification required for your account at this moment.",verificationComplete:"Verification complete",verificationFailed:"Verification failed",verificationExpired:"Verification expired",fileSizeExceeded:"Maximum file size exceeded. Max file size is: 50mb",uploading:"Uploading ... ",successUpload:"Your document has been uploaded and it will be reviewed shortly",successUploadMultipleFiles:"Your documents have been uploaded and it will be reviewed shortly",failedUpload:"Upload failed please try again",chooseDocument:"Choose Document",kycTitle:"Account Verification",kycDescription:"We require some documents to protect your account and to comply with legal and license requirements."},de:{loading:"Loading, please wait ...",noVerificationRequired:"There is no verification required for your account at this moment.",verificationComplete:"Verification complete",verificationFailed:"Verification failed",verificationExpired:"Verification expired",fileSizeExceeded:"Maximum file size exceeded. Max file size is: 50mb",uploading:"Uploading ... ",successUpload:"Your document has been uploaded and it will be reviewed shortly",successUploadMultipleFiles:"Your documents have been uploaded and it will be reviewed shortly",failedUpload:"Upload failed please try again",chooseDocument:"Choose Document",kycTitle:"Account-Verifizierung",kycDescription:"Wir benötigen einige Dokumente, um Ihr Konto zu schützen und den rechtlichen und Lizenzanforderungen zu entsprechen."},ro:{loading:"Loading, please wait ...",noVerificationRequired:"There is no verification required for your account at this moment.",verificationComplete:"Verification complete",verificationFailed:"Verification failed",verificationExpired:"Verification expired",fileSizeExceeded:"Maximum file size exceeded. Max file size is: 50mb",uploading:"Uploading ... ",successUpload:"Your document has been uploaded and it will be reviewed shortly",successUploadMultipleFiles:"Your documents have been uploaded and it will be reviewed shortly",failedUpload:"Upload failed please try again",chooseDocument:"Choose Document",kycTitle:"Verificarea contului",kycDescription:"Avem nevoie de câteva documente pentru a proteja contul dvs. și pentru a respecta cerințele legale și de licență."},fr:{loading:"Loading, please wait ...",noVerificationRequired:"There is no verification required for your account at this moment.",verificationComplete:"Verification complete",verificationFailed:"Verification failed",verificationExpired:"Verification expired",fileSizeExceeded:"Maximum file size exceeded. Max file size is: 50mb",uploading:"Uploading ... ",successUpload:"Your document has been uploaded and it will be reviewed shortly",successUploadMultipleFiles:"Your documents have been uploaded and it will be reviewed shortly",failedUpload:"Upload failed please try again",chooseDocument:"Choose Document",kycTitle:"Vérification de compte",kycDescription:"Nous avons besoin de certains documents pour protéger votre compte et pour nous conformer aux exigences légales et de licence."},ar:{loading:"Loading, please wait ...",noVerificationRequired:"There is no verification required for your account at this moment.",verificationComplete:"Verification complete",verificationFailed:"Verification failed",verificationExpired:"Verification expired",fileSizeExceeded:"Maximum file size exceeded. Max file size is: 50mb",uploading:"Uploading ... ",successUpload:"Your document has been uploaded and it will be reviewed shortly",successUploadMultipleFiles:"Your documents have been uploaded and it will be reviewed shortly",failedUpload:"Upload failed please try again",chooseDocument:"Choose Document",kycTitle:"التحقق من الحساب",kycDescription:"نحتاج إلى بعض الوثائق لحماية حسابك والامتثال للمتطلبات القانونية والترخيص."},hr:{loading:"Učitavanje, molimo pričekajte ...",noVerificationRequired:"Trenutačno nije potrebna provjera vašeg računa.",verificationComplete:"Provjera dovršena",verificationFailed:"Provjera nije uspjela",verificationExpired:"Provjera je istekla",fileSizeExceeded:"Premašena je maksimalna veličina datoteke. Maksimalna veličina datoteke je: 50mb",uploading:"Prijenos…",successUpload:"Vaš dokument je učitan i uskoro će biti pregledan",successUploadMultipleFiles:"Vaši su dokumenti učitani i uskoro će biti pregledani",failedUpload:"Prijenos nije uspio pokušajte ponovo",chooseDocument:"Odaberite Dokument",kycTitle:"Verifikacija računa",kycDescription:"Potrebni su nam neki dokumenti kako bismo zaštitili vaš račun i kako bismo se pridržavali zakonskih i licencijskih zahtjeva."}};const r=e=>new Promise((i=>{fetch(e).then((e=>e.json())).then((e=>{Object.keys(e).forEach((i=>{for(let t in e[i])o[i][t]=e[i][t]})),i(!0)}))})),a=(e,i,t)=>{const r=i;let a=o[void 0!==r&&n.includes(r)?r:"en"][e];if(void 0!==t)for(const[e,i]of Object.entries(t.values)){const t=new RegExp(`{${e}}`,"g");a=a.replace(t,i)}return a},s=class{constructor(i){e(this,i),this.userId="",this.session="",this.endpoint="",this.translationUrl="",this.clientStyling="",this.verifiedIcon="",this.failedIcon="",this.defaultIcon="",this.clientStylingUrl="",this.verificationType=[],this.isLoading=!1,this.stylingAppends=!1,this.selectedFiles=null,this.uploadSizeExceeded=!1,this.expandedOnDesktop=!1,this.scriptInjected=!1,this.MAX_UPLOAD_SIZE=5e7,this.setClientStyling=()=>{let e=document.createElement("style");e.innerHTML=this.clientStyling,this.stylingContainer.prepend(e)},this.setClientStylingURL=()=>{let e=new URL(this.clientStylingUrl),i=document.createElement("style");fetch(e.href).then((e=>e.text())).then((e=>{i.innerHTML=e,setTimeout((()=>{this.stylingContainer.prepend(i)}),1)})).catch((e=>{console.log("error ",e)}))}}handleNewTranslations(){this.isLoading=!0,r(this.translationUrl).then((()=>{this.isLoading=!1}))}async componentWillLoad(){this.translationUrl.length>2&&await r(this.translationUrl)}componentDidRender(){!this.stylingAppends&&this.stylingContainer&&(this.clientStyling&&this.setClientStyling(),this.clientStylingUrl&&this.setClientStylingURL(),this.stylingAppends=!0)}async componentDidLoad(){window.innerWidth>700&&(this.expandedOnDesktop=!0);try{let e=new URL(`${this.endpoint}/v2/player/${this.userId}/verification/GetKYCCustomerStatus`);const i={method:"POST",headers:{"X-SessionId":this.session,"Content-Type":"application/json"},body:JSON.stringify({})};fetch(e.href,i).then((e=>{if(200===e.status)return e.json();throw new Error("HTTP status "+e.status)})).then((e=>{this.verificationType=e.verifications})).catch((e=>{console.error(e)}))}catch(e){console.error("Error fetching verification types:",e)}}handleOptionChange(e,i){const t=e.target;this.selectedOption=t.value,this.verificationType=this.verificationType.map((e=>(e.type===i&&(e.optionChosen=t.value),e)))}handleDocumentsStatus(e,i,t){this.verificationType=this.verificationType.map((n=>{if(n.type===e){const e=n.documents.find((e=>e.code===t));e&&(e.statusUploaded=i)}return n}))}toggleVerificationType(e,i){this.expandedOnDesktop=!1,this.verificationType=this.verificationType.map((t=>{var n;return t.type===e&&(null===(n=t.flowInfo)||void 0===n?void 0:n.type)==i&&(t.expanded=!t.expanded),t}))}checkFileSize(e){let i=0;return Object.keys(e).forEach((t=>{i+=e[t].size})),i<=this.MAX_UPLOAD_SIZE}handleFileSelection(e,i,t){if(this.selectedFiles=e,this.selectedFiles)if(this.checkFileSize(this.selectedFiles)){const e={method:"POST",headers:{"Content-Type":"application/json","X-SessionId":this.session},body:JSON.stringify({DocumentCode:i})};fetch(`${this.endpoint}/v1/player/${this.userId}/verification/GetKYCVerificationDocumentUploadUrl`,e).then((e=>{if(e.ok)return this.uploadingStatus=a("uploading",this.language),this.handleDocumentsStatus(t,this.uploadingStatus,i),e.json()})).then((e=>{const n=new FormData,o=this.selectedFiles;for(let e=0;e<o.length;e++)n.append("files",o[e]);fetch(e.Url,{method:"POST",body:n}).then((e=>{e.ok?(this.uploadingStatus=a(this.selectedFiles.length>1?"successUploadMultipleFiles":"successUpload",this.language),this.handleDocumentsStatus(t,this.uploadingStatus,i)):(this.uploadingStatus=a("failedUpload",this.language),this.handleDocumentsStatus(t,this.uploadingStatus,i),console.error("File upload error:",e.status))})).catch((e=>{console.error("File upload error:",e)}))})).catch((e=>{console.error("File upload error:",e)}))}else console.error(a("fileSizeExceeded",this.language)),this.uploadingStatus=a("fileSizeExceeded",this.language),this.handleDocumentsStatus(t,this.uploadingStatus,i),this.uploadSizeExceeded=!0}importScript(e){return new Promise(((i,t)=>{fetch(e).then((e=>e.text())).then((e=>{if(new Function(e)(),this.scriptInjected)i(!0);else{const e=document.createElement("script");e.src="https://test.insic.de/frontend3/static/js/avs-loader.min.js",document.head.appendChild(e),this.scriptInjected=!0,i(!0)}})).catch((e=>{t(e)}))}))}renderVerificationTypeBox(e){var n,o;this.expandedOnDesktop&&(e.expanded=!0);let r=e.expanded,s=e.type.replace(/([A-Z])/g," $1"),c=e.optionChosen,l=e.status,d=e.documents,p=e.flowInfo;"Widget"===(null==p?void 0:p.type)&&this.importScript(p.url).then((()=>{console.log("Script imported correctly")})).catch((e=>{console.error("Error importing script:",e)}));const h="Verified"===l,f="Failed"===l||"Expired"===l;return i("div",{class:`verification-box ${r?"expanded":""} ${f?"failed":""} ${h?"success":""}`},i("div",{class:"box box-header "+(r?"expanded":""),onClick:()=>{var i;return this.toggleVerificationType(e.type,null===(i=e.flowInfo)||void 0===i?void 0:i.type)}},i("div",{class:"box-icon"},i("div",null,h?this.verifiedIcon?i("img",{class:"CustomVerifiedIcon",src:this.verifiedIcon,alt:""}):i("svg",{width:"100",height:"100",viewBox:"0 0 100 100",xmlns:"http://www.w3.org/2000/svg"},i("circle",{cx:"50",cy:"50",r:"40",fill:"#388D79"}),i("circle",{cx:"50",cy:"50",r:"34",fill:"none",stroke:"#fff","stroke-width":"12px"}),i("polyline",{points:"30,50 45,63 70,35",fill:"none",stroke:"#fff","stroke-width":"8px"})):f?this.failedIcon?i("img",{class:"CustomFailedIcon",src:this.failedIcon,alt:""}):i("svg",{width:"100",height:"100",viewBox:"0 0 100 100",xmlns:"http://www.w3.org/2000/svg"},i("circle",{cx:"50",cy:"50",r:"40",fill:"red"}),i("line",{x1:"30",y1:"30",x2:"70",y2:"70",stroke:"#fff","stroke-width":"10px"}),i("line",{x1:"30",y1:"70",x2:"70",y2:"30",stroke:"#fff","stroke-width":"10px"})):this.defaultIcon?i("img",{class:"CustomDefaultIcon",src:this.defaultIcon,alt:""}):i("svg",{width:"800px",height:"800px",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg"},i("path",{d:"M4 4V20C4 21.1046 4.89543 22 6 22L18 22C19.1046 22 20 21.1046 20 20V8.34162C20 7.8034 19.7831 7.28789 19.3982 6.91161L14.9579 2.56999C14.5842 2.20459 14.0824 2 13.5597 2L6 2C4.89543 2 4 2.89543 4 4Z",stroke:"#000000","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"}),i("path",{d:"M9 13H15",stroke:"#000000","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"}),i("path",{d:"M9 17H12",stroke:"#000000","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"}),i("path",{d:"M14 2V6C14 7.10457 14.8954 8 16 8H20",stroke:"#000000","stroke-width":"2","stroke-linejoin":"round"})))),i("div",{class:"box-title"},s),i("div",{class:"chevron-icon"},i("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"},i("path",{d:r?"M6 15l6-6 6 6":"M6 9l6 6 6-6"})))),i("div",{class:"box box-content"},r&&"Widget"!=(null==p?void 0:p.type)?i(t,null,h?i("div",{class:"verification-status"},a("verificationComplete",this.language)):f?i("div",{class:"verification-status"},a("Failed"===l?"verificationFailed":"verificationExpired",this.language)):d.length>0?i("div",{class:"documents-dropdown"},i("select",{class:"nice-select",onChange:i=>this.handleOptionChange(i,e.type)},i("option",{value:"",selected:!0,disabled:!0,hidden:!0},a("chooseDocument",this.language)),d.map((e=>i("option",{selected:c==e.code,value:e.code},e.type.replace(/([A-Z])/g," $1"))))),(null===(n=d.find((e=>e.code==c)))||void 0===n?void 0:n.statusUploaded)?i("div",{class:"upload-status"},null===(o=d.find((e=>e.code==c)))||void 0===o?void 0:o.statusUploaded):i("div",{class:"upload-button"},c?i("label",null,i("input",{type:"file",accept:"*",multiple:!0,onChange:i=>this.handleFileSelection(i.target.files,this.selectedOption,e.type),style:{display:"none"}}),i("svg",{width:"100",height:"100",xmlns:"http://www.w3.org/2000/svg"},i("circle",{cx:"50",cy:"50",r:"40",fill:"#388D79"}),i("line",{x1:"30",y1:"50",x2:"70",y2:"50",stroke:"white","stroke-width":"6"}),i("line",{x1:"50",y1:"30",x2:"50",y2:"70",stroke:"white","stroke-width":"6"}))):null)):null):i("div",{id:"__avs-wrapper"})))}render(){return this.isLoading?i("div",null,i("p",null,a("loading",this.language))):0===this.verificationType.length?i("div",{style:{padding:"24px",fontSize:"18px"}},a("noVerificationRequired",this.language)):i("div",{class:"ModalContainer",ref:e=>this.stylingContainer=e},i("div",{class:"player-kyc-verification-widget"},i("h2",null,a("kycTitle",this.language)),i("div",{class:"widget-description"},a("kycDescription",this.language)),i("div",{class:"verification-types"},this.verificationType.map((e=>"Manual"===e.vendorName||"Insic"===e.vendorName?this.renderVerificationTypeBox(e):null)))))}static get watchers(){return{translationUrl:["handleNewTranslations"]}}};s.style='@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@100&display=swap");\n:host {\n font-family: "Roboto", sans-serif;\n}\n\n.ModalContainer {\n container-type: inline-size;\n}\n\n.player-kyc-verification-widget {\n padding: 20px;\n align-items: center;\n}\n.player-kyc-verification-widget h2 {\n margin: 4px;\n}\n.player-kyc-verification-widget .widget-description {\n margin: 24px 0px;\n}\n.player-kyc-verification-widget .verification-types {\n width: 100%;\n display: grid;\n grid-template-columns: repeat(3, 1fr);\n grid-gap: 34px;\n}\n.player-kyc-verification-widget .verification-types .verification-box {\n transition: height 0.3s, border-color 0.3s;\n border: solid 1.4px #b5b5b5;\n border-radius: 2px;\n display: flex;\n flex-direction: column;\n padding: 0px 14px;\n border-width: 2px 2px 8px 2px;\n align-self: start;\n}\n.player-kyc-verification-widget .verification-types .verification-box .box {\n flex-shrink: 0;\n}\n.player-kyc-verification-widget .verification-types .verification-box .box-header {\n display: flex;\n padding: 14px 0px;\n justify-content: space-between;\n cursor: pointer;\n align-items: center;\n}\n.player-kyc-verification-widget .verification-types .verification-box .box-header .box-icon {\n flex-grow: 1;\n display: flex;\n justify-content: center;\n}\n.player-kyc-verification-widget .verification-types .verification-box .box-header .box-icon svg {\n height: 24px;\n width: 24px;\n}\n.player-kyc-verification-widget .verification-types .verification-box .box-header .box-title {\n flex-grow: 1;\n font-size: 18px;\n}\n.player-kyc-verification-widget .verification-types .verification-box .box-header .chevron-icon {\n flex-grow: 10;\n width: 14px;\n height: 14px;\n display: flex;\n justify-content: flex-end;\n}\n.player-kyc-verification-widget .verification-types .verification-box .box-header .chevron-icon svg {\n width: 20px;\n height: 22px;\n}\n.player-kyc-verification-widget .verification-types .verification-box .box-content {\n display: none;\n flex-grow: 1;\n border-top: 0.4px solid #bcbcbc;\n padding: 10px 0px;\n flex-grow: 1;\n}\n.player-kyc-verification-widget .verification-types .verification-box .box-content .upload-status {\n text-align: center;\n padding: 20px;\n}\n.player-kyc-verification-widget .verification-types .verification-box .box-content .documents-dropdown {\n display: flex;\n flex-direction: column;\n width: 100%;\n align-items: center;\n}\n.player-kyc-verification-widget .verification-types .verification-box .box-content .documents-dropdown svg {\n margin: 16px;\n cursor: pointer;\n}\n.player-kyc-verification-widget .verification-types .verification-box .box-content .documents-dropdown .nice-select {\n cursor: pointer;\n width: 100%;\n height: 30px;\n padding: 4px 14px;\n font-size: 14px;\n border: 1px solid #ccc;\n border-radius: 2px;\n background-color: #fff;\n color: #333;\n appearance: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n padding-right: 30px;\n background-repeat: no-repeat;\n background-position: right 10px center;\n background-image: url(\'data:image/svg+xml;charset=utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20"><path fill="%23333" d="M10 18.4l-6.5-6.5h13z"/><path fill="%23333" d="M10 1.6l6.5 6.5H3.5z"/></svg>\');\n}\n.player-kyc-verification-widget .verification-types .verification-box.expanded {\n border-color: green;\n min-height: 120px;\n}\n.player-kyc-verification-widget .verification-types .verification-box.failed {\n border-color: #d42323;\n}\n.player-kyc-verification-widget .verification-types .verification-box.success {\n border-color: green;\n}\n.player-kyc-verification-widget .verification-types .verification-box.expanded .box-content {\n display: flex;\n justify-content: center;\n flex-direction: column;\n}\n.player-kyc-verification-widget .verification-types .verification-box.expanded .box-content .verification-status {\n margin: 12px 0px 16px;\n font-size: 18px;\n text-align: center;\n color: #9b9b9b;\n}\n\n@container (min-width: 700px) {\n .player-kyc-verification-widget {\n padding: 100px 60px;\n }\n}\n@container (max-width: 700px) {\n .player-kyc-verification-widget h2 {\n margin: 4px;\n text-align: center;\n }\n .player-kyc-verification-widget .verification-types {\n grid-template-columns: 1fr;\n grid-gap: 16px;\n }\n}\n@container (max-width: 1240px) and (min-width: 701px) {\n .player-kyc-verification-widget .verification-types {\n grid-template-columns: repeat(2, 1fr);\n }\n}';export{s as player_kyc_verification}
package/dist/types/Users/adrian.pripon/Documents/Work/widgets-stencil/packages/player-kyc-verification/.stencil/packages/player-kyc-verification/stencil.config.d.ts DELETED
@@ -1,2 +0,0 @@
1
- import { Config } from '../../../../../../../../../../stencil-public-runtime';
2
- export declare const config: Config;