@mxenabled/connect-widget 2.11.1 → 2.12.1

package/dist/index.es.js

@@ -5099,39 +5099,23 @@ function baseFindIndex$2(array, predicate, fromIndex, fromRight) {
 }
 var _baseFindIndex = baseFindIndex$2;
 
-var _trimmedEndIndex;
-var hasRequired_trimmedEndIndex;
-
-function require_trimmedEndIndex () {
-	if (hasRequired_trimmedEndIndex) return _trimmedEndIndex;
-	hasRequired_trimmedEndIndex = 1;
-	var reWhitespace = /\s/;
-	function trimmedEndIndex(string) {
-	  var index = string.length;
-	  while (index-- && reWhitespace.test(string.charAt(index))) {
-	  }
-	  return index;
-	}
-	_trimmedEndIndex = trimmedEndIndex;
-	return _trimmedEndIndex;
+var reWhitespace = /\s/;
+function trimmedEndIndex$1(string) {
+  var index = string.length;
+  while (index-- && reWhitespace.test(string.charAt(index))) {
+  }
+  return index;
 }
+var _trimmedEndIndex = trimmedEndIndex$1;
 
-var _baseTrim;
-var hasRequired_baseTrim;
-
-function require_baseTrim () {
-	if (hasRequired_baseTrim) return _baseTrim;
-	hasRequired_baseTrim = 1;
-	var trimmedEndIndex = require_trimmedEndIndex();
-	var reTrimStart = /^\s+/;
-	function baseTrim(string) {
-	  return string ? string.slice(0, trimmedEndIndex(string) + 1).replace(reTrimStart, "") : string;
-	}
-	_baseTrim = baseTrim;
-	return _baseTrim;
+var trimmedEndIndex = _trimmedEndIndex;
+var reTrimStart = /^\s+/;
+function baseTrim$1(string) {
+  return string ? string.slice(0, trimmedEndIndex(string) + 1).replace(reTrimStart, "") : string;
 }
+var _baseTrim = baseTrim$1;
 
-var baseTrim = require_baseTrim(), isObject$7 = isObject_1, isSymbol$1 = isSymbol_1;
+var baseTrim = _baseTrim, isObject$7 = isObject_1, isSymbol$1 = isSymbol_1;
 var NAN = 0 / 0;
 var reIsBadHex = /^[-+]0x[0-9a-f]+$/i;
 var reIsBinary = /^0b[01]+$/i;
@@ -8613,7 +8597,7 @@ var hasRequiredTrim;
 function requireTrim () {
 	if (hasRequiredTrim) return trim_1;
 	hasRequiredTrim = 1;
-	var baseToString = _baseToString, baseTrim = require_baseTrim(), castSlice = require_castSlice(), charsEndIndex = require_charsEndIndex(), charsStartIndex = require_charsStartIndex(), stringToArray = require_stringToArray(), toString = toString_1;
+	var baseToString = _baseToString, baseTrim = _baseTrim, castSlice = require_castSlice(), charsEndIndex = require_charsEndIndex(), charsStartIndex = require_charsStartIndex(), stringToArray = require_stringToArray(), toString = toString_1;
 	function trim(string, chars, guard) {
 	  string = toString(string);
 	  if (string && (guard || chars === void 0)) {
@@ -9051,7 +9035,8 @@ const configSlice = createSlice({
   name: "config",
   initialState: initialState$6,
   reducers: {
-    addVerificationData: (state) => {
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    addVerificationData: (state, _) => {
       if (state.mode === AGG_MODE) {
         state.include_transactions = true;
       }
@@ -9062,7 +9047,8 @@ const configSlice = createSlice({
         state.use_cases = ["MONEY_MOVEMENT"];
       }
     },
-    addAggregationData: (state) => {
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    addAggregationData: (state, _) => {
       state.include_transactions = true;
       if (Array.isArray(state.use_cases)) {
         state.use_cases.push("PFM");
@@ -9150,6 +9136,13 @@ const selectConnectConfig = createSelector(selectConfig, (config) => ({
   use_cases: config.use_cases,
   additional_product_option: config.additional_product_option
 }));
+const selectCurrentMode = createSelector(selectConfig, (config) => ({
+  mode: config.mode,
+  isInAggMode: config.mode === AGG_MODE,
+  isInVerifyMode: config.mode === VERIFY_MODE,
+  isInTaxMode: config.mode === TAX_MODE,
+  isInRewardMode: config.mode === REWARD_MODE
+}));
 const selectColorScheme = (state) => state.config.color_scheme;
 const getIsLightColorScheme = createSelector(
   selectColorScheme,
@@ -54620,61 +54613,6 @@ GenericError.propTypes = {
   title: PropTypes$1.string.isRequired
 };
 
-var assignValue = _assignValue, castPath$1 = _castPath, isIndex = _isIndex, isObject$1 = isObject_1, toKey = _toKey;
-function baseSet$1(object, path, value, customizer) {
-  if (!isObject$1(object)) {
-    return object;
-  }
-  path = castPath$1(path, object);
-  var index = -1, length = path.length, lastIndex = length - 1, nested = object;
-  while (nested != null && ++index < length) {
-    var key = toKey(path[index]), newValue = value;
-    if (key === "__proto__" || key === "constructor" || key === "prototype") {
-      return object;
-    }
-    if (index != lastIndex) {
-      var objValue = nested[key];
-      newValue = customizer ? customizer(objValue, key, nested) : void 0;
-      if (newValue === void 0) {
-        newValue = isObject$1(objValue) ? objValue : isIndex(path[index + 1]) ? [] : {};
-      }
-    }
-    assignValue(nested, key, newValue);
-    nested = nested[key];
-  }
-  return object;
-}
-var _baseSet = baseSet$1;
-
-var baseGet = _baseGet, baseSet = _baseSet, castPath = _castPath;
-function basePickBy$2(object, paths, predicate) {
-  var index = -1, length = paths.length, result = {};
-  while (++index < length) {
-    var path = paths[index], value = baseGet(object, path);
-    if (predicate(value, path)) {
-      baseSet(result, castPath(path, object), value);
-    }
-  }
-  return result;
-}
-var _basePickBy = basePickBy$2;
-
-var basePickBy$1 = _basePickBy, hasIn = hasIn_1;
-function basePick$1(object, paths) {
-  return basePickBy$1(object, paths, function(value, path) {
-    return hasIn(object, path);
-  });
-}
-var _basePick = basePick$1;
-
-var basePick = _basePick, flatRest = _flatRest;
-var pick = flatRest(function(object, paths) {
-  return object == null ? {} : basePick(object, paths);
-});
-var pick_1 = pick;
-
-const _pick = /*@__PURE__*/getDefaultExportFromCjs(pick_1);
-
 var baseKeys = _baseKeys, getTag = _getTag, isArguments = isArguments_1, isArray$4 = isArray_1, isArrayLike$3 = isArrayLike_1, isBuffer = isBufferExports, isPrototype = _isPrototype, isTypedArray = isTypedArray_1;
 var mapTag = "[object Map]", setTag = "[object Set]";
 var objectProto$1 = Object.prototype;
@@ -62710,17 +62648,18 @@ const scrollToTop = (ref) => {
   return ref.current?.scrollIntoView(true);
 };
 
-const Disclosure = React__default.forwardRef((props, disclosureRef) => {
-  const { mode, onContinue, size } = props;
+const Disclosure = React__default.forwardRef((_, disclosureRef) => {
   const containerRef = useRef(null);
   useAnalyticsPath(...PageviewInfo.CONNECT_DISCLOSURE);
+  size === "small";
   const tokens = useTokens();
   const styles = getStyles$1C(tokens);
   const getNextDelay = getDelay();
   const [showPrivacyPolicy, setShowPrivacyPolicy] = useState(false);
-  const IS_IN_AGG_MODE = mode === AGG_MODE;
-  const IS_IN_TAX_MODE = mode === TAX_MODE;
-  const IS_IN_VERIFY_MODE = mode === VERIFY_MODE;
+  const { isInAggMode, isInTaxMode, isInVerifyMode } = useSelector(selectCurrentMode);
+  const connectConfig = useSelector(selectConnectConfig);
+  const size = useSelector(getSize);
+  const dispatch = useDispatch();
   useImperativeHandle(disclosureRef, () => {
     return {
       handleBackButton() {
@@ -62745,15 +62684,15 @@ const Disclosure = React__default.forwardRef((props, disclosureRef) => {
             "This app will have access to the information below unless you choose to disconnect:"
           ) }),
           /* @__PURE__ */ jsxRuntimeExports.jsxs("ul", { "data-test": "disclosure-list", style: styles.dataList, children: [
-            IS_IN_AGG_MODE && /* @__PURE__ */ jsxRuntimeExports.jsxs(Fragment, { children: [
+            isInAggMode && /* @__PURE__ */ jsxRuntimeExports.jsxs(Fragment, { children: [
               /* @__PURE__ */ jsxRuntimeExports.jsx("li", { className: dist.css(styles.listItem), "data-test": "disclosure-agg-mode-list-item1", children: /* @__PURE__ */ jsxRuntimeExports.jsx(D, { truncate: false, variant: "Paragraph", children: __("Account details") }) }),
               /* @__PURE__ */ jsxRuntimeExports.jsx("li", { className: dist.css(styles.listItem), "data-test": "disclosure-agg-mode-list-item2", children: /* @__PURE__ */ jsxRuntimeExports.jsx(D, { truncate: false, variant: "Paragraph", children: __("Account balances and transactions") }) })
             ] }),
-            IS_IN_TAX_MODE && /* @__PURE__ */ jsxRuntimeExports.jsxs(Fragment, { children: [
+            isInTaxMode && /* @__PURE__ */ jsxRuntimeExports.jsxs(Fragment, { children: [
               /* @__PURE__ */ jsxRuntimeExports.jsx("li", { className: dist.css(styles.listItem), "data-test": "disclosure-tax-mode-list-item1", children: /* @__PURE__ */ jsxRuntimeExports.jsx(D, { truncate: false, variant: "Paragraph", children: __("Basic account information") }) }),
               /* @__PURE__ */ jsxRuntimeExports.jsx("li", { className: dist.css(styles.listItem), "data-test": "disclosure-tax-mode-list-item2", children: /* @__PURE__ */ jsxRuntimeExports.jsx(D, { truncate: false, variant: "Paragraph", children: __("Tax documents") }) })
             ] }),
-            IS_IN_VERIFY_MODE && /* @__PURE__ */ jsxRuntimeExports.jsxs(Fragment, { children: [
+            isInVerifyMode && /* @__PURE__ */ jsxRuntimeExports.jsxs(Fragment, { children: [
               /* @__PURE__ */ jsxRuntimeExports.jsx("li", { className: dist.css(styles.listItem), "data-test": "disclosure-ver-mode-list-item1", children: /* @__PURE__ */ jsxRuntimeExports.jsx(D, { truncate: false, variant: "Paragraph", children: __("Routing and account numbers") }) }),
               /* @__PURE__ */ jsxRuntimeExports.jsx("li", { className: dist.css(styles.listItem), "data-test": "disclosure-ver-mode-list-item2", children: /* @__PURE__ */ jsxRuntimeExports.jsx(D, { truncate: false, variant: "Paragraph", children: __("Account balances") }) })
             ] })
@@ -62810,7 +62749,12 @@ const Disclosure = React__default.forwardRef((props, disclosureRef) => {
             {
               "data-test": "disclosure-continue",
               onClick: () => {
-                fadeOut(containerRef.current, "up", 300).then(() => onContinue());
+                fadeOut(containerRef.current, "up", 300).then(
+                  () => dispatch({
+                    type: ActionTypes$2.ACCEPT_DISCLOSURE,
+                    payload: connectConfig
+                  })
+                );
               },
               variant: "contained",
               children: _p("connect/disclosure/button", "Continue")
@@ -62874,11 +62818,6 @@ const getStyles$1C = (tokens) => {
     }
   };
 };
-Disclosure.propTypes = {
-  mode: PropTypes$1.string.isRequired,
-  onContinue: PropTypes$1.func.isRequired,
-  size: PropTypes$1.string.isRequired
-};
 Disclosure.displayName = "Disclosure";
 
 /******************************************************************************
@@ -64646,7 +64585,7 @@ var now$1 = function() {
 };
 var now_1 = now$1;
 
-var isObject = isObject_1, now = now_1, toNumber = toNumber_1;
+var isObject$1 = isObject_1, now = now_1, toNumber = toNumber_1;
 var FUNC_ERROR_TEXT = "Expected a function";
 var nativeMax$2 = Math.max, nativeMin = Math.min;
 function debounce$1(func, wait, options) {
@@ -64655,7 +64594,7 @@ function debounce$1(func, wait, options) {
     throw new TypeError(FUNC_ERROR_TEXT);
   }
   wait = toNumber(wait) || 0;
-  if (isObject(options)) {
+  if (isObject$1(options)) {
     leading = !!options.leading;
     maxing = "maxWait" in options;
     maxWait = maxing ? nativeMax$2(toNumber(options.maxWait) || 0, wait) : maxWait;
@@ -69741,6 +69680,153 @@ const INSTITUTION_TYPES = {
 const SEARCH_PER_PAGE_DEFAULT = 25;
 const SEARCH_PAGE_DEFAULT = 1;
 
+var assignValue = _assignValue, castPath$1 = _castPath, isIndex = _isIndex, isObject = isObject_1, toKey = _toKey;
+function baseSet$1(object, path, value, customizer) {
+  if (!isObject(object)) {
+    return object;
+  }
+  path = castPath$1(path, object);
+  var index = -1, length = path.length, lastIndex = length - 1, nested = object;
+  while (nested != null && ++index < length) {
+    var key = toKey(path[index]), newValue = value;
+    if (key === "__proto__" || key === "constructor" || key === "prototype") {
+      return object;
+    }
+    if (index != lastIndex) {
+      var objValue = nested[key];
+      newValue = customizer ? customizer(objValue, key, nested) : void 0;
+      if (newValue === void 0) {
+        newValue = isObject(objValue) ? objValue : isIndex(path[index + 1]) ? [] : {};
+      }
+    }
+    assignValue(nested, key, newValue);
+    nested = nested[key];
+  }
+  return object;
+}
+var _baseSet = baseSet$1;
+
+var baseGet = _baseGet, baseSet = _baseSet, castPath = _castPath;
+function basePickBy$2(object, paths, predicate) {
+  var index = -1, length = paths.length, result = {};
+  while (++index < length) {
+    var path = paths[index], value = baseGet(object, path);
+    if (predicate(value, path)) {
+      baseSet(result, castPath(path, object), value);
+    }
+  }
+  return result;
+}
+var _basePickBy = basePickBy$2;
+
+var basePickBy$1 = _basePickBy, hasIn = hasIn_1;
+function basePick$1(object, paths) {
+  return basePickBy$1(object, paths, function(value, path) {
+    return hasIn(object, path);
+  });
+}
+var _basePick = basePick$1;
+
+var basePick = _basePick, flatRest = _flatRest;
+var pick = flatRest(function(object, paths) {
+  return object == null ? {} : basePick(object, paths);
+});
+var pick_1 = pick;
+
+const _pick = /*@__PURE__*/getDefaultExportFromCjs(pick_1);
+
+const defaultApiValue = {
+  // Accounts
+  createAccount: () => Promise.resolve({}),
+  // Members
+  addMember: () => Promise.resolve({}),
+  deleteMember: () => Promise.resolve(),
+  getMemberCredentials: () => Promise.resolve([]),
+  loadMemberByGuid: () => Promise.resolve({}),
+  loadMembers: () => Promise.resolve([]),
+  // Institutions
+  getInstitutionCredentials: () => Promise.resolve([]),
+  loadDiscoveredInstitutions: () => Promise.resolve([]),
+  loadInstitutionByCode: () => Promise.resolve({}),
+  loadInstitutions: () => Promise.resolve([]),
+  loadInstitutionByGuid: () => Promise.resolve({}),
+  loadPopularInstitutions: () => Promise.resolve([]),
+  // Microdeposits
+  createMicrodeposit: () => Promise.resolve({}),
+  loadMicrodepositByGuid: () => Promise.resolve({}),
+  refreshMicrodepositStatus: () => Promise.resolve(),
+  updateMember: () => Promise.resolve({}),
+  updateMFA: () => Promise.resolve({}),
+  updateMicrodeposit: () => Promise.resolve({}),
+  verifyMicrodeposit: () => Promise.resolve({}),
+  verifyRoutingNumber: () => Promise.resolve({}),
+  //OAuth
+  loadOAuthState: () => Promise.resolve({}),
+  loadOAuthStates: () => Promise.resolve([]),
+  oAuthStart: () => Promise.resolve(),
+  // Support
+  createSupportTicket: () => Promise.resolve(),
+  //Job
+  loadJob: () => Promise.resolve({}),
+  runJob: () => Promise.resolve({}),
+  // User
+  updateUserProfile: () => Promise.resolve({})
+};
+const ApiContext = React$1.createContext(defaultApiValue);
+const ApiProvider = ({ apiValue, children }) => {
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(ApiContext.Provider, { value: { ...defaultApiValue, ...apiValue }, children });
+};
+const useApi = () => {
+  const context = React$1.useContext(ApiContext);
+  if (context === void 0) {
+    throw new Error("useApi must be used within a ApiProvider");
+  }
+  return { api: context };
+};
+
+const useSelectInstitution = () => {
+  const { api } = useApi();
+  const [institution, setInstitution] = useState(null);
+  const dispatch = useDispatch();
+  const consentIsEnabled = useSelector((state) => isConsentEnabled(state));
+  const connectConfig = useSelector(selectConnectConfig);
+  const handleSelectInstitution = useCallback(
+    (institution2) => {
+      setInstitution(institution2);
+    },
+    [institution]
+  );
+  useEffect(() => {
+    if (!institution) return () => {
+    };
+    const selectInstitution$ = from(api.loadInstitutionByGuid(institution.guid)).pipe(
+      map((insWithCreds) => {
+        return dispatch({
+          type: ActionTypes$2.SELECT_INSTITUTION_SUCCESS,
+          payload: {
+            institution: {
+              ...insWithCreds,
+              is_disabled_by_client: institutionIsBlockedForCostReasons(institution)
+              // Temporary workaround till backend/core is fixed
+            },
+            consentIsEnabled: consentIsEnabled || false,
+            additionalProductOption: connectConfig?.additional_product_option || null
+          }
+        });
+      }),
+      catchError((err) => {
+        setInstitution(null);
+        return of(selectInstitutionError(err));
+      })
+    ).subscribe((action) => {
+      setInstitution(null);
+      dispatch(action);
+    });
+    return () => selectInstitution$.unsubscribe();
+  }, [institution]);
+  return { handleSelectInstitution };
+};
+
 const InstitutionGridTile = (props) => {
   const { institution, selectInstitution } = props;
   const tokens = useTokens();
@@ -69892,21 +69978,30 @@ InstituionGrid.propTypes = {
 
 const PopularInstitutionsList = (props) => {
   useAnalyticsPath(...PageviewInfo.CONNECT_SEARCH_POPULAR);
-  const {
-    institutions,
-    handleSelectInstitution,
-    onAddManualAccountClick,
-    onSearchInstitutionClick,
-    enableManualAccounts
-  } = props;
+  const { handleSelectInstitution } = useSelectInstitution();
+  const postMessage = useContext(PostMessageContext);
+  const { institutions, onSearchInstitutionClick } = props;
   const getNextDelay = getDelay();
   const tokens = useTokens();
   const styles = getStyles$1q(tokens);
+  const dispatch = useDispatch();
+  const enableManualAccounts = useSelector((state) => {
+    const isManualAccountsEnabled = state.profiles.widgetProfile?.enable_manual_accounts;
+    const { isInAggMode } = selectCurrentMode(state);
+    const hasAtriumAPI = state.profiles.client?.has_atrium_api;
+    return isManualAccountsEnabled && isInAggMode && !hasAtriumAPI;
+  });
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: styles.listContainer, children: [
     /* @__PURE__ */ jsxRuntimeExports.jsx(SlideDown, { delay: getNextDelay(), children: /* @__PURE__ */ jsxRuntimeExports.jsx(
       InstituionGrid,
       {
-        handleSelectInstitution,
+        handleSelectInstitution: (institution) => {
+          postMessage.onPostMessage(
+            "connect/selectedInstitution",
+            _pick(institution, ["name", "guid", "url", "code"])
+          );
+          handleSelectInstitution(institution);
+        },
         institutions: institutions.filter((institution) => !institution.is_disabled_by_client),
         posthogEvent: AnalyticEvents.SELECT_POPULAR_INSTITUTION
       }
@@ -69926,7 +70021,7 @@ const PopularInstitutionsList = (props) => {
         Button$2,
         {
           "data-test": "add-account-manually-button",
-          onClick: onAddManualAccountClick,
+          onClick: () => dispatch(stepToAddManualAccount$1()),
           variant: "text",
           children: __("Add account manually")
         }
@@ -69974,10 +70069,7 @@ const getStyles$1q = (tokens) => {
   };
 };
 PopularInstitutionsList.propTypes = {
-  enableManualAccounts: PropTypes$1.bool.isRequired,
-  handleSelectInstitution: PropTypes$1.func.isRequired,
   institutions: PropTypes$1.array.isRequired,
-  onAddManualAccountClick: PropTypes$1.func.isRequired,
   onSearchInstitutionClick: PropTypes$1.func.isRequired
 };
 
@@ -70138,25 +70230,42 @@ InstitutionTile.propTypes = {
 const SearchedInstitutionsList = (props) => {
   useAnalyticsPath(...PageviewInfo.CONNECT_SEARCHED);
   const sendAnalyticsEvent = useAnalyticsEvent();
+  const postMessage = useContext(PostMessageContext);
   const {
     currentSearchResults,
-    enableManualAccounts,
-    enableSupportRequests,
     institutions,
     institutionSearch,
-    isMicrodepositsEnabled,
-    handleSelectInstitution,
-    onAddManualAccountClick,
     onRequestInstitution,
-    onVerifyWithMicrodeposits,
     setAriaLiveRegionMessage
   } = props;
   const tokens = useTokens();
   const styles = getStyles$1o(tokens);
   const getNextDelay = getDelay();
-  const clientUsesOauth = useSelector((state) => state.profiles.clientProfile.uses_oauth ?? false);
   const [currentPage, setCurrentPage] = useState(SEARCH_PAGE_DEFAULT);
   const [isLoadingInstitutions, setIsLoadingInstitutions] = useState(false);
+  const dispatch = useDispatch();
+  const clientUsesOauth = useSelector((state) => state.profiles.clientProfile.uses_oauth ?? false);
+  const enableManualAccounts = useSelector((state) => {
+    const isManualAccountsEnabled = state.profiles.widgetProfile?.enable_manual_accounts;
+    const { isInAggMode } = selectCurrentMode(state);
+    const hasAtriumAPI = state.profiles.client?.has_atrium_api;
+    return isManualAccountsEnabled && isInAggMode && !hasAtriumAPI;
+  });
+  const enableSupportRequests = useSelector((state) => {
+    const isSupportEnabled = state.profiles.widgetProfile?.enable_support_requests;
+    const { isInAggMode } = selectCurrentMode(state);
+    return isSupportEnabled && isInAggMode;
+  });
+  const isMicrodepositsEnabled = useSelector((state) => {
+    const { isVerifyMode } = selectCurrentMode(state);
+    const clientProfile = state.profiles.clientProfile || {};
+    const widgetProfile = state.profiles.widgetProfile || {};
+    return isVerifyMode && // Widget is in Verify Mode
+    clientProfile.account_verification_is_enabled && // Client supports verification
+    clientProfile.is_microdeposits_enabled && // Client supports MDV
+    widgetProfile.show_microdeposits_in_connect;
+  });
+  const { handleSelectInstitution } = useSelectInstitution();
   const shouldShowLoadMore = !!currentSearchResults.length && !isLoadingInstitutions;
   useEffect(() => {
     setAriaLiveRegionMessage(
@@ -70194,6 +70303,10 @@ const SearchedInstitutionsList = (props) => {
                 institution_guid: institution.guid,
                 institution_name: institution.name
               });
+              postMessage.onPostMessage(
+                "connect/selectedInstitution",
+                _pick(institution, ["name", "guid", "url", "code"])
+              );
               handleSelectInstitution(institution);
             },
             size: 48
@@ -70219,7 +70332,7 @@ const SearchedInstitutionsList = (props) => {
           Button$2,
           {
             "data-test": "add-account-manually-button",
-            onClick: onAddManualAccountClick,
+            onClick: () => dispatch(stepToAddManualAccount$1()),
             variant: "text",
             children: __("Add account manually")
           }
@@ -70237,7 +70350,7 @@ const SearchedInstitutionsList = (props) => {
           Button$2,
           {
             "data-test": "connect-account-numbers-button",
-            onClick: onVerifyWithMicrodeposits,
+            onClick: () => dispatch(stepToMicrodeposits$1()),
             variant: "text",
             children: __("Connect with account numbers")
           }
@@ -70278,32 +70391,39 @@ const getStyles$1o = (tokens) => {
 };
 SearchedInstitutionsList.propTypes = {
   currentSearchResults: PropTypes$1.array.isRequired,
-  enableManualAccounts: PropTypes$1.bool.isRequired,
-  enableSupportRequests: PropTypes$1.bool.isRequired,
-  handleSelectInstitution: PropTypes$1.func.isRequired,
   institutions: PropTypes$1.array.isRequired,
   institutionSearch: PropTypes$1.func.isRequired,
-  isMicrodepositsEnabled: PropTypes$1.bool.isRequired,
-  onAddManualAccountClick: PropTypes$1.func.isRequired,
   onRequestInstitution: PropTypes$1.func.isRequired,
-  onVerifyWithMicrodeposits: PropTypes$1.func.isRequired,
   setAriaLiveRegionMessage: PropTypes$1.func.isRequired
 };
 
 const SearchNoResult = (props) => {
   useAnalyticsPath(...PageviewInfo.CONNECT_SEARCH_NO_RESULTS, { search_term: props.searchTerm });
-  const {
-    enableManualAccounts,
-    enableSupportRequests,
-    isMicrodepositsEnabled,
-    onAddManualAccountClick,
-    onRequestInstitution,
-    onVerifyWithMicrodeposits,
-    setAriaLiveRegionMessage
-  } = props;
+  const { onRequestInstitution, setAriaLiveRegionMessage } = props;
   const timerRef = useRef(null);
   const tokens = useTokens();
   const styles = getStyles$1n(tokens);
+  const dispatch = useDispatch();
+  const enableManualAccounts = useSelector((state) => {
+    const isManualAccountsEnabled = state.profiles.widgetProfile?.enable_manual_accounts;
+    const { isInAggMode } = selectCurrentMode(state);
+    const hasAtriumAPI = state.profiles.client?.has_atrium_api;
+    return isManualAccountsEnabled && isInAggMode && !hasAtriumAPI;
+  });
+  const enableSupportRequests = useSelector((state) => {
+    const isSupportEnabled = state.profiles.widgetProfile?.enable_support_requests;
+    const { isInAggMode } = selectCurrentMode(state);
+    return isSupportEnabled && isInAggMode;
+  });
+  const isMicrodepositsEnabled = useSelector((state) => {
+    const { isVerifyMode } = selectCurrentMode(state);
+    const clientProfile = state.profiles.clientProfile || {};
+    const widgetProfile = state.profiles.widgetProfile || {};
+    return isVerifyMode && // Widget is in Verify Mode
+    clientProfile.account_verification_is_enabled && // Client supports verification
+    clientProfile.is_microdeposits_enabled && // Client supports MDV
+    widgetProfile.show_microdeposits_in_connect;
+  });
   useEffect(() => {
     timerRef.current = setTimeout(() => {
       setAriaLiveRegionMessage(__("No results found for ”%1”", props.searchTerm));
@@ -70342,7 +70462,7 @@ const SearchNoResult = (props) => {
         Button$2,
         {
           "data-test": "add-account-manually-button",
-          onClick: onAddManualAccountClick,
+          onClick: () => dispatch(stepToAddManualAccount$1()),
           variant: "text",
           children: __("Add account manually")
         }
@@ -70360,7 +70480,7 @@ const SearchNoResult = (props) => {
         Button$2,
         {
           "data-test": "connect-account-numbers-button",
-          onClick: onVerifyWithMicrodeposits,
+          onClick: () => dispatch(stepToMicrodeposits$1()),
           variant: "text",
           children: __("Connect with account numbers")
         }
@@ -70394,12 +70514,7 @@ const getStyles$1n = (tokens) => {
   };
 };
 SearchNoResult.propTypes = {
-  enableManualAccounts: PropTypes$1.bool.isRequired,
-  enableSupportRequests: PropTypes$1.bool.isRequired,
-  isMicrodepositsEnabled: PropTypes$1.bool.isRequired,
-  onAddManualAccountClick: PropTypes$1.func.isRequired,
   onRequestInstitution: PropTypes$1.func.isRequired,
-  onVerifyWithMicrodeposits: PropTypes$1.func.isRequired,
   searchTerm: PropTypes$1.string.isRequired,
   setAriaLiveRegionMessage: PropTypes$1.func.isRequired
 };
@@ -72103,55 +72218,6 @@ const useForm = (submitCallback, formSchema, initialValues) => {
   };
 };
 
-const defaultApiValue = {
-  // Accounts
-  createAccount: () => Promise.resolve({}),
-  // Members
-  addMember: () => Promise.resolve({}),
-  deleteMember: () => Promise.resolve(),
-  getMemberCredentials: () => Promise.resolve([]),
-  loadMemberByGuid: () => Promise.resolve({}),
-  loadMembers: () => Promise.resolve([]),
-  // Institutions
-  getInstitutionCredentials: () => Promise.resolve([]),
-  loadDiscoveredInstitutions: () => Promise.resolve([]),
-  loadInstitutionByCode: () => Promise.resolve({}),
-  loadInstitutions: () => Promise.resolve([]),
-  loadInstitutionByGuid: () => Promise.resolve({}),
-  loadPopularInstitutions: () => Promise.resolve([]),
-  // Microdeposits
-  createMicrodeposit: () => Promise.resolve({}),
-  loadMicrodepositByGuid: () => Promise.resolve({}),
-  refreshMicrodepositStatus: () => Promise.resolve(),
-  updateMember: () => Promise.resolve({}),
-  updateMFA: () => Promise.resolve({}),
-  updateMicrodeposit: () => Promise.resolve({}),
-  verifyMicrodeposit: () => Promise.resolve({}),
-  verifyRoutingNumber: () => Promise.resolve({}),
-  //OAuth
-  loadOAuthState: () => Promise.resolve({}),
-  loadOAuthStates: () => Promise.resolve([]),
-  oAuthStart: () => Promise.resolve(),
-  // Support
-  createSupportTicket: () => Promise.resolve(),
-  //Job
-  loadJob: () => Promise.resolve({}),
-  runJob: () => Promise.resolve({}),
-  // User
-  updateUserProfile: () => Promise.resolve({})
-};
-const ApiContext = React$1.createContext(defaultApiValue);
-const ApiProvider = ({ apiValue, children }) => {
-  return /* @__PURE__ */ jsxRuntimeExports.jsx(ApiContext.Provider, { value: { ...defaultApiValue, ...apiValue }, children });
-};
-const useApi = () => {
-  const context = React$1.useContext(ApiContext);
-  if (context === void 0) {
-    throw new Error("useApi must be used within a ApiProvider");
-  }
-  return { api: context };
-};
-
 const RequiredFieldNote = ({ styles }) => {
   const requiredFieldNoteColor = "#666";
   const asteriskColor = "#E32727";
@@ -72849,29 +72915,24 @@ const reducer$4 = (state, action) => {
       return state;
   }
 };
-const Search$2 = React__default.forwardRef((props, navigationRef) => {
+const Search$2 = React__default.forwardRef((_, navigationRef) => {
   useAnalyticsPath(...PageviewInfo.CONNECT_SEARCH, {}, false);
   const [state, dispatch] = useReducer(reducer$4, initialState$1);
   const [ariaLiveRegionMessage, setAriaLiveRegionMessage] = useState("");
   const searchInput = useRef("");
   const supportNavRef = useRef(null);
-  const reduxDispatch = useDispatch();
   const sendAnalyticsEvent = useAnalyticsEvent();
   const postMessageFunctions = useContext(PostMessageContext);
   const { api } = useApi();
-  const {
-    connectConfig,
-    connectedMembers,
-    enableManualAccounts,
-    enableSupportRequests,
-    onAddManualAccountClick,
-    onInstitutionSelect,
-    usePopularOnly,
-    isMicrodepositsEnabled,
-    stepToMicrodeposits
-  } = props;
+  const reduxDispatch = useDispatch();
+  const connectConfig = useSelector(selectConnectConfig);
+  const connectedMembers = useSelector(getMembers);
+  const usePopularOnly = useSelector((state2) => {
+    const clientProfile = state2.profiles.clientProfile || {};
+    const client = state2.profiles.client || {};
+    return (clientProfile.uses_custom_popular_institution_list ?? false) || (client.has_limited_institutions ?? false);
+  });
   const MINIMUM_SEARCH_LENGTH = 2;
-  const mode = connectConfig.mode;
   const isFirstTimeUser = connectedMembers.length === 0;
   useImperativeHandle(navigationRef, () => {
     return {
@@ -72983,7 +73044,7 @@ const Search$2 = React__default.forwardRef((props, navigationRef) => {
         return;
       }
       sendAnalyticsEvent(AnalyticEvents.SEARCH_QUERY, {
-        mode,
+        mode: connectConfig.mode,
         search_term: value
       });
       postMessageFunctions.onPostMessage("connect/institutionSearch", { query: value });
@@ -73064,14 +73125,9 @@ const Search$2 = React__default.forwardRef((props, navigationRef) => {
     state.currentView === SEARCH_VIEWS.NO_RESULTS && /* @__PURE__ */ jsxRuntimeExports.jsx(
       SearchNoResult,
       {
-        enableManualAccounts,
-        enableSupportRequests,
-        isMicrodepositsEnabled,
-        onAddManualAccountClick,
         onRequestInstitution: () => {
           dispatch({ type: SEARCH_ACTIONS.SHOW_SUPPORT });
         },
-        onVerifyWithMicrodeposits: stepToMicrodeposits,
         searchTerm: state.searchTerm,
         setAriaLiveRegionMessage
       }
@@ -73081,31 +73137,22 @@ const Search$2 = React__default.forwardRef((props, navigationRef) => {
       SearchedInstitutionsList,
       {
         currentSearchResults: state.currentSearchResults,
-        enableManualAccounts,
-        enableSupportRequests,
-        handleSelectInstitution: onInstitutionSelect,
         institutionSearch,
         institutions: state.searchedInstitutions,
-        isMicrodepositsEnabled,
-        onAddManualAccountClick,
         onRequestInstitution: () => {
           dispatch({ type: SEARCH_ACTIONS.SHOW_SUPPORT });
         },
-        onVerifyWithMicrodeposits: stepToMicrodeposits,
         setAriaLiveRegionMessage
       }
     ),
     state.currentView === SEARCH_VIEWS.POPULAR && /* @__PURE__ */ jsxRuntimeExports.jsx(
       PopularInstitutionsList,
       {
-        enableManualAccounts,
-        handleSelectInstitution: onInstitutionSelect,
         institutions: usePopularOnly ? state.popularInstitutions : getSuggestedInstitutions(
           state.popularInstitutions,
           state.discoveredInstitutions,
           connectedMembers
         ),
-        onAddManualAccountClick,
         onSearchInstitutionClick: () => searchInput.current.focus()
       }
     ),
@@ -73137,17 +73184,6 @@ const getStyles$19 = (tokens) => {
     }
   };
 };
-Search$2.propTypes = {
-  connectConfig: PropTypes$1.object.isRequired,
-  connectedMembers: PropTypes$1.array.isRequired,
-  enableManualAccounts: PropTypes$1.bool,
-  enableSupportRequests: PropTypes$1.bool,
-  isMicrodepositsEnabled: PropTypes$1.bool,
-  onAddManualAccountClick: PropTypes$1.func.isRequired,
-  onInstitutionSelect: PropTypes$1.func.isRequired,
-  stepToMicrodeposits: PropTypes$1.func.isRequired,
-  usePopularOnly: PropTypes$1.bool
-};
 Search$2.displayName = "Search";
 const applyConnectConfigToSearchQuery = (connectConfig, queryObject) => {
   if (connectConfig.iso_country_code) {
@@ -78423,7 +78459,6 @@ const getStyles$J = (tokens) => {
       height: "24px",
       width: "24px",
       minWidth: "24px",
-      padding: "2px",
       zIndex: 20,
       display: "flex",
       alignItems: "center",
@@ -78510,7 +78545,7 @@ const ProgressMessage = ({ allDone, jobType }) => {
 };
 ProgressMessage.propTypes = {
   allDone: PropTypes$1.bool,
-  jobType: PropTypes$1.string
+  jobType: PropTypes$1.number
 };
 
 const ProgressLogo = ({ children }) => {
@@ -78524,15 +78559,14 @@ const getStyles$H = (tokens) => {
       backgroundColor: tokens.BackgroundColor.Container,
       borderRadius: "8px",
       display: "flex",
-      padding: "2px",
       zIndex: 11
     }
   };
 };
 
-const SvgProgressBackdropDark = (props) => /* @__PURE__ */ React$1.createElement("svg", { width: 80, height: 80, viewBox: "0 0 80 80", fill: "none", xmlns: "http://www.w3.org/2000/svg", role: "image", ...props }, /* @__PURE__ */ React$1.createElement("circle", { cx: 40, cy: 40, r: 23.5, stroke: "white", strokeOpacity: 0.45 }), /* @__PURE__ */ React$1.createElement("circle", { cx: 40, cy: 40, r: 31.5, stroke: "white", strokeOpacity: 0.3 }), /* @__PURE__ */ React$1.createElement("circle", { cx: 40, cy: 40, r: 39.5, stroke: "white", strokeOpacity: 0.15 }));
+const SvgProgressBackdropDark = (props) => /* @__PURE__ */ React$1.createElement("svg", { width: 80, height: 80, viewBox: "0 0 80 80", fill: "none", xmlns: "http://www.w3.org/2000/svg", role: "image", "aria-hidden": "true", ...props }, /* @__PURE__ */ React$1.createElement("circle", { cx: 40, cy: 40, r: 23.5, stroke: "white", strokeOpacity: 0.45 }), /* @__PURE__ */ React$1.createElement("circle", { cx: 40, cy: 40, r: 31.5, stroke: "white", strokeOpacity: 0.3 }), /* @__PURE__ */ React$1.createElement("circle", { cx: 40, cy: 40, r: 39.5, stroke: "white", strokeOpacity: 0.15 }));
 
-const SvgProgressBackdropLight = (props) => /* @__PURE__ */ React$1.createElement("svg", { width: 80, height: 80, viewBox: "0 0 80 80", fill: "none", xmlns: "http://www.w3.org/2000/svg", role: "image", ...props }, /* @__PURE__ */ React$1.createElement("circle", { cx: 40, cy: 40, r: 23.5, stroke: "black", strokeOpacity: 0.25 }), /* @__PURE__ */ React$1.createElement("circle", { cx: 40, cy: 40, r: 31.5, stroke: "black", strokeOpacity: 0.1 }), /* @__PURE__ */ React$1.createElement("circle", { cx: 40, cy: 40, r: 39.5, stroke: "black", strokeOpacity: 0.05 }));
+const SvgProgressBackdropLight = (props) => /* @__PURE__ */ React$1.createElement("svg", { width: 80, height: 80, viewBox: "0 0 80 80", fill: "none", xmlns: "http://www.w3.org/2000/svg", role: "image", "aria-hidden": "true", ...props }, /* @__PURE__ */ React$1.createElement("circle", { cx: 40, cy: 40, r: 23.5, stroke: "black", strokeOpacity: 0.25 }), /* @__PURE__ */ React$1.createElement("circle", { cx: 40, cy: 40, r: 31.5, stroke: "black", strokeOpacity: 0.1 }), /* @__PURE__ */ React$1.createElement("circle", { cx: 40, cy: 40, r: 39.5, stroke: "black", strokeOpacity: 0.05 }));
 
 const ProgressBackgroundImage = ({ style }) => {
   const isLightColorScheme = useSelector(getIsLightColorScheme);
@@ -78581,7 +78615,8 @@ const ProgressBar = ({
 const getStyles$G = () => {
   return {
     container: {
-      textAlign: "center"
+      textAlign: "center",
+      width: "100%"
     },
     backgroundImage: {
       height: "80px",
@@ -78601,9 +78636,7 @@ const getStyles$G = () => {
       alignItems: "center",
       boxSizing: "border-box",
       display: "flex",
-      justifyContent: "space-between",
-      paddingLeft: "28px",
-      paddingRight: "28px",
+      justifyContent: "space-around",
       position: "absolute",
       width: "100%"
     }
@@ -80583,8 +80616,8 @@ const Connected = React__default.forwardRef(
     const continueButtonRef = useRef(null);
     const connectSuccessSurveyRef = useRef(null);
     const postMessageFunctions = useContext(PostMessageContext);
-    const appName = useSelector((state) => state.profiles.client.oauth_app_name || null);
     const { onShowConnectSuccessSurvey } = useContext(AnalyticContext);
+    const clientGuid = useSelector(getClientGuid);
     const tokens = useTokens();
     const styles = getStyles$x(tokens);
     const getNextDelay = getDelay();
@@ -80614,7 +80647,7 @@ const Connected = React__default.forwardRef(
     useEffect(() => {
       focusElement(continueButtonRef.current);
     }, [institutionName]);
-    return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { ref: containerRef, children: [
+    return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { ref: containerRef, style: styles.pageContainer, children: [
       /* @__PURE__ */ jsxRuntimeExports.jsx(
         ReactConfetti,
         {
@@ -80629,82 +80662,139 @@ const Connected = React__default.forwardRef(
           style: { zIndex: 3e3 }
         }
       ),
-      showFeedBack ? /* @__PURE__ */ jsxRuntimeExports.jsx(
-        ConnectSuccessSurvey,
-        {
-          handleBack: () => setShowFeedBack(false),
-          handleDone,
-          ref: connectSuccessSurveyRef
-        }
-      ) : /* @__PURE__ */ jsxRuntimeExports.jsxs(React__default.Fragment, { children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx(SlideDown, { children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: styles.header, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-          M,
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: styles.content, children: [
+        showFeedBack ? /* @__PURE__ */ jsxRuntimeExports.jsx(
+          ConnectSuccessSurvey,
           {
-            className: "material-symbols-rounded",
-            color: "success",
-            fill: true,
-            name: "check_circle",
-            size: 80,
-            weight: Fe.Dark
+            handleBack: () => setShowFeedBack(false),
+            handleDone,
+            ref: connectSuccessSurveyRef
           }
-        ) }) }),
-        /* @__PURE__ */ jsxRuntimeExports.jsxs(SlideDown, { children: [
-          /* @__PURE__ */ jsxRuntimeExports.jsx(
+        ) : /* @__PURE__ */ jsxRuntimeExports.jsxs(React__default.Fragment, { children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx(SlideDown, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(
             D,
             {
-              component: "h2",
+              component: "h1",
               "data-test": "connected-header",
               style: styles.title,
               truncate: false,
               variant: "H2",
-              children: __("Success")
+              children: __("Success!")
             }
-          ),
-          appName && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { children: /* @__PURE__ */ jsxRuntimeExports.jsx(D, { component: "p", "data-test": "connected-secondary-text", style: styles.body, children: __("You have successfully connected %1 to %2.", institutionName, appName) }) }),
-          !appName && /* @__PURE__ */ jsxRuntimeExports.jsx(D, { component: "p", "data-test": "connected-secondary-text", style: styles.body, children: __("You have successfully connected to %1.", institutionName) })
+          ) }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx(SlideDown, { delay: getNextDelay(), children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: styles.progressBarContainer, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: styles.barContainer, children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: styles.logosContainer, children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx(ProgressLogo, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+                ClientLogo,
+                {
+                  alt: "Client logo",
+                  clientGuid,
+                  size: 64,
+                  style: styles.logo
+                }
+              ) }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx(ProgressBackgroundImage, { style: styles.backgroundImage }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx(ProgressLogo, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+                K0,
+                {
+                  alt: "Institution logo",
+                  institutionGuid: institution.guid,
+                  logoUrl: institution.logo_url || "",
+                  size: 64,
+                  style: styles.logo
+                }
+              ) })
+            ] }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx(ProgressLine, { isActive: true }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx(ProgressCheckMark, {}),
+            /* @__PURE__ */ jsxRuntimeExports.jsx(ProgressLine, { isActive: true, isCentralLine: true }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx(ProgressCheckMark, {}),
+            /* @__PURE__ */ jsxRuntimeExports.jsx(ProgressLine, { isActive: true, isCentralLine: true }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx(ProgressCheckMark, {}),
+            /* @__PURE__ */ jsxRuntimeExports.jsx(ProgressLine, { isActive: true })
+          ] }) }) }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx(SlideDown, { delay: getNextDelay(), children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+            Button$2,
+            {
+              "data-test": "done-button",
+              fullWidth: true,
+              onClick: handleDone,
+              ref: continueButtonRef,
+              style: styles.button,
+              variant: "contained",
+              children: __("Done")
+            }
+          ) }),
+          typeof onShowConnectSuccessSurvey === "function" && /* @__PURE__ */ jsxRuntimeExports.jsx(SlideDown, { delay: getNextDelay(), children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+            Button$2,
+            {
+              "data-test": "give-feedback",
+              fullWidth: true,
+              onClick: () => {
+                onShowConnectSuccessSurvey();
+                setShowFeedBack(true);
+              },
+              style: styles.feedbackButton,
+              variant: "text",
+              children: __("Give feedback")
+            }
+          ) })
         ] }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx(SlideDown, { delay: getNextDelay(), children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-          Button$2,
-          {
-            "data-test": "done-button",
-            fullWidth: true,
-            onClick: handleDone,
-            ref: continueButtonRef,
-            style: styles.button,
-            variant: "contained",
-            children: __("Done")
-          }
-        ) }),
-        typeof onShowConnectSuccessSurvey === "function" && /* @__PURE__ */ jsxRuntimeExports.jsx(SlideDown, { delay: getNextDelay(), children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-          Button$2,
-          {
-            "data-test": "give-feedback",
-            fullWidth: true,
-            onClick: () => {
-              onShowConnectSuccessSurvey();
-              setShowFeedBack(true);
-            },
-            variant: "text",
-            children: __("Give feedback")
-          }
-        ) }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx(SlideDown, { delay: getNextDelay(), children: /* @__PURE__ */ jsxRuntimeExports.jsx(PrivateAndSecure, {}) })
+        /* @__PURE__ */ jsxRuntimeExports.jsx(AriaLive, { level: "assertive", message: ariaLiveRegionMessage, timeout: 100 })
       ] }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx(AriaLive, { level: "assertive", message: ariaLiveRegionMessage, timeout: 100 })
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: styles.footer, children: /* @__PURE__ */ jsxRuntimeExports.jsx(PoweredByFooter, { aggregator: institution.aggregatorDisplayName }) })
     ] });
   }
 );
 const getStyles$x = (tokens) => {
   return {
+    pageContainer: {
+      display: "flex",
+      flexDirection: "column",
+      minHeight: "100%"
+    },
+    content: {
+      flex: 1,
+      display: "flex",
+      flexDirection: "column"
+    },
     header: {
       display: "flex",
       justifyContent: "center",
       marginTop: "20px",
       marginBottom: tokens.Spacing.Large
     },
+    progressBarContainer: {
+      marginBottom: "48px",
+      textAlign: "center",
+      width: "100%"
+    },
+    barContainer: {
+      alignItems: "center",
+      display: "flex",
+      height: "80px",
+      justifyContent: "center"
+    },
+    logosContainer: {
+      alignItems: "center",
+      boxSizing: "border-box",
+      display: "flex",
+      justifyContent: "space-around",
+      position: "absolute",
+      width: "100%"
+    },
+    logo: {
+      borderRadius: "8px"
+    },
+    backgroundImage: {
+      height: "80px",
+      width: "80px",
+      zIndex: 1
+    },
     title: {
       textAlign: "center",
-      marginBottom: tokens.Spacing.Tiny
+      marginBottom: tokens.Spacing.XLarge,
+      marginTop: tokens.Spacing.XLarge
     },
     body: {
       textAlign: "center",
@@ -80713,6 +80803,13 @@ const getStyles$x = (tokens) => {
     },
     button: {
       marginBottom: tokens.Spacing.Small
+    },
+    feedbackButton: {
+      color: tokens.Color.Primary300
+    },
+    footer: {
+      marginTop: "24px",
+      marginBottom: "24px"
     }
   };
 };
@@ -84242,6 +84339,7 @@ const ManualAccountConnect = React__default.forwardRef((props, ref) => {
   const formRef = useRef(null);
   const menuRef = useRef(null);
   const postMessageFunctions = useContext(PostMessageContext);
+  const reduxDispatch = useDispatch();
   const [showDayPicker, setShowDayPicker] = useState(false);
   const [state, dispatch] = useReducer(reducer$1, {
     showForm: false,
@@ -84250,6 +84348,7 @@ const ManualAccountConnect = React__default.forwardRef((props, ref) => {
     accountType: props.availableAccountTypes?.length === 1 ? props.availableAccountTypes[0] : null,
     validationErrors: {}
   });
+  const initialConfig = useSelector(selectInitialConfig);
   useImperativeHandle(ref, () => {
     return {
       handleBackButton() {
@@ -84274,7 +84373,10 @@ const ManualAccountConnect = React__default.forwardRef((props, ref) => {
   };
   const handleGoBackClick = () => {
     postMessageFunctions.onPostMessage(POST_MESSAGES.BACK_TO_SEARCH);
-    props.onClose();
+    reduxDispatch({
+      type: ActionTypes$2.GO_BACK_MANUAL_ACCOUNT,
+      payload: initialConfig
+    });
   };
   if (state.showSuccess) {
     return /* @__PURE__ */ jsxRuntimeExports.jsx(
@@ -84282,7 +84384,10 @@ const ManualAccountConnect = React__default.forwardRef((props, ref) => {
       {
         accountType: state.accountType,
         handleDone: () => {
-          props.onClose();
+          reduxDispatch({
+            type: ActionTypes$2.GO_BACK_MANUAL_ACCOUNT,
+            payload: initialConfig
+          });
         },
         onManualAccountAdded: props.onManualAccountAdded
       }
@@ -84313,7 +84418,6 @@ const ManualAccountConnect = React__default.forwardRef((props, ref) => {
 });
 ManualAccountConnect.propTypes = {
   availableAccountTypes: PropTypes$1.array,
-  onClose: PropTypes$1.func.isRequired,
   onManualAccountAdded: PropTypes$1.func
 };
 ManualAccountConnect.displayName = "ManualAccountConnect";
@@ -84351,129 +84455,86 @@ const ADDITIONAL_PRODUCT_OPTIONS = [
   COMBO_JOB_DATA_TYPES.TRANSACTIONS,
   COMBO_JOB_DATA_TYPES.ACCOUNT_NUMBER
 ];
-const AdditionalProductStep = React__default.forwardRef(
-  ({
-    additionalProductName,
-    onNoClick = () => {
-      throw new Error("onNoClick not implemented");
-    },
-    onYesClick = () => {
-      throw new Error("onYesClick not implemented");
-    }
-  }, navigationRef) => {
-    const selectedInstitution = useSelector(getSelectedInstitution);
-    const { add_aggregation = {}, add_verification = {} } = useSelector(selectLocalizedContent)?.connect?.additional_product_screen || {};
-    useImperativeHandle(navigationRef, () => {
-      return {
-        showBackButton() {
-          return true;
-        }
-      };
-    }, []);
-    const getNextDelay = getDelay();
-    const addAggregationText = {
-      title: add_aggregation?.title || __("Add financial management?"),
-      body: add_aggregation?.body || __(
-        "You're connecting this account for payments and transfers. Would you like to also enable financial management so you can track your income and spending?"
-      ),
-      acceptButtonText: add_aggregation?.button_1 || __("Yes, add financial management"),
-      rejectButtonText: add_aggregation?.button_2 || __("No, only add transfers and payments")
-    };
-    const addVerificationText = {
-      title: add_verification?.title || __("Add transfers and payments?"),
-      body: add_verification?.body || __(
-        "You're connecting this account for financial management. Would you like to also enable transfers and payments so you can quickly move money to and from this institution?"
-      ),
-      acceptButtonText: add_verification?.button_1 || __("Yes, add transfers and payments"),
-      rejectButtonText: add_verification?.button_2 || __("No, only add financial management")
-    };
-    const componentText = additionalProductName === COMBO_JOB_DATA_TYPES.TRANSACTIONS ? addAggregationText : addVerificationText;
-    return /* @__PURE__ */ jsxRuntimeExports.jsxs(SlideDown, { delay: getNextDelay(), children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx(InstitutionBlock, { institution: selectedInstitution, style: { marginBottom: 24 } }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx(
-        D,
-        {
-          component: "h2",
-          "data-test": "additional-product__title-text",
-          style: { marginBottom: 12 },
-          truncate: false,
-          variant: "H2",
-          children: componentText.title
-        }
-      ),
-      /* @__PURE__ */ jsxRuntimeExports.jsx(D, { component: "p", style: { marginBottom: 32 }, truncate: false, variant: "Paragraph", children: componentText.body }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx(
-        Button$2,
-        {
-          "data-test": "additional-product__accept-button",
-          fullWidth: true,
-          onClick: () => {
-            onYesClick();
-          },
-          style: { marginBottom: 8 },
-          variant: "contained",
-          children: componentText.acceptButtonText
-        }
-      ),
-      /* @__PURE__ */ jsxRuntimeExports.jsx(
-        Button$2,
-        {
-          "data-test": "additional-product__reject-button",
-          fullWidth: true,
-          onClick: () => {
-            onNoClick();
-          },
-          variant: "text",
-          children: componentText.rejectButtonText
-        }
-      )
-    ] });
-  }
-);
-AdditionalProductStep.displayName = "AdditionalProductStep";
-
-const useSelectInstitution = () => {
-  const { api } = useApi();
-  const [institution, setInstitution] = useState(null);
+const AdditionalProductStep = React__default.forwardRef((_, navigationRef) => {
   const dispatch = useDispatch();
-  const consentIsEnabled = useSelector((state) => isConsentEnabled(state));
   const connectConfig = useSelector(selectConnectConfig);
-  const handleSelectInstitution = useCallback(
-    (institution2) => {
-      setInstitution(institution2);
-    },
-    [institution]
-  );
-  useEffect(() => {
-    if (!institution) return () => {
+  const selectedInstitution = useSelector(getSelectedInstitution);
+  const consentIsEnabled = useSelector(isConsentEnabled);
+  const { add_aggregation = {}, add_verification = {} } = useSelector(selectLocalizedContent)?.connect?.additional_product_screen || {};
+  useImperativeHandle(navigationRef, () => {
+    return {
+      showBackButton() {
+        return true;
+      }
     };
-    const selectInstitution$ = from(api.loadInstitutionByGuid(institution.guid)).pipe(
-      map((insWithCreds) => {
-        return dispatch({
-          type: ActionTypes$2.SELECT_INSTITUTION_SUCCESS,
-          payload: {
-            institution: {
-              ...insWithCreds,
-              is_disabled_by_client: institutionIsBlockedForCostReasons(institution)
-              // Temporary workaround till backend/core is fixed
-            },
-            consentIsEnabled: consentIsEnabled || false,
-            additionalProductOption: connectConfig?.additional_product_option || null
-          }
-        });
-      }),
-      catchError((err) => {
-        setInstitution(null);
-        return of(selectInstitutionError(err));
-      })
-    ).subscribe((action) => {
-      setInstitution(null);
-      dispatch(action);
-    });
-    return () => selectInstitution$.unsubscribe();
-  }, [institution]);
-  return { handleSelectInstitution };
-};
+  }, []);
+  const getNextDelay = getDelay();
+  const addAggregationText = {
+    title: add_aggregation?.title || __("Add financial management?"),
+    body: add_aggregation?.body || __(
+      "You're connecting this account for payments and transfers. Would you like to also enable financial management so you can track your income and spending?"
+    ),
+    acceptButtonText: add_aggregation?.button_1 || __("Yes, add financial management"),
+    rejectButtonText: add_aggregation?.button_2 || __("No, only add transfers and payments")
+  };
+  const addVerificationText = {
+    title: add_verification?.title || __("Add transfers and payments?"),
+    body: add_verification?.body || __(
+      "You're connecting this account for financial management. Would you like to also enable transfers and payments so you can quickly move money to and from this institution?"
+    ),
+    acceptButtonText: add_verification?.button_1 || __("Yes, add transfers and payments"),
+    rejectButtonText: add_verification?.button_2 || __("No, only add financial management")
+  };
+  const componentText = connectConfig.additional_product_option === COMBO_JOB_DATA_TYPES.TRANSACTIONS ? addAggregationText : addVerificationText;
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs(SlideDown, { delay: getNextDelay(), children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsx(InstitutionBlock, { institution: selectedInstitution, style: { marginBottom: 24 } }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx(
+      D,
+      {
+        component: "h2",
+        "data-test": "additional-product__title-text",
+        style: { marginBottom: 12 },
+        truncate: false,
+        variant: "H2",
+        children: componentText.title
+      }
+    ),
+    /* @__PURE__ */ jsxRuntimeExports.jsx(D, { component: "p", style: { marginBottom: 32 }, truncate: false, variant: "Paragraph", children: componentText.body }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx(
+      Button$2,
+      {
+        "data-test": "additional-product__accept-button",
+        fullWidth: true,
+        onClick: () => {
+          dispatch(
+            connectConfig?.additional_product_option === COMBO_JOB_DATA_TYPES.ACCOUNT_NUMBER ? addVerificationData({ consentIsEnabled }) : addAggregationData({ consentIsEnabled })
+          );
+        },
+        style: { marginBottom: 8 },
+        variant: "contained",
+        children: componentText.acceptButtonText
+      }
+    ),
+    /* @__PURE__ */ jsxRuntimeExports.jsx(
+      Button$2,
+      {
+        "data-test": "additional-product__reject-button",
+        fullWidth: true,
+        onClick: () => {
+          dispatch({
+            type: ActionTypes$2.REJECT_ADDITIONAL_PRODUCT,
+            payload: {
+              consentIsEnabled
+            }
+          });
+        },
+        variant: "text",
+        children: componentText.rejectButtonText
+      }
+    )
+  ] });
+});
+AdditionalProductStep.displayName = "AdditionalProductStep";
 
 const getConsentDataClusters = () => {
   const dataClusters = {
@@ -84653,13 +84714,14 @@ const getStyles$8 = () => {
 };
 
 const DynamicDisclosure = React__default.forwardRef(
-  ({ onConsentClick, onGoBackClick }, navigationRef) => {
+  ({ onGoBackClick }, navigationRef) => {
     const [name, path] = PageviewInfo.CONNECT_DYNAMIC_DISCLOSURE;
     useAnalyticsPath(name, path);
     const containerRef = useRef(null);
     const tokens = J0();
     const styles = getStyles$7(tokens);
     const getNextDelay = getDelay();
+    const dispatch = useDispatch();
     const institution = useSelector((state) => state.connect.selectedInstitution);
     const appName = useSelector((state) => state.profiles.client.oauth_app_name || null);
     const [dialogIsOpen, setDialogIsOpen] = React__default.useState(false);
@@ -84733,7 +84795,7 @@ const DynamicDisclosure = React__default.forwardRef(
           if (["es", "fr-ca"].includes(initialLocal) && initialLocal !== getLocale()) {
             setLocale(initialLocal);
           }
-          onConsentClick();
+          dispatch({ type: ActionTypes$2.USER_CONSENTED });
         },
         sx: styles.button,
         variant: "contained",
@@ -84892,7 +84954,6 @@ const RenderConnectStep = (props) => {
   const selectedInstitution = useSelector(getSelectedInstitution);
   const updateCredentials = useSelector((state) => state.connect.updateCredentials);
   const verifyMemberError = useSelector((state) => state.connect.error);
-  const consentIsEnabled = useSelector((state) => isConsentEnabled(state));
   const { handleSelectInstitution } = useSelectInstitution();
   const dispatch = useDispatch();
   const tokens = useTokens();
@@ -84903,100 +84964,32 @@ const RenderConnectStep = (props) => {
   clientProfile.is_microdeposits_enabled && // Client supports MDV
   widgetProfile.show_microdeposits_in_connect;
   const hasAtriumAPI = client.has_atrium_api;
-  const isManualAccountsEnabled = widgetProfile.enable_manual_accounts && mode === AGG_MODE && !hasAtriumAPI;
   const showSupport = widgetProfile.enable_support_requests && mode === AGG_MODE;
-  const usePopularOnly = (clientProfile.uses_custom_popular_institution_list ?? false) || (client.has_limited_institutions ?? false);
   const isDeleteInstitutionOptionEnabled = widgetProfile?.display_delete_option_in_connect ?? true;
-  const handleInstitutionSelect = (institution) => {
-    postMessageFunctions.onPostMessage(
-      "connect/selectedInstitution",
-      _pick(institution, ["name", "guid", "url", "code"])
-    );
-    handleSelectInstitution(institution);
-  };
   let connectStepView = null;
   if (step === STEPS.DISCLOSURE) {
-    connectStepView = /* @__PURE__ */ jsxRuntimeExports.jsx(
-      Disclosure,
-      {
-        mode,
-        onContinue: () => dispatch({ type: ActionTypes$2.ACCEPT_DISCLOSURE, payload: connectConfig }),
-        ref: props.navigationRef,
-        size
-      }
-    );
+    connectStepView = /* @__PURE__ */ jsxRuntimeExports.jsx(Disclosure, { ref: props.navigationRef });
   } else if (step === STEPS.SEARCH) {
-    connectStepView = /* @__PURE__ */ jsxRuntimeExports.jsx(
-      Search$2,
-      {
-        connectConfig,
-        connectedMembers,
-        enableManualAccounts: isManualAccountsEnabled,
-        enableSupportRequests: showSupport,
-        isMicrodepositsEnabled,
-        onAddManualAccountClick: props.handleAddManualAccountClick,
-        onInstitutionSelect: handleInstitutionSelect,
-        ref: props.navigationRef,
-        size,
-        stepToMicrodeposits: () => dispatch(stepToMicrodeposits$1()),
-        usePopularOnly
-      }
-    );
+    connectStepView = /* @__PURE__ */ jsxRuntimeExports.jsx(Search$2, { ref: props.navigationRef });
   } else if (step === STEPS.INSTITUTION_DISABLED) {
     connectStepView = /* @__PURE__ */ jsxRuntimeExports.jsx(InstitutionDisabled, { ref: props.navigationRef });
   } else if (step === STEPS.CONSENT) {
     connectStepView = /* @__PURE__ */ jsxRuntimeExports.jsx("div", { children: /* @__PURE__ */ jsxRuntimeExports.jsx(
       DynamicDisclosure,
       {
-        onConsentClick: () => {
-          dispatch({ type: ActionTypes$2.USER_CONSENTED });
-        },
-        onGoBackClick: () => {
-          props.handleConsentGoBack();
-        },
+        onGoBackClick: () => props.handleConsentGoBack(),
         ref: props.navigationRef
       }
     ) });
   } else if (step === STEPS.ADDITIONAL_PRODUCT) {
-    if (!ADDITIONAL_PRODUCT_OPTIONS.includes(connectConfig?.additional_product_option)) {
+    if (!ADDITIONAL_PRODUCT_OPTIONS.includes(connectConfig?.additional_product_option))
       throw new Error("invalid product offer");
-    }
-    const onNoClick = () => {
-      dispatch({
-        type: ActionTypes$2.REJECT_ADDITIONAL_PRODUCT,
-        payload: {
-          consentIsEnabled
-        }
-      });
-    };
-    let onYesClick = null;
-    if (connectConfig?.additional_product_option === COMBO_JOB_DATA_TYPES.ACCOUNT_NUMBER) {
-      onYesClick = () => {
-        dispatch(addVerificationData({ consentIsEnabled }));
-      };
-    } else if (connectConfig?.additional_product_option === COMBO_JOB_DATA_TYPES.TRANSACTIONS) {
-      onYesClick = () => {
-        dispatch(addAggregationData({ consentIsEnabled }));
-      };
-    }
-    connectStepView = /* @__PURE__ */ jsxRuntimeExports.jsx(
-      AdditionalProductStep,
-      {
-        additionalProductName: connectConfig.additional_product_option,
-        onNoClick,
-        onYesClick,
-        ref: props.navigationRef
-      }
-    );
+    connectStepView = /* @__PURE__ */ jsxRuntimeExports.jsx(AdditionalProductStep, { ref: props.navigationRef });
   } else if (step === STEPS.ADD_MANUAL_ACCOUNT) {
     connectStepView = /* @__PURE__ */ jsxRuntimeExports.jsx(
       ManualAccountConnect,
       {
         availableAccountTypes: props.availableAccountTypes,
-        onClose: () => dispatch({
-          type: ActionTypes$2.GO_BACK_MANUAL_ACCOUNT,
-          payload: initialConfig
-        }),
         onManualAccountAdded: props.onManualAccountAdded,
         ref: props.navigationRef
       }
@@ -85159,7 +85152,6 @@ const RenderConnectStep = (props) => {
 };
 RenderConnectStep.propTypes = {
   availableAccountTypes: PropTypes$1.array,
-  handleAddManualAccountClick: PropTypes$1.func.isRequired,
   handleConsentGoBack: PropTypes$1.func.isRequired,
   handleCredentialsGoBack: PropTypes$1.func.isRequired,
   handleOAuthGoBack: PropTypes$1.func.isRequired,
@@ -87330,9 +87322,6 @@ const Connect$2 = ({
       loadConnect(props.clientConfig);
     }
   }, [isLoading, step, props.clientConfig]);
-  const _handleAddManualAccountClick = () => {
-    dispatch(stepToAddManualAccount$1());
-  };
   const _handleConsentGoBack = () => {
     if (state.returnToMicrodeposits) {
       dispatch(stepToMicrodeposits$1());
@@ -87425,7 +87414,6 @@ const Connect$2 = ({
             RenderConnectStep,
             {
               availableAccountTypes,
-              handleAddManualAccountClick: _handleAddManualAccountClick,
               handleConsentGoBack: _handleConsentGoBack,
               handleCredentialsGoBack: _handleCredentialsGoBack,
               handleOAuthGoBack: _handleOAuthGoBack,
@@ -87515,7 +87503,6 @@ const Edge$1 = "Edge";
 const Chrome$1 = "Chrome";
 const Firefox$1 = "Firefox";
 const Dismiss$1 = "Rejeter";
-const Success$1 = "Succès";
 const Spanish$1 = "Espagnol";
 const French$1 = "Français";
 const English$1 = "Anglais";
@@ -87856,9 +87843,6 @@ const frCa = {
 	"Please try linking a checking or savings account.": "Veuillez essayer de lier un compte courant ou un compte d'épargne.",
 	"Choose an institution that’s already connected and select accounts to share, or search for a different one.": "Choisissez une institution déjà connectée et sélectionnez les comptes à partager, ou recherchez-en un autre.",
 	"You have successfully connected to %1": "Vous vous êtes connecté avec succès à %1",
-	Success: Success$1,
-	"You have successfully connected to %1.": "Vous vous êtes connecté avec succès à %1.",
-	"You have successfully connected %1 to %2.": "Vous avez réussi à connecter %1 à %2",
 	"Go back": "Retourner",
 	"Account Information": "Informations sur le compte",
 	"Account type and description": "Type de compte et description",
@@ -87938,6 +87922,14 @@ const frCa = {
 	"Logo for %1": "Logo pour %1",
 	"Free %1 Connections Are No Longer Available": "Les connexions gratuites %1 ne sont plus disponibles",
 	"%1 now charges a fee for us to access your account data. To avoid passing that cost on to you, we no longer support %1 connections.": "$1 facture désormais des frais pour accéder à vos données de compte. Pour éviter de vous les répercuter, nous ne prenons plus en charge les connexions $1.",
+	"Success!": "Succès!",
+	"No accounts found": "Aucun compte trouvé",
+	"Return to institution selection": "Retour à la sélection des établissements",
+	"Additional permissions needed": "Autorisations supplémentaires nécessaires",
+	"Review instructions": "Instructions de révision",
+	"Unable to connect": "Impossible de se connecter",
+	"Maintenance in progress": "Entretien en cours",
+	"Deposits verified. You're almost done setting things up. Continue to your institution.": "Dépôts vérifiés. Vous avez presque terminé la configuration. Rendez-vous dans votre établissement.",
 	"connect/disclosure/policy/text\u0004By clicking Continue, you agree to the ": "En cliquant sur Continuer, vous acceptez la ",
 	"connect/disclosure/policy/link\u0004MX Privacy Policy.": "Politique de confidentialité de MX.",
 	"connect/disclosure/policy/link\u0004MX Privacy Policy": "Politique de confidentialité de MX.",
@@ -88012,7 +88004,6 @@ const Edge = "Edge";
 const Chrome = "Chrome";
 const Firefox = "Firefox";
 const Dismiss = "Descartar";
-const Success = "Éxito";
 const Spanish = "Español";
 const French = "Francés";
 const English = "Inglés";
@@ -88356,9 +88347,6 @@ const es = {
 	"Please try linking a checking or savings account.": "Intente vincular una cuenta corriente o de ahorros.",
 	"Choose an institution that’s already connected and select accounts to share, or search for a different one.": "Elija una institución que ya esté conectada y seleccione cuentas para compartir. o buscar uno diferente.",
 	"You have successfully connected to %1": "Te has conectado correctamente a %1",
-	Success: Success,
-	"You have successfully connected to %1.": "Te has conectado correctamente a %1.",
-	"You have successfully connected %1 to %2.": "Has conectado correctamente %1 a %2.",
 	"Account Information": "Información de la cuenta",
 	"Account type and description": "Tipo de cuenta y descripción",
 	"Credit limits": "Límites de crédito",
@@ -88437,6 +88425,14 @@ const es = {
 	"Logo for %1": "Logotipo de %1",
 	"Free %1 Connections Are No Longer Available": "Las conexiones gratuitas de %1 ya no están disponibles",
 	"%1 now charges a fee for us to access your account data. To avoid passing that cost on to you, we no longer support %1 connections.": "%1 ahora cobra una comisión por acceder a los datos de su cuenta. Para evitar que usted pague ese costo, ya no ofrecemos conexiones con %1.",
+	"Success!": "¡Éxito!",
+	"No accounts found": "No se encontraron cuentas",
+	"Return to institution selection": "Volver a la selección de instituciones",
+	"Additional permissions needed": "Se necesitan permisos adicionales",
+	"Review instructions": "Revisar instrucciones",
+	"Unable to connect": "No se puede conectar",
+	"Maintenance in progress": "Mantenimiento en curso",
+	"Deposits verified. You're almost done setting things up. Continue to your institution.": "Depósitos verificados. Ya casi terminas de configurar todo. Continúa con tu institución.",
 	"connect/disclosure/button\u0004Continue": "Continuar",
 	"connect/disclosure/policy/text\u0004By clicking Continue, you agree to the ": "Al hacer clic en Continuar, tu aceptas la ",
 	"connect/disclosure/policy/link\u0004MX Privacy Policy.": "Política de privacidad de Money Experience.",