@zeniai/web-components 3.16.96 → 3.16.98

package/dist/BusinessVerificationPage-NqCFCrF9.js

@@ -1,716 +0,0 @@
-import { u as dt, j as a, g as mt, aw as pt, l as ut, h as ft, F as yt } from "./vendor-.pnpm-B2klaOGU.js";
-import { useState as ae, useCallback as ht, useEffect as De } from "react";
-import l from "@emotion/styled";
-import { reduceAllFetchState as gt, getFormattedAddress as M } from "@zeniai/client-epic-state";
-import { u as xt, aD as be, a as Oe, er as H, dM as Pe, ey as $e, ig as St, B as Ct, aE as wt, e as vt, aG as Tt, aP as Dt, aQ as bt, aR as Pt, A as $t, ao as It, S as r, R as C, E as Ve, ih as Bt, hM as Ie, hi as jt, H as Nt, b as Ft, o as Ae, aw as Lt, J as Ot, D as p } from "./index-CQQUoxL8.js";
-import { C as Vt, a as At } from "./CompanyOfficerDetailsSection-CgUBAx9k.js";
-const w = {
-  width: new C(343, 580, 726),
-  titleWidth: new C(343, 580, 726, 826),
-  subTitlePaddingTop: new C(12, p[3]),
-  subTitlePaddingBottom: new C(p[3], p[3]),
-  verificationDetailsRowGap: new C(12, p[5], p[5]),
-  termsPaddingLeftRight: new C(p[0], p[3]),
-  marginLeft: new C(p[4], p[0]),
-  containerPaddingLeft: new C(p[3], p[6], p[8]),
-  containerPaddingRight: new C(p[3], p[6], p[8]),
-  navBarContainerPaddingXaxis: new C(10, p[3])
-}, kt = {
-  stepTitle: new Lt("h6Regular", "h5Regular")
-}, Be = "businessVerificationPage", D = "companyDetails", b = "companyOfficerDetails", {
-  commonSetUp: { businessVerification: o },
-  common: {
-    settings: _t,
-    currency: je,
-    footer: Ne,
-    strings: { empty: Rt }
-  }
-} = Oe.getLocalizedStrings(), ma = ({
-  businessVerificationDetails: t,
-  allNationalityCountries: V,
-  verficationDetailsFetchState: N,
-  isRefreshingViewInBackground: A,
-  filesEndPoint: i,
-  authParams: k,
-  productType: h,
-  allIndustries: _,
-  companyTitles: R,
-  maxInsuredAmount: y,
-  isDisabled: I,
-  isSettings: s = !1,
-  isOverlay: g = !1,
-  analytics: x,
-  isStepInProgress: v = !1,
-  isTreasuryTransferInitiated: Z = !1,
-  transferDetails: z,
-  onOverlayClose: oe,
-  onAddressClick: ne,
-  onRegisteredAddressClick: _e,
-  onBackClick: F,
-  onGetOtp: Re,
-  onVerifyOtp: ze,
-  onResendOtp: Ee,
-  onSendForVerificationClick: Ue,
-  onEditFileName: se,
-  onCompanyDetailsChanged: We,
-  updateFilesEntity: ie,
-  onDeleteFile: re,
-  onDeleteFileList: Me,
-  onCompanyOfficerUpdated: He,
-  saveNewAddressInLocalStore: ce,
-  onSaveDetailsClick: Ze,
-  onClickMenuIcon: Ge,
-  onExecuteTreasuryTransfer: Xe
-}) => {
-  const qe = dt(), d = xt(), {
-    updateStatus: E,
-    companyView: L,
-    companyDetailsLocalData: c,
-    companyOfficerLocalData: T
-  } = t, Je = be(E.fetchState), U = L?.company.company.featuresActivationInfo.connectedAccountProvider, Qe = U === "unit" ? /* @__PURE__ */ a.jsxs(Xt, { children: [
-    o.terms.term1,
-    /* @__PURE__ */ a.jsx(
-      H,
-      {
-        href: o.terms.consentUrl,
-        onZeniLinkClick: () => (x?.trackBillPayAgreement(), !0),
-        linkText: o.terms.consent
-      }
-    ),
-    o.terms.term2,
-    /* @__PURE__ */ a.jsx(
-      H,
-      {
-        href: o.terms.depositUrl,
-        onZeniLinkClick: () => (x?.trackBillPayAgreement(), !0),
-        linkText: o.terms.depositTerms
-      }
-    ),
-    o.terms.term3,
-    /* @__PURE__ */ a.jsx(
-      H,
-      {
-        href: o.terms.privacyPolicyUrl,
-        onZeniLinkClick: () => (x?.trackBillPayAgreement(), !0),
-        linkText: o.terms.privacy
-      }
-    ),
-    o.terms.term4,
-    /* @__PURE__ */ a.jsx(
-      H,
-      {
-        href: o.terms.tosUrl,
-        onZeniLinkClick: () => (x?.trackBillPayPrivacyPolicy(), !0),
-        linkText: o.terms.tos
-      }
-    ),
-    o.terms.term5
-  ] }) : o.terms.termsForStripe, [Ke, G] = ae(!1), [W, le] = ae("save"), [X, Ye] = ae(!1), u = mt({
-    mode: "all",
-    reValidateMode: "onChange",
-    defaultValues: zt(
-      t,
-      _,
-      R,
-      V
-    )
-  }), { isValid: et } = u.formState, q = L?.company.company.companyBillPayInfo, J = L?.company.company.companyTreasuryInfo, B = h === "zeni_treasury" ? J?.companyVerificationStatus : q?.companyVerificationStatus, P = Object.values(T).findIndex(
-    (e) => e?.isSelectedForVerification === !0
-  ), $ = `Officer_${P < 0 ? 1 : P + 1}`, tt = () => {
-    const e = T[$], n = e?.email, f = e?.birthday?.toString(), m = e?.ownershipInCompany, S = e?.firstName, j = e?.lastName, Y = e?.titleAtCompany, O = e?.documentTypeSelectedForVerification, ue = e?.phone, fe = e?.addressStatus?.addressToCreate, ye = fe != null ? M(fe) : void 0, he = c?.companyDescription, ee = c?.companyLegalName, ge = c?.companyIndustry, xe = c?.phone, Se = c?.website, Ce = c?.addressStatus?.addressToCreate != null ? M(
-      c?.addressStatus?.addressToCreate
-    ) : void 0, te = c?.primaryContactLocalData, we = te?.firstName, ve = te?.lastName, Te = te?.email;
-    n != null && m != null && S != null && j != null && f != null && Y != null && ue != null && ye != null && O != null && he != null && ee != null && xe != null && Se != null && ge != null && ee != null && Ce != null && we != null && ve != null && Te != null && x?.trackBusinessVerificationSend(
-      {
-        email: n,
-        birthday: f.toString(),
-        companyOwnership: m,
-        firstName: S,
-        lastName: j,
-        companyRole: Y,
-        phone: ue,
-        formattedAddress: ye,
-        documentTypeForVerification: O
-      },
-      {
-        companyDescription: he,
-        legalName: ee,
-        phone: xe,
-        website: Se.toString(),
-        industry: ge,
-        formattedAddress: Ce
-      },
-      {
-        firstName: we,
-        lastName: ve,
-        email: Te
-      },
-      h,
-      s ? "Settings" : void 0
-    );
-  }, at = () => {
-    const e = T[$], n = c?.primaryContactLocalData, f = e?.email ?? "", m = !!e?.firstName && !!e?.lastName, S = n?.email ?? "", j = !!n?.firstName && !!n?.lastName;
-    return f && !m ? ((!e?.firstName || !e?.lastName) && u.trigger(
-      `${b}.${P < 0 ? 0 : P}.name`,
-      { shouldFocus: !0 }
-    ), !1) : S && !j ? ((!n?.firstName || !n?.lastName) && u.trigger(`${D}.primaryContactName`, {
-      shouldFocus: !0
-    }), !1) : !0;
-  }, ot = () => {
-    const e = T[$], n = c?.primaryContactLocalData, f = e?.email, m = n?.email;
-    if (f) {
-      if (!m)
-        return (n?.firstName || n?.lastName) && u.trigger(`${D}.primaryContactEmail`, {
-          shouldFocus: !0
-        }), !1;
-    } else if (e?.firstName || e?.lastName || e?.birthday || e?.nationalityCountryCode || e?.ownershipInCompany || e?.phone || e?.ssn || e?.titleAtCompany || e?.addressStatus?.addressToCreate || e?.fileIds != null && e?.fileIds.length > 0 || Q != null && Q?.length > 0)
-      return u.trigger(
-        `${b}.${P < 0 ? 0 : P}.email`,
-        { shouldFocus: !0 }
-      ), !1;
-    return !0;
-  }, nt = u.handleSubmit(() => {
-    if (W !== "verification" && le("verification"), U === "unit" && T[$]?.isPhoneVerified !== !0) {
-      u.setError(
-        `${b}.${P}.phone`,
-        {
-          type: "custom"
-        }
-      );
-      return;
-    }
-    const e = pt(
-      Object.values(T).map(
-        (m) => Object.values(m?.deleteFileStatusById ?? {}).filter(
-          (S) => S != null
-        )
-      )
-    ), n = Object.values(
-      c?.deleteFileStatusById ?? {}
-    ).filter((m) => m != null);
-    gt(
-      e.concat(n)
-    ).fetchState !== "In-Progress" && et && (tt(), Ue?.($), Z === !0 && Xe?.());
-  }), st = async (e, n) => {
-    e.includes(D) ? We?.(n[D]) : e.includes(b) && He?.(n[b]);
-  }, it = ht(
-    ut((e, n) => {
-      st(e, n);
-    }, 300),
-    []
-  );
-  De(() => {
-    const e = u.watch((n, { name: f }) => {
-      f != null && n != null && ft(
-        () => it(f, n)
-      );
-    });
-    return () => {
-      e.unsubscribe();
-    };
-  });
-  const de = be(
-    t.companyDetailsLocalData?.addressStatus
-  );
-  De(() => {
-    t.companyDetailsLocalData?.addressStatus?.addressToCreate != null && t.companyDetailsLocalData?.registeredAddressStatus?.addressToCreate == null && de == null && (ce?.(
-      "company_registered_address",
-      t.companyDetailsLocalData?.addressStatus?.addressToCreate
-    ), u.setValue(
-      `${D}.registeredAddress`,
-      t.companyDetailsLocalData?.addressStatus?.addressToCreate
-    ));
-  }, [
-    t.companyDetailsLocalData?.addressStatus,
-    t.companyDetailsLocalData?.registeredAddressStatus,
-    de,
-    ce,
-    u
-  ]);
-  const me = L?.companyOfficers.slice(0, 10).sort(
-    (e, n) => e.user.createTime?.isAfter(n.user.createTime) === !0 ? 1 : -1
-  ), Q = me?.map(
-    (e) => e.user
-  ), rt = me?.map(
-    (e) => e.role
-  ), ct = {
-    onOkClick: () => {
-      G(!1), F();
-      const e = [], n = L?.company.company.incInfo.fileIds ?? [];
-      u.getValues(
-        `${D}.fileIds`
-      ).forEach((m) => {
-        n.includes(m) || e.push(m);
-      }), rt?.forEach((m, S) => {
-        const j = m?.fileIds ?? [];
-        u.getValues(
-          `${b}.${S}.fileIds`
-        ).forEach((O) => {
-          j.includes(O) || e.push(O);
-        });
-      }), e.length !== 0 && Me?.(e);
-    },
-    onCancelClick: () => {
-      G(!1);
-    }
-  }, lt = Pe(
-    $e(y),
-    y,
-    je.currencySymbol
-  ).toUpperCase(), K = B?.code === "pending_review" || B?.code === "verified", pe = (z?.treasuryTransferMoneyLocalData?.amount?.amount ?? 0) > 0;
-  return h === "zeni_treasury" && B?.code === "pending_review" && // only on submit for verification
-  Je === "In-Progress" && E.fetchState === "Completed" ? /* @__PURE__ */ a.jsxs(ta, { children: [
-    /* @__PURE__ */ a.jsxs(aa, { children: [
-      /* @__PURE__ */ a.jsx(St, {}),
-      /* @__PURE__ */ a.jsx(oa, { windowSize: d, children: Z === !0 ? o.submittedTitleWithTransfer : o.submittedTitle }),
-      /* @__PURE__ */ a.jsx(ea, { isReadonly: !1, children: Z === !0 ? o.submittedDescriptionWithTransfer.replace(
-        "__amount__",
-        Pe(
-          $e(
-            z?.treasuryTransferMoneyLocalData?.amount?.amount ?? 0
-          ),
-          z?.treasuryTransferMoneyLocalData?.amount?.amount ?? 0,
-          je.currencySymbol
-        )
-      ).replace(
-        "__account__",
-        z?.treasuryTransferMoneyLocalData?.fromAccount?.label ?? ""
-      ) : o.submittedDescription })
-    ] }),
-    /* @__PURE__ */ a.jsx(
-      Ct,
-      {
-        label: o.submittedButton,
-        onClick: () => {
-          F(), oe?.();
-        },
-        variant: "primary"
-      }
-    )
-  ] }) : /* @__PURE__ */ a.jsxs(Et, { isSettings: s, children: [
-    /* @__PURE__ */ a.jsx(
-      wt,
-      {
-        title: g && v === !0 ? Rt : o.header,
-        backgroundColor: qe.colors.grey5,
-        style: { zIndex: X ? 1 : 4 },
-        onBackClick: () => {
-          Tt(u.formState.dirtyFields) ? G(!0) : F();
-        },
-        showBackButton: !s && !g,
-        showMenuIcon: s ? d === "medium-compact" || d === "small" : !1,
-        onClickMenuIcon: Ge,
-        rightSideComponent: g ? /* @__PURE__ */ a.jsx(
-          na,
-          {
-            "data-testid": vt(
-              "nav-bar-close-business-verification-overlay"
-            ),
-            onClick: () => {
-              F(), oe?.();
-            }
-          }
-        ) : null,
-        source: "BusinessVerificationPage"
-      }
-    ),
-    Ke === !0 ? /* @__PURE__ */ a.jsx(
-      Dt,
-      {
-        titleComponent: /* @__PURE__ */ a.jsx(Pt, { children: o.discardTitle }),
-        descriptionComponent: /* @__PURE__ */ a.jsx(bt, { children: o.discardDescription }),
-        primaryButtonText: o.discard,
-        secondaryButtonText: o.cancel,
-        action: ct
-      }
-    ) : null,
-    /* @__PURE__ */ a.jsxs(Mt, { windowSize: d, children: [
-      (!g || v === !1) && /* @__PURE__ */ a.jsx(Wt, { windowSize: d, children: s ? _t.infoText.businessVerification : o.title }),
-      N === "In-Progress" || N === "Not-Started" ? /* @__PURE__ */ a.jsx(Ht, { children: /* @__PURE__ */ a.jsx($t, { size: "ExtraLarge", start: !0 }) }) : /* @__PURE__ */ a.jsx(yt, { ...u, children: /* @__PURE__ */ a.jsxs("form", { id: Fe(Be), onSubmit: nt, children: [
-        g && v === !0 && /* @__PURE__ */ a.jsxs(Ut, { children: [
-          /* @__PURE__ */ a.jsxs(qt, { windowSize: d, children: [
-            /* @__PURE__ */ a.jsx(Jt, { windowSize: d, children: K ? o.businessVerificationDetails : pe ? o.verifyBusinessDetails : o.verifyBusinessDetailsWithoutTransfer }),
-            !K && /* @__PURE__ */ a.jsx(Qt, { children: /* @__PURE__ */ a.jsxs(Kt, { children: [
-              /* @__PURE__ */ a.jsx(Le, {}),
-              pe && /* @__PURE__ */ a.jsx(Le, {}),
-              /* @__PURE__ */ a.jsx(Yt, {})
-            ] }) })
-          ] }),
-          /* @__PURE__ */ a.jsx(ke, { isReadonly: K, children: o.verifyBusinessDetailsDescription })
-        ] }),
-        /* @__PURE__ */ a.jsxs(Zt, { children: [
-          /* @__PURE__ */ a.jsx(
-            Vt,
-            {
-              companyOfficerData: T,
-              allNationalityCountries: V,
-              allOfficers: Q ?? [],
-              sectionId: b,
-              isRefreshingViewInBackground: A,
-              connectedAccountProvider: U,
-              productType: "business_verification",
-              updateFilesEntity: ie,
-              onEditFileName: se,
-              onOfficerAddressClick: ne,
-              onDeleteFile: re,
-              isDisabled: I,
-              filesEndPoint: i,
-              authParams: k,
-              isPopupOpen: X,
-              openPopup: Ye,
-              onGetOtp: Re,
-              onVerifyOtp: ze,
-              onResendOtp: Ee,
-              companyTitles: R,
-              isForTreasury: h === "zeni_treasury",
-              isOverlay: g
-            }
-          ),
-          /* @__PURE__ */ a.jsx(
-            At,
-            {
-              companyDetails: c,
-              businessVerificationProps: {
-                companyVerificationStatus: B,
-                isRefreshingViewInBackground: A
-              },
-              productType: "business_verification",
-              showTreasuryFields: h === "zeni_treasury",
-              sectionId: D,
-              isDisabled: B?.code === "pending_review" || B?.code === "verified" ? "readonly" : I,
-              fileProps: {
-                authParams: k,
-                filesEndPoint: i,
-                onEditFileName: se,
-                onDeleteFile: re,
-                updateFilesEntity: ie
-              },
-              onCompanyAddressClick: ne,
-              onRegisteredAddressClick: _e,
-              connectedAccountProvider: U,
-              allIndustries: _
-            }
-          )
-        ] }),
-        h === "zeni_accounts" ? /* @__PURE__ */ a.jsx(Gt, { windowSize: d, children: o.threadText.replace(
-          "__amount__",
-          lt
-        ) }) : null
-      ] }) })
-    ] }),
-    N === "Completed" && (h === "zeni_treasury" ? J?.companyVerificationStatus?.code !== "pending_review" && J?.companyVerificationStatus?.code !== "verified" : q?.businessVerificationStatus?.code !== "pending_review" && q?.businessVerificationStatus?.code !== "verified") ? /* @__PURE__ */ a.jsx(
-      It,
-      {
-        formId: Fe(Be),
-        primaryBtn: {
-          label: v ? Ne.submit : o.sendForVerificationButton,
-          style: {
-            width: "auto",
-            minWidth: d === "small" ? "auto" : v ? "83px" : "181px"
-          },
-          isLoading: W === "verification" && E.fetchState === "In-Progress",
-          isDisabled: I != null
-        },
-        containerStyle: {
-          width: d === "small" ? w.width.valuePx(d) : "auto",
-          justifyContent: d === "small" ? "space-between" : "center"
-        },
-        helperStyle: {
-          width: d === "small" ? w.width.valuePx(d) : "auto",
-          paddingLeft: w.termsPaddingLeftRight.valuePx(d),
-          paddingRight: w.termsPaddingLeftRight.valuePx(d),
-          textAlign: d === "small" ? "center" : "initial"
-        },
-        showCancel: !0,
-        cancelBtn: {
-          reverseSpinnerColor: !1,
-          label: v ? Ne.back : o.saveDetailsButton,
-          style: {
-            width: d === "small" ? "auto" : v ? "83px" : "181px"
-          },
-          isLoading: W === "save" && E.fetchState === "In-Progress",
-          onClick: () => {
-            if (v)
-              F();
-            else {
-              const e = T[$], n = c?.primaryContactLocalData;
-              W !== "save" && le("save");
-              const f = e?.email ?? "", m = at(), S = ot();
-              m && S && (x?.trackBusinessVerificationSave(
-                {
-                  email: f,
-                  birthday: e?.birthday?.toString(),
-                  companyOwnership: e?.ownershipInCompany,
-                  firstName: e?.firstName,
-                  lastName: e?.lastName,
-                  companyRole: e?.titleAtCompany,
-                  phone: e?.phone,
-                  formattedAddress: e?.addressStatus?.addressToCreate != null ? M(
-                    e?.addressStatus?.addressToCreate
-                  ) : void 0,
-                  documentTypeForVerification: e?.documentTypeSelectedForVerification
-                },
-                {
-                  companyDescription: c?.companyDescription,
-                  legalName: c?.companyLegalName,
-                  phone: c?.phone,
-                  website: c?.website?.toString(),
-                  industry: c?.companyIndustry ?? "",
-                  formattedAddress: c?.addressStatus?.addressToCreate != null ? M(
-                    c?.addressStatus?.addressToCreate
-                  ) : void 0
-                },
-                {
-                  firstName: n?.firstName,
-                  lastName: n?.lastName,
-                  email: n?.email
-                },
-                h,
-                s ? "Settings" : void 0
-              ), Ze?.($));
-            }
-          }
-        },
-        helperText: Qe,
-        style: {
-          padding: `12px ${r.sp3}`,
-          zIndex: X ? 0 : 4
-        }
-      }
-    ) : null
-  ] });
-}, zt = (t, V, N, A) => {
-  const { companyDetailsLocalData: i, companyOfficerLocalData: k, companyView: h } = t, _ = Oe.getLocalizedStrings().companyPassport, R = h?.companyOfficers != null && h?.companyOfficers.length > 0;
-  return {
-    [D]: {
-      companyDescription: i?.companyDescription ?? "",
-      ein: i?.companyFiles.find(
-        (y) => y.documentType === "tax_ein"
-      ),
-      companyId: i?.companyId ?? "",
-      syncToken: i?.syncToken,
-      companyLegalName: i?.companyLegalName ?? "",
-      companyWebsite: i?.website?.toString() ?? "",
-      companyAddress: i?.addressStatus?.addressToCreate,
-      registeredAddress: i?.registeredAddressStatus?.addressToCreate,
-      companyIndustry: {
-        selectedOption: i?.companyIndustry,
-        allOptions: V?.map((y) => y.code)
-      },
-      companyPhone: i?.phone ?? "",
-      companyTaxId: i?.taxIdOrEIN ?? "",
-      primaryContactName: {
-        firstName: i?.primaryContactLocalData?.firstName ?? "",
-        lastName: i?.primaryContactLocalData?.lastName ?? ""
-      },
-      primaryContactEmail: i?.primaryContactLocalData?.email ?? "",
-      primaryContactUserId: i?.primaryContactLocalData?.userId,
-      primaryContactSyncToken: i?.primaryContactLocalData?.syncToken,
-      fileIds: i?.companyFiles.map(
-        (y) => y.fileId
-      ) ?? [],
-      certificateOfIncorporation: i?.companyFiles.find(
-        (y) => y.documentType === "certificate_of_incorporation"
-      ),
-      incDate: i?.incDate?.toDate(),
-      typeOfIncorporation: {
-        selectedOption: i?.typeOfIncorporation,
-        allOptions: _.companyIncInfo.allTypesOfIncorporation
-      },
-      sourceOfFunds: {
-        selectedOption: i?.sourceOfFunds ?? "",
-        allOptions: Object.keys(o.sourceOfFundOptions)
-      }
-    },
-    [b]: Object.values(
-      k
-    ).map((y, I) => {
-      const s = y, g = Bt(
-        s?.documentTypeSelectedForVerification
-      );
-      return {
-        userId: s?.userId,
-        officerType: s?.officerType ?? `Officer_${I + 1}`,
-        name: {
-          firstName: s?.firstName,
-          lastName: s?.lastName
-        },
-        email: s?.email,
-        fileIds: s?.fileIds ?? [],
-        dob: s?.birthday?.toDate(),
-        nationalityCountryCode: jt(
-          s?.nationalityCountryCode,
-          A.map((x) => x.countryCode)
-        ),
-        ssn: s?.ssn,
-        role: {
-          selectedOption: s?.titleAtCompany,
-          allOptions: N?.map((x) => x.code)
-        },
-        phone: s?.phone ?? "",
-        ownership: s?.ownershipInCompany,
-        officerAddress: s?.addressStatus?.addressToCreate,
-        selectDocument: {
-          front: Ie(
-            !0,
-            s?.userFiles ?? [],
-            g
-          ),
-          back: Ie(
-            !1,
-            s?.userFiles ?? [],
-            g
-          ),
-          selectDocumentType: g
-        },
-        isSelectedForVerification: !R && I === 0 ? !0 : s?.isSelectedForVerification ?? !1,
-        userVerificationStatus: s?.userVerificationStatus,
-        treasuryUserVerificationStatus: s?.treasuryUserVerificationStatus,
-        syncToken: s?.syncToken,
-        isPhoneVerified: s?.isPhoneVerified,
-        otpChallenge: s?.otpChallenge
-      };
-    })
-  };
-}, Fe = (t) => `${t}_form`, Et = l.div`
-  display: flex;
-  min-height: 100%;
-  flex-direction: column;
-  width: 100%;
-  row-gap: ${r.sp3};
-  background-color: ${(t) => t.isSettings ? "unset" : t.theme.colors.grey5};
-`, Ut = l.div`
-  display: flex;
-  flex-direction: column;
-  align-items: flex-start;
-  justify-content: center;
-  gap: ${r.sp1};
-  width: 100%;
-  padding-bottom: ${r.sp3};
-`, Wt = l(Ae)`
-  color: ${(t) => t.theme.colors.hero};
-  display: flex;
-  justify-content: center;
-  width: ${(t) => w.titleWidth.valuePx(t.windowSize)};
-  padding-top: ${(t) => w.subTitlePaddingTop.valuePx(t.windowSize)};
-  padding-bottom: ${(t) => w.subTitlePaddingBottom.valuePx(t.windowSize)};
-  text-align: ${(t) => t.windowSize === "small" ? "initial" : "center"};
-`, Mt = l.div`
-  display: flex;
-  justify-content: flex-start;
-  height: 100%;
-  overflow-y: auto;
-  flex-direction: column;
-  align-items: center;
-  padding-bottom: ${r.sp9};
-  row-gap: ${(t) => w.verificationDetailsRowGap.valuePx(t.windowSize)};
-`, Ht = l.div`
-  display: flex;
-  width: 100%;
-  height: calc(100vh - 110px);
-  flex-direction: row;
-  justify-content: center;
-  align-items: center;
-  background-color: ${(t) => t.theme.colors.grey4};
-`, Zt = l.div`
-  display: flex;
-  flex-direction: column;
-  row-gap: ${r.sp11};
-`, Gt = l(Ve)`
-  margin-top: ${r.sp2};
-  padding: ${r.sp2} ${r.sp2};
-  text-align: center;
-  color: ${(t) => t.theme.colors.grey1};
-  width: ${(t) => w.width.valuePx(t.windowSize)};
-`, Xt = l(Ve)`
-  text-align: center;
-  max-width: 750px;
-  color: ${(t) => t.theme.colors.hero};
-`, qt = l.div`
-  display: flex;
-  flex-direction: column;
-  gap: ${r.sp3};
-  width: 100%;
-`, Jt = l(Ot)`
-  ${(t) => `${kt.stepTitle.style(t.windowSize)}`};
-  color: ${(t) => t.theme.colors.primary};
-  text-align: left;
-`, Qt = l.div`
-  display: flex;
-  align-items: center;
-  overflow: hidden;
-  gap: ${r.sp2};
-`, Kt = l.div`
-  display: flex;
-  width: 100%;
-  gap: ${r.sp3};
-`, Le = l.div`
-  flex: 1;
-  height: 2px;
-  background-color: ${(t) => t.theme.colors.primary};
-  border-radius: ${r.sp2};
-`, Yt = l.div`
-  flex: 1;
-  height: 2px;
-  background-color: ${(t) => t.theme.colors.grey3};
-  border-radius: ${r.sp2};
-  position: relative;
-  overflow: hidden;
-
-  &::after {
-    content: "";
-    position: absolute;
-    top: 0;
-    left: 0;
-    height: 100%;
-    width: 100%;
-    background-color: ${(t) => t.theme.colors.primary};
-    animation: fillProgress 1s ease-in-out forwards;
-  }
-
-  @keyframes fillProgress {
-    0% {
-      transform: translateX(-100%);
-    }
-    100% {
-      transform: translateX(0%);
-    }
-  }
-`, ke = l(Ae)`
-  color: ${(t) => t.theme.colors.hero};
-  margin-top: ${(t) => t.isReadonly ? r.sp0 : r.sp3};
-  white-space: pre-line;
-`, ea = l(ke)`
-  margin-top: ${r.sp0};
-  text-align: center;
-`, ta = l.div`
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  gap: ${r.sp5};
-  margin: auto;
-`, aa = l.div`
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  gap: ${r.sp3};
-`, oa = l(Nt)`
-  color: ${(t) => t.theme.colors.primary};
-  white-space: pre-line;
-  text-align: center;
-`, na = l(Ft)`
-  cursor: pointer;
-  color: ${(t) => t.theme.colors.hero};
-  width: ${r.sp4};
-  height: ${r.sp4};
-  min-height: ${r.sp4};
-  &:hover {
-    color: ${(t) => t.theme.colors.primary};
-  }
-`;
-export {
-  ma as default,
-  Fe as uniqueName
-};