@mxenabled/connect-widget 2.5.1 → 2.5.3

package/dist/index.es.js

@@ -73878,12 +73878,14 @@ const DEFAULT_POLLING_STATE = {
   // previous response from last poll
   currentResponse: {},
   // current response
-  jobIsDone: false,
+  pollingIsDone: false,
   // whether or not we should stop polling
-  userMessage: CONNECTING_MESSAGES.STARTING
+  userMessage: CONNECTING_MESSAGES.STARTING,
   // message to show the end user
+  initialDataReady: false
+  // whether the initial data ready event has been sent
 };
-function pollMember(memberGuid, api, onPostMessage, sendAnalyticsEvent, clientLocale) {
+function pollMember(memberGuid, api, clientLocale) {
   return interval(3e3).pipe(
     switchMap(
       () => (
@@ -73892,13 +73894,7 @@ function pollMember(memberGuid, api, onPostMessage, sendAnalyticsEvent, clientLo
         defer(() => api.loadMemberByGuid(memberGuid, clientLocale)).pipe(
           mergeMap(
             (member) => defer(() => api.loadJob(member.most_recent_job_guid)).pipe(
-              map((job) => {
-                if (job.async_account_data_ready) {
-                  onPostMessage("connect/initialDataReady", { member_guid: member.guid });
-                  sendAnalyticsEvent(AnalyticEvents.INITIAL_DATA_READY, { member_guid: member.guid });
-                }
-                return member;
-              })
+              map((job) => ({ member, job }))
             )
           ),
           catchError((error) => of(error))
@@ -73916,13 +73912,18 @@ function pollMember(memberGuid, api, onPostMessage, sendAnalyticsEvent, clientLo
           // dont update previous response if this is an error
           previousResponse: isError ? acc.previousResponse : acc.currentResponse,
           // dont update current response if this is an error
-          currentResponse: isError ? acc.currentResponse : response
+          currentResponse: isError ? acc.currentResponse : response,
+          // preserve the initialDataReadySent flag
+          initialDataReady: acc.initialDataReady
         };
+        if (!isError && !acc.initialDataReady && response?.job?.async_account_data_ready) {
+          pollingState.initialDataReady = true;
+        }
         const [shouldStopPolling, messageKey] = handlePollingResponse(pollingState);
         return {
           ...pollingState,
           // we should keep polling based on the member
-          jobIsDone: isError ? false : shouldStopPolling,
+          pollingIsDone: isError ? false : shouldStopPolling,
           userMessage: messageKey
         };
       },
@@ -73931,8 +73932,9 @@ function pollMember(memberGuid, api, onPostMessage, sendAnalyticsEvent, clientLo
   );
 }
 function handlePollingResponse(pollingState) {
-  const polledMember = pollingState.currentResponse;
-  const previousMember = pollingState.previousResponse;
+  const polledMember = pollingState.currentResponse?.member || {};
+  const previousMember = pollingState.previousResponse?.member || {};
+  const polledJob = pollingState.currentResponse?.job || {};
   const justFinishedAggregating = previousMember.is_being_aggregated === true && polledMember.is_being_aggregated === false;
   const isNotAggregatingAtAll = previousMember.is_being_aggregated === false && polledMember.is_being_aggregated === false;
   if (polledMember.connection_status === ReadableStatuses$1.CHALLENGED) {
@@ -73941,6 +73943,9 @@ function handlePollingResponse(pollingState) {
   if (ProcessingStatuses.indexOf(polledMember.connection_status) !== -1) {
     return [false, CONNECTING_MESSAGES.VERIFYING];
   }
+  if (polledJob.async_account_data_ready) {
+    return [true, CONNECTING_MESSAGES.FINISHING];
+  }
   if (polledMember.connection_status === ReadableStatuses$1.CONNECTED) {
     if (polledMember.is_being_aggregated) {
       return [false, CONNECTING_MESSAGES.SYNCING];
@@ -76367,25 +76372,33 @@ const Connecting = (props) => {
   const activeJob = getActiveJob(jobSchedule);
   const needsToInitializeJobSchedule = jobSchedule.isInitialized === false;
   function handleMemberPoll(pollingState) {
-    if (pollingState.pollingCount > 15 && pollingState.currentResponse?.connection_status !== ReadableStatuses$1.PENDING) {
+    if (pollingState.pollingCount > 15 && pollingState.currentResponse?.member?.connection_status !== ReadableStatuses$1.PENDING) {
       setTimedOut(true);
     }
     const overrideStatusChanged = postMessageEventOverrides?.memberStatusUpdate?.getHasStatusChanged({
-      currentMember: pollingState.currentResponse,
-      previousMember: pollingState.previousResponse
+      currentMember: pollingState.currentResponse?.member,
+      previousMember: pollingState.previousResponse?.member
     });
     const overrideEventData = postMessageEventOverrides?.memberStatusUpdate?.createEventData?.({
       institution: selectedInstitution,
-      member: pollingState.currentResponse
+      member: pollingState.currentResponse?.member
     });
-    const statusChanged = pollingState.previousResponse?.connection_status !== pollingState.currentResponse?.connection_status;
+    const statusChanged = pollingState.previousResponse?.member?.connection_status !== pollingState.currentResponse?.member?.connection_status;
     const eventData = overrideEventData || {
-      member_guid: pollingState.currentResponse.guid,
-      connection_status: pollingState.currentResponse.connection_status
+      member_guid: pollingState.currentResponse?.member?.guid,
+      connection_status: pollingState.currentResponse?.member?.connection_status
     };
     if (pollingState.previousResponse != null && (statusChanged || overrideStatusChanged)) {
       onPostMessage("connect/memberStatusUpdate", eventData);
     }
+    if (pollingState.initialDataReady) {
+      onPostMessage("connect/initialDataReady", {
+        member_guid: pollingState.currentResponse?.member?.guid
+      });
+      sendAnalyticsEvent(AnalyticEvents.INITIAL_DATA_READY, {
+        member_guid: pollingState.currentResponse?.member?.guid
+      });
+    }
     setMessage(pollingState.userMessage);
   }
   useEffect(() => {
@@ -76485,14 +76498,14 @@ const Connecting = (props) => {
       return needsJobStarted ? startJob$ : of(currentMember);
     }).pipe(
       concatMap(
-        (member) => pollMember(member.guid, api, onPostMessage, sendAnalyticsEvent, clientLocale).pipe(
+        (member) => pollMember(member.guid, api, clientLocale).pipe(
           tap((pollingState) => handleMemberPoll(pollingState)),
-          filter((pollingState) => pollingState.jobIsDone),
+          filter((pollingState) => pollingState.pollingIsDone),
           pluck("currentResponse"),
           take(1),
-          mergeMap((polledMember) => {
+          mergeMap((polledResponse) => {
             const loadLatestJob$ = defer(() => api.loadJob(member.most_recent_job_guid)).pipe(
-              map((job) => ({ member: polledMember, job }))
+              map((job) => ({ member: polledResponse.member, job }))
             );
             return loadLatestJob$;
           })
@@ -78876,7 +78889,7 @@ const HowItWorks = ({ onContinue }) => {
   const getNextDelay = getDelay();
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { ref: containerRef, children: [
     /* @__PURE__ */ jsxRuntimeExports.jsx(SlideDown, { delay: getNextDelay(), children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: styles.body, children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx(D, { "data-test": "title-header", truncate: false, variant: "H2", children: __("Connect your institution with account numbers") }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx(D, { component: "h2", "data-test": "title-header", truncate: false, variant: "H2", children: __("Connect your institution with account numbers") }),
       /* @__PURE__ */ jsxRuntimeExports.jsx(
         InstructionList,
         {
@@ -78962,7 +78975,17 @@ const PersonalInfoForm = ({ accountDetails, onContinue }) => {
   }, [isSubmitting]);
   return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { ref: containerRef, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("form", { onSubmit: (e) => e.preventDefault(), children: [
     /* @__PURE__ */ jsxRuntimeExports.jsx(SlideDown, { delay: getNextDelay(), children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: styles.header, children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx(D, { "data-test": "title-header", style: styles.title, truncate: false, variant: "H2", children: __("Enter account holder information") }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx(
+        D,
+        {
+          component: "h2",
+          "data-test": "title-header",
+          style: styles.title,
+          truncate: false,
+          variant: "H2",
+          children: __("Enter account holder information")
+        }
+      ),
       /* @__PURE__ */ jsxRuntimeExports.jsx(
         D,
         {
@@ -79103,7 +79126,17 @@ const AccountInfo = (props) => {
     return /* @__PURE__ */ jsxRuntimeExports.jsx(FindAccountInfo, { onClose: () => setShowFindDetails(false), step: "accountInfo" });
   }
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { ref: containerRef, children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsx(SlideDown, { delay: getNextDelay(), children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: styles.header, children: /* @__PURE__ */ jsxRuntimeExports.jsx(D, { "data-test": "title-header", style: styles.title, truncate: false, variant: "H2", children: __("Enter account information") }) }) }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx(SlideDown, { delay: getNextDelay(), children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: styles.header, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+      D,
+      {
+        component: "h2",
+        "data-test": "title-header",
+        style: styles.title,
+        truncate: false,
+        variant: "H2",
+        children: __("Enter account information")
+      }
+    ) }) }),
     /* @__PURE__ */ jsxRuntimeExports.jsxs("form", { onSubmit: (e) => e.preventDefault(), children: [
       /* @__PURE__ */ jsxRuntimeExports.jsx(SlideDown, { delay: getNextDelay(), children: /* @__PURE__ */ jsxRuntimeExports.jsxs(FormControl$1, { component: "fieldset", sx: { width: "100%" }, children: [
         /* @__PURE__ */ jsxRuntimeExports.jsx(FormLabel$1, { component: "legend", children: __("Account type") }),
@@ -79114,7 +79147,7 @@ const AccountInfo = (props) => {
             row: true,
             sx: {
               justifyContent: "space-between",
-              padding: "0 0 32px 0",
+              padding: "0 0 16px 0",
               marginTop: tokens.Spacing.XSmall,
               "& > .ph-no-capture": {
                 width: "48%"
@@ -79423,7 +79456,17 @@ const ConfirmDetails = (props) => {
   }, [containerRef]);
   const handleEdit = (focus) => fadeOut(containerRef.current, "up", 300).then(() => onEditForm(focus));
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { ref: containerRef, children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsx(SlideDown, { delay: getNextDelay(), children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: styles.header, children: /* @__PURE__ */ jsxRuntimeExports.jsx(D, { "data-test": "title-header", style: styles.title, truncate: false, variant: "H2", children: __("Review your information") }) }) }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx(SlideDown, { delay: getNextDelay(), children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: styles.header, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+      D,
+      {
+        component: "h2",
+        "data-test": "title-header",
+        style: styles.title,
+        truncate: false,
+        variant: "H2",
+        children: __("Review your information")
+      }
+    ) }) }),
     props.shouldShowUserDetails && /* @__PURE__ */ jsxRuntimeExports.jsxs(SlideDown, { delay: getNextDelay(), children: [
       /* @__PURE__ */ jsxRuntimeExports.jsx(
         DetailReviewItem,
@@ -79562,7 +79605,17 @@ const ComeBack = ({ microdeposit, onDone }) => {
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { ref: containerRef, children: [
     /* @__PURE__ */ jsxRuntimeExports.jsx(SlideDown, { delay: 100, children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { "aria-hidden": true, "data-test": "svg-header", style: styles.svg, children: /* @__PURE__ */ jsxRuntimeExports.jsx(SvgComeBackGraphic, {}) }) }),
     /* @__PURE__ */ jsxRuntimeExports.jsx(SlideDown, { delay: 100, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: styles.header, children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx(D, { "data-test": "title-header", style: styles.title, truncate: false, variant: "H2", children: __("Check back soon") }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx(
+        D,
+        {
+          component: "h2",
+          "data-test": "title-header",
+          style: styles.title,
+          truncate: false,
+          variant: "H2",
+          children: __("Check back soon")
+        }
+      ),
       /* @__PURE__ */ jsxRuntimeExports.jsx(
         ProtectedText,
         {
@@ -79688,7 +79741,17 @@ const VerifyDeposits = ({ microdeposit, onSuccess }) => {
   }, [errors]);
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { ref: containerRef, children: [
     /* @__PURE__ */ jsxRuntimeExports.jsx(SlideDown, { children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: styles.header, children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx(D, { "data-test": "title-header", style: styles.title, truncate: false, variant: "H2", children: __("Enter deposit amounts") }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx(
+        D,
+        {
+          component: "h2",
+          "data-test": "title-header",
+          style: styles.title,
+          truncate: false,
+          variant: "H2",
+          children: __("Enter deposit amounts")
+        }
+      ),
       /* @__PURE__ */ jsxRuntimeExports.jsx("br", {}),
       /* @__PURE__ */ jsxRuntimeExports.jsx(
         ProtectedText,
@@ -79780,7 +79843,8 @@ const VerifyDeposits = ({ microdeposit, onSuccess }) => {
 const getStyles$k = (tokens) => ({
   header: {
     display: "flex",
-    flexDirection: "column"
+    flexDirection: "column",
+    marginBottom: tokens.Spacing.Large
   },
   title: {
     marginBottom: tokens.Spacing.XSmall
@@ -79867,7 +79931,7 @@ const MicrodepositErrors = ({
   };
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { ref: containerRef, children: [
     /* @__PURE__ */ jsxRuntimeExports.jsxs(SlideDown, { children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: styles.header, children: /* @__PURE__ */ jsxRuntimeExports.jsx(D, { style: styles.title, truncate: false, variant: "H2", children: getTitle() }) }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: styles.header, children: /* @__PURE__ */ jsxRuntimeExports.jsx(D, { component: "h2", style: styles.title, truncate: false, variant: "H2", children: getTitle() }) }),
       /* @__PURE__ */ jsxRuntimeExports.jsx(MessageBox, { style: styles.messageBox, variant: "error", children: /* @__PURE__ */ jsxRuntimeExports.jsx(D, { component: "p", role: "alert", truncate: false, variant: "ParagraphSmall", children: getMessage() }) })
     ] }),
     /* @__PURE__ */ jsxRuntimeExports.jsxs(SlideDown, { delay: 100, children: [
@@ -79986,7 +80050,17 @@ const Verifying = ({ microdeposit, onError, onSuccess }) => {
   }, [microdeposit.guid]);
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { ref: containerRef, children: [
     /* @__PURE__ */ jsxRuntimeExports.jsx(SlideDown, { children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: styles.header, children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx(D, { "data-test": "header-title", style: styles.title, truncate: false, variant: "H2", children: __("Verifying ...") }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx(
+        D,
+        {
+          component: "h2",
+          "data-test": "header-title",
+          style: styles.title,
+          truncate: false,
+          variant: "H2",
+          children: __("Verifying ...")
+        }
+      ),
       /* @__PURE__ */ jsxRuntimeExports.jsx(
         D,
         {
@@ -80043,7 +80117,17 @@ const Verified = ({ microdeposit, onDone }) => {
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { ref: containerRef, style: styles.container, children: [
     /* @__PURE__ */ jsxRuntimeExports.jsx(SlideDown, { children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { "aria-hidden": true, "data-test": "svg-header", style: styles.svg, children: /* @__PURE__ */ jsxRuntimeExports.jsx(SvgVerifiedGraphic, {}) }) }),
     /* @__PURE__ */ jsxRuntimeExports.jsx(SlideDown, { delay: 100, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: styles.header, children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx(D, { "data-test": "title-header", style: styles.title, truncate: false, variant: "H2", children: __("Deposits verified") }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx(
+        D,
+        {
+          component: "h2",
+          "data-test": "title-header",
+          style: styles.title,
+          truncate: false,
+          variant: "H2",
+          children: __("Deposits verified")
+        }
+      ),
       /* @__PURE__ */ jsxRuntimeExports.jsx(D, { "data-test": "verified-paragraph", truncate: false, variant: "Paragraph", children: __("You're almost done setting things up. Continue to your institution.") })
     ] }) }),
     /* @__PURE__ */ jsxRuntimeExports.jsx(SlideDown, { delay: 200, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
@@ -80562,6 +80646,7 @@ const VerifyExistingMember = (props) => {
     /* @__PURE__ */ jsxRuntimeExports.jsx(
       D,
       {
+        component: "h3",
         "data-test": "connected-institutions-text",
         sx: { marginBottom: tokens.Spacing.XSmall, fontWeight: 600 },
         truncate: false,