@propellerads/kyc-form 4.1.8 → 5.0.1

package/README.md

@@ -10,15 +10,15 @@
 
 ## Installation
 
-- `yarn add @propellerads/kyc-form` or `npm install @propellerads/kyc-form -S`
+- `bun add @propellerads/kyc-form` or `npm install @propellerads/kyc-form -S`
 
 ### How to use
 
-- `import KycForm from '@propellerads/kyc-form';`
+- `import KYCForm, {DocumentType, PartType} from '@propellerads/kyc-form';`
 - And render
 
-```
-<KycForm
+```tsx
+<KYCForm
     elementId="kyc-form-component"
     title="PropellerAds is integrating KYC systems into the business processes. To continue working we kindly ask you to provide the following documents:"
     uploadButtonLabel="Send documents"
@@ -27,18 +27,18 @@
         action: 'upload from your computer',
         oversizeError: 'File is too big',
     }}
-    documentsLabels={
-        [DOCUMENT_TYPES.CARD]: {
+    documentsLabels={{
+        [DocumentType.Card]: {
             title: 'Photo of the account owner’s ID card.',
             description: '(Passport/driver’s license/aadhar card etc.)',
         }
-    }
+    }}
     documents={[{
-        type: DOCUMENT_TYPES.ID,
+        type: DocumentType.Id,
         parts:[{
-            type: PART_TYPES.ID_FRONT,
+            type: PartType.IdFront,
         }, {
-            type: PART_TYPES.ID_BACK,
+            type: PartType.IdBack,
         }],
     }]}
     onUploadClick={console.log}

package/dist/index.d.ts

@@ -1,11 +1,110 @@
-import React from 'react';
-import { ACCEPT_FORMATS, AVAILABLE_EXTRA_PARTS_DOCUMENTS, MAX_EXTRA_PARTS_COUNT, MAX_FILE_SIZE, OPTIONAL_DOCUMENT_PARTS, PDF_MIME_TYPE } from './constants';
-import { DOCUMENT_TYPES, PART_TYPES } from './document.types';
-import { KYCFormProps } from './types';
-declare const KYCForm: {
-    (props: KYCFormProps): React.JSX.Element;
-    SucessScreen: (props: import("./KYCStatusScreen/types").KYCSucessScreenProps) => React.JSX.Element;
-    FailScreen: (props: import("./KYCStatusScreen/types").KYCFailScreenProps) => React.JSX.Element;
-};
-export default KYCForm;
-export { ACCEPT_FORMATS, AVAILABLE_EXTRA_PARTS_DOCUMENTS, DOCUMENT_TYPES, MAX_EXTRA_PARTS_COUNT, MAX_FILE_SIZE, OPTIONAL_DOCUMENT_PARTS, PART_TYPES, PDF_MIME_TYPE, };
+import { ReactNode } from 'react';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ImageUploaderProps } from '@propellerads/image-uploader';
+
+type KYCSuccessScreenProps = {
+    elementId: string;
+    title: string;
+    description?: ReactNode;
+    support?: ReactNode;
+};
+type KYCFailScreenProps = {
+    elementId: string;
+    title: string;
+    support?: ReactNode;
+};
+
+declare const DocumentType: {
+    readonly Id: "id";
+    readonly Ub: "ub";
+    readonly IdExtra: "id_extra";
+    readonly Card: "bank_card";
+    readonly PaymentSystemScreen: "payment_system_screen";
+    readonly OnlineBankingStatement: "online_banking_statement";
+    readonly CompanyRegistrationDocument: "company_registration_document";
+    readonly SelfieWithIdCard: "selfie_with_id_card_or_bank_card";
+    readonly PaypalDetailsPage: "pay_pal_details_page";
+    readonly BankWireDetails: "bank_wire_details";
+    readonly TransactionConfirmation: "transaction_confirmation";
+    readonly Other: "other";
+    readonly Feedback: "feedback";
+};
+type DocumentType = (typeof DocumentType)[keyof typeof DocumentType];
+declare const PartType: {
+    readonly IdFront: "id_front";
+    readonly IdBack: "id_back";
+    readonly Ub: "ub_item";
+    readonly Card: "card_item";
+    readonly PaymentSystemScreen: "screen_item";
+    readonly OnlineBankingStatement: "obs_item";
+    readonly CompanyRegistrationDocument: "crd_item";
+    readonly SelfieWithIdCard: "selfie_item";
+    readonly PaypalDetailsPageImage: "pay_pal_details_page_image";
+    readonly BankWireDetailsPage: "bank_wire_details_image";
+    readonly TransactionConfirmationImage: "transaction_confirmation_image";
+    readonly OtherImage: "other_image";
+    readonly Feedback: "feedback";
+};
+type PartType = (typeof PartType)[keyof typeof PartType];
+type KYCFileData = string | undefined;
+type KYCFile = {
+    type: PartType;
+    data?: KYCFileData;
+};
+type KYCDocument = {
+    type: DocumentType;
+    parts: KYCFile[];
+};
+
+declare const MAX_FILE_SIZE = 5242880;
+declare const MAX_EXTRA_PARTS_COUNT = 3;
+declare const PDF_MIME_TYPE = "application/pdf";
+declare const ACCEPT_FORMATS: ImageUploaderProps['acceptFormats'];
+declare const AVAILABLE_EXTRA_PARTS_DOCUMENTS: DocumentType[];
+declare const OPTIONAL_DOCUMENT_PARTS: {
+    id: {
+        parts: "id_back"[];
+    };
+    id_extra: {
+        parts: "id_back"[];
+    };
+};
+
+type UploaderLabels = {
+    title?: string;
+    description?: string;
+    action?: string;
+    oversizeError: string;
+};
+type PartLabels = {
+    title?: string;
+};
+type PartsLabels = Partial<Record<PartType, PartLabels>>;
+type DocumentLabels = {
+    title: string;
+    description?: string;
+    parts?: PartsLabels;
+};
+type DocumentsLabels = Partial<Record<DocumentType, DocumentLabels>>;
+
+type KYCFormProps = {
+    elementId: string;
+    title: ReactNode;
+    uploadButtonLabel: string;
+    uploaderLabels: UploaderLabels;
+    documentsLabels: DocumentsLabels;
+    documents: KYCDocument[];
+    isLoading?: boolean;
+    errors?: Record<string, string>;
+    validator: (documents: KYCDocument[]) => boolean;
+    onUploadClick: (documents: KYCDocument[]) => void;
+};
+
+declare const KYCForm: {
+    (props: KYCFormProps): react_jsx_runtime.JSX.Element;
+    SuccessScreen: (props: KYCSuccessScreenProps) => react_jsx_runtime.JSX.Element;
+    FailScreen: (props: KYCFailScreenProps) => react_jsx_runtime.JSX.Element;
+};
+
+export { ACCEPT_FORMATS, AVAILABLE_EXTRA_PARTS_DOCUMENTS, DocumentType, MAX_EXTRA_PARTS_COUNT, MAX_FILE_SIZE, OPTIONAL_DOCUMENT_PARTS, PDF_MIME_TYPE, PartType, KYCForm as default };
+export type { KYCDocument, KYCFile };

package/dist/index.js

@@ -1,8 +1,381 @@
+import e, { ButtonType as t } from "@propellerads/button";
+import { useEffect as n, useState as r } from "react";
+import { Close as i, Color as a, Delete as o, Insert as s, Pdf as c, Size as l } from "@propellerads/icon";
+import u, { Direction as d } from "@propellerads/image-uploader";
+import f from "@propellerads/textarea";
+import p from "styled-components";
+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";
+import { jsx as C, jsxs as w } from "react/jsx-runtime";
+import T from "@propellerads/success-label";
+//#region src/document.types.ts
+var E = {
+	Id: "id",
+	Ub: "ub",
+	IdExtra: "id_extra",
+	Card: "bank_card",
+	PaymentSystemScreen: "payment_system_screen",
+	OnlineBankingStatement: "online_banking_statement",
+	CompanyRegistrationDocument: "company_registration_document",
+	SelfieWithIdCard: "selfie_with_id_card_or_bank_card",
+	PaypalDetailsPage: "pay_pal_details_page",
+	BankWireDetails: "bank_wire_details",
+	TransactionConfirmation: "transaction_confirmation",
+	Other: "other",
+	Feedback: "feedback"
+}, D = {
+	IdFront: "id_front",
+	IdBack: "id_back",
+	Ub: "ub_item",
+	Card: "card_item",
+	PaymentSystemScreen: "screen_item",
+	OnlineBankingStatement: "obs_item",
+	CompanyRegistrationDocument: "crd_item",
+	SelfieWithIdCard: "selfie_item",
+	PaypalDetailsPageImage: "pay_pal_details_page_image",
+	BankWireDetailsPage: "bank_wire_details_image",
+	TransactionConfirmationImage: "transaction_confirmation_image",
+	OtherImage: "other_image",
+	Feedback: "feedback"
+}, O = 5242880, ee = 3, k = "application/pdf", A = "image/heic", j = {
+	"image/png": [".png"],
+	"image/jpeg": [
+		".jpg",
+		".jpe",
+		".jpeg"
+	],
+	[k]: [".pdf"],
+	[A]: [".heic"]
+}, M = [
+	E.Card,
+	E.Card,
+	E.PaypalDetailsPage,
+	E.BankWireDetails,
+	E.TransactionConfirmation,
+	E.SelfieWithIdCard,
+	E.PaymentSystemScreen,
+	E.Other
+], te = {
+	[E.Id]: { parts: [D.IdBack] },
+	[E.IdExtra]: { parts: [D.IdBack] }
+}, N = p.div`
+  display: flex;
+  align-items: center;
+  color: ${g};
+  margin-top: ${x * 2}px;
+  margin-bottom: ${x * 4}px;
+`, P = p.span`
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 14px;
+  height: 14px;
+  border-radius: 100%;
+  background-color: ${g};
 
-'use strict'
+  &:before {
+    font-size: ${v};
+    color: ${S};
+    content: '!';
+  }
+`, F = p.span`
+  margin-left: ${x * 2}px;
+`, I = (e) => /* @__PURE__ */ w(N, { children: [e.isDocumentPartError ? /* @__PURE__ */ C(P, {}) : /* @__PURE__ */ C(i, {
+	color: a.Error,
+	hoverColor: a.Error,
+	size: l.Small
+}), /* @__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) => {
+	let t = new FileReader();
+	return new Promise((n, r) => {
+		t.onload = () => n(t.result), t.onerror = (e) => r(e), t.readAsDataURL(e);
+	});
+}, V = p.div`
+  margin-top: ${x * 4}px;
+  margin-left: ${x * 4}px;
+`, H = p.div`
+  margin-bottom: ${x}px;
+`, U = p.div`
+  display: flex;
+  align-items: center;
+  background-color: ${b};
+  padding: ${x * 2}px;
+  border-radius: ${h}px;
+`, W = p.span`
+  width: 100%;
+  margin-left: ${x * 4}px;
+  margin-right: ${x * 2}px;
+`, G = p.span`
+  cursor: pointer !important;
+  margin-right: ${x * 2}px;
+`, K = p.div`
+  height: 66px;
+`, q = p.div`
+  display: flex;
+  flex-direction: column;
+  margin-top: ${x * 4}px;
+  margin-left: ${x * 4}px;
+`, J = p.img`
+  width: auto;
+  max-width: 204px;
+  height: 50px;
+  object-fit: contain;
+  border-radius: ${h}px;
+`, ae = p.div`
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  min-width: 50px;
+  height: 50px;
+  border-radius: ${h}px;
+  background-color: ${S};
+`, oe = (e) => {
+	let { data: t } = e, n = z(t), r = re(t);
+	return n || r ? /* @__PURE__ */ w(ae, { children: [n && /* @__PURE__ */ C(c, {
+		color: a.Gray,
+		hoverColor: a.Gray
+	}), r && /* @__PURE__ */ C(s, {
+		color: a.Gray,
+		hoverColor: a.Gray
+	})] }) : /* @__PURE__ */ C(J, { src: t });
+}, Y = {
+	KYCFormItemFileExtraPart: (e) => {
+		let { elementId: t, title: n, uploaderLabels: r, onFileAdd: i } = e;
+		return /* @__PURE__ */ w(q, {
+			id: t,
+			children: [n && /* @__PURE__ */ C(H, { children: n }), /* @__PURE__ */ C(K, { children: /* @__PURE__ */ C(u, {
+				title: r.title,
+				action: r.action,
+				maxSize: O,
+				acceptFormats: j,
+				elementId: `${t}_uploader`,
+				direction: d.Row,
+				onDrop: (e) => {
+					let [t] = e;
+					t && i(t);
+				}
+			}) })]
+		});
+	},
+	KYCFormItemFile: (e) => {
+		let { name: t, title: n, data: r, error: i, elementId: s, uploaderLabels: c, onFileChange: l, onFileRemove: f } = e;
+		return /* @__PURE__ */ w(V, {
+			id: s,
+			children: [
+				n && /* @__PURE__ */ C(H, { children: n }),
+				r ? /* @__PURE__ */ w(U, { children: [
+					/* @__PURE__ */ C(oe, { data: r }),
+					/* @__PURE__ */ C(W, { children: t }),
+					/* @__PURE__ */ C(G, {
+						onClick: f,
+						children: /* @__PURE__ */ C(o, {
+							color: a.Blue,
+							hoverColor: a.Blue
+						})
+					})
+				] }) : /* @__PURE__ */ C(K, { children: /* @__PURE__ */ C(u, {
+					title: c.title,
+					action: c.action,
+					maxSize: O,
+					acceptFormats: j,
+					elementId: `${s}_uploader`,
+					direction: d.Row,
+					onDrop: (e) => {
+						let [t] = e;
+						t && l(t);
+					}
+				}) }),
+				i && /* @__PURE__ */ C(I, {
+					label: i,
+					isDocumentPartError: !0
+				})
+			]
+		});
+	},
+	KYCFormItemText: (e) => {
+		let { onFeedbackChange: t, value: n = "" } = e, r = (e) => t(e);
+		return /* @__PURE__ */ C(V, { children: /* @__PURE__ */ C(f, {
+			onChange: r,
+			onBlur: r,
+			value: n,
+			errors: [],
+			name: "kyc-client-comments",
+			elementId: "kyc-feedback-textarea"
+		}) });
+	}
+}, se = p.div`
+  margin-top: ${x * 6}px;
+`, ce = p.div`
+  font-size: ${_}px;
+  font-weight: bold;
+  color: ${m};
+  margin-bottom: ${x}px;
+`, le = p.div`
+  font-size: ${v}px;
+  color: ${y};
+  margin-left: ${x * 4}px;
+`, X = (e, t) => `[${e}].parts[${t}].data`, ue = (e) => {
+	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) => {
+		let t = new Map(u);
+		t.set(X(n, e), i.oversizeError), d(t);
+	}, y = (e) => {
+		let t = new Map(u);
+		t.delete(X(n, e)), d(t);
+	}, b = (e, n, r) => {
+		let i = {
+			...e,
+			data: r
+		}, a = [...s];
+		a.splice(n, 1, i), l({
+			type: t,
+			parts: a
+		});
+	}, x = async (e, t) => {
+		if (!t) {
+			v(e);
+			return;
+		}
+		let n = s[e] ?? s[0];
+		if (!n) return;
+		let r = await ie(t);
+		b(n, e, r);
+		let i = new Map(g);
+		i.set(r, t.name), _(i), y(e);
+	}, S = (e) => {
+		let t = s[e];
+		if (!t) return;
+		b(t, e);
+		let n = s[e], r = new Map(g);
+		n?.data && B(n, s) && r.delete(n?.data), _(r), y(e);
+	}, T = (e) => {
+		if (e) return g.get(e);
+	}, E = (e, t) => {
+		let n = s[e] ?? s[0];
+		n && b(n, e, t);
+	};
+	return /* @__PURE__ */ w(se, {
+		id: o,
+		children: [
+			/* @__PURE__ */ C(ce, { children: `${n + 1}. ${a?.title}` }),
+			a?.description && /* @__PURE__ */ C(le, { children: a?.description }),
+			s.map((e, r) => {
+				let a = `kyc-form_item_file_${e.type}`, l = L(t), d = p?.[e.type], f = l ? void 0 : d?.title;
+				L(t) && e.data && (a = `${a}_${e.data?.substr(-32)}`, B(e, s) || (a = `${a}_${r}`));
+				let m = c?.[X(n, r)], h = u.get(X(n, r));
+				return e.type === D.Feedback ? /* @__PURE__ */ C(Y.KYCFormItemText, {
+					value: e.data,
+					onFeedbackChange: (e) => E(r, e)
+				}, a) : /* @__PURE__ */ C(Y.KYCFormItemFile, {
+					title: f,
+					data: e.data,
+					type: e.type,
+					name: T(e.data),
+					uploaderLabels: i,
+					error: h || m,
+					elementId: `${o}_part_${e.type}_${r}`,
+					onFileChange: (e) => x(r, e),
+					onFileRemove: () => S(r)
+				}, a);
+			}),
+			f && m && /* @__PURE__ */ C(Y.KYCFormItemFileExtraPart, {
+				elementId: `${o}_extra`,
+				title: h,
+				uploaderLabels: i,
+				onFileAdd: (e) => x(s.length, e)
+			})
+		]
+	});
+}, de = p.div`
+  display: flex;
+  flex-direction: column;
+`, Z = p.span`
+  margin-bottom: ${x * 8}px;
+`, fe = p.span`
+  color: ${y};
+`, pe = p.div`
+  display: flex;
+  flex-direction: column;
+`, me = p.span`
+  margin-bottom: ${x * 6}px;
+`, Q = {
+	KYCSuccessScreen: (e) => {
+		let { elementId: t, title: n, description: r, support: i } = e;
+		return /* @__PURE__ */ w(de, {
+			id: t,
+			children: [
+				/* @__PURE__ */ C(Z, { children: /* @__PURE__ */ C(T, {
+					show: !0,
+					elementId: `${t}_success`,
+					children: n
+				}) }),
+				r && /* @__PURE__ */ C(Z, { children: r }),
+				i && /* @__PURE__ */ C(fe, { children: i })
+			]
+		});
+	},
+	KYCFailScreen: (e) => {
+		let { elementId: t, title: n, support: r } = e;
+		return /* @__PURE__ */ w(pe, {
+			id: t,
+			children: [/* @__PURE__ */ C(me, { children: /* @__PURE__ */ C(I, {
+				label: n,
+				isDocumentPartError: !1
+			}) }), r]
+		});
+	}
+}, he = p.div`
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  width: 100%;
+`, ge = p.div`
+  font-size: ${_}px;
+`, _e = p.div`
+  width: 100%;
+  margin-bottom: ${x * 6}px;
+`, ve = p.div`
+  display: flex;
+  justify-content: flex-end;
+  width: 100%;
+`, $ = (i) => {
+	let { elementId: a, title: o, uploadButtonLabel: s, uploaderLabels: c, documentsLabels: l, documents: u, errors: d, isLoading: f, validator: p, onUploadClick: m } = i, [h, g] = r(u), [_, v] = r(!0);
+	n(() => {
+		g(u);
+	}, [u]), n(() => {
+		v(!p(h));
+	}, [h, p]);
+	let y = (e, t) => {
+		let n = [...h];
+		n.splice(e, 1, t), g(n);
+	};
+	return /* @__PURE__ */ w(he, {
+		id: a,
+		children: [
+			o && /* @__PURE__ */ C(ge, { children: o }),
+			/* @__PURE__ */ C(_e, { children: h.map((e, t) => {
+				let n = `kyc-form_item_${e.type}_${t}`;
+				return /* @__PURE__ */ C(ue, {
+					index: t,
+					type: e.type,
+					parts: e.parts,
+					documentLabels: l[e.type],
+					uploaderLabels: c,
+					errors: d,
+					elementId: `${a}_item_${e.type}`,
+					onDocumentChange: (e) => y(t, e)
+				}, n);
+			}) }),
+			/* @__PURE__ */ C(ve, { children: /* @__PURE__ */ C(e, {
+				elementId: `${a}_button`,
+				type: t.Primary,
+				isDisabled: _,
+				isLoading: f || !1,
+				onClick: () => m(h),
+				children: s
+			}) })
+		]
+	});
+};
+$.SuccessScreen = Q.KYCSuccessScreen, $.FailScreen = Q.KYCFailScreen;
+//#endregion
+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 };
 
-if (process.env.NODE_ENV === 'production') {
-  module.exports = require('./kyc-form.cjs.production.min.js')
-} else {
-  module.exports = require('./kyc-form.cjs.development.js')
-}
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +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, {ButtonType} 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          elementId={`${elementId}_button`}\n          type={ButtonType.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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"}