@sheerid/jslib 1.111.0 → 1.112.0

package/sheerides6.js

@@ -1136,6 +1136,7 @@ const iframeClassNames = {
     CLOSE_TEXT: "sid-modal__close-text",
     CLOSE_ICON: "sid-modal__close-icon",
 };
+const iframeTitle = "SheerID Verification Form";
 const iframeConstants = {
     CLASS_NAMES: iframeClassNames,
     DEFAULT_MOBILE_THRESHOLD_WIDTH: 620,
@@ -9818,7 +9819,25 @@ const ChangeLocale = ({ value, options, onChange, intl, }) => {
             } }),
         React.createElement("div", { className: "sid-l-space-btm-sm" })));
 };
-const ChangeLocaleComponent = injectIntl(ChangeLocale);
+const ChangeLocaleComponent = injectIntl(ChangeLocale);
+const ChangeLocaleV2 = ({ verificationService, intl }) => {
+    const localeChoices = getAvailableLocaleChoices(verificationService.programTheme, intl);
+    const defaultLocaleChoice = {
+        value: "en-US",
+        label: "English",
+    };
+    const updateLocale = (localeChoice) => {
+        const nextState = fn(verificationService.viewModel, (draft) => {
+            draft.localeChoice = localeChoice;
+        });
+        verificationService.updateLocale(nextState, verificationService.programTheme, verificationService.verificationResponse.segment);
+    };
+    if (localeChoices.length <= 1) {
+        return null;
+    }
+    return (React.createElement(ChangeLocaleComponent, { options: localeChoices, value: verificationService.viewModel.localeChoice || defaultLocaleChoice, isErrored: false, onChange: (localeChoice) => updateLocale(localeChoice) }));
+};
+const ChangeLocaleV2Component = injectIntl(ChangeLocaleV2);
 
 const LoadingSpinnerComponent = () => (React.createElement("div", { className: "sid-spinner" },
     React.createElement("div", { className: "sid-spinner__frame" }),
@@ -10995,9 +11014,13 @@ const getRedirectUrlOverride = () => {
 const getErrorStepMockResponseOverrides = (mockResponse) => {
     const mockResponseClone = deepClone(mockResponse);
     const errorMock = getErrorIdOverride();
+    const redirectUrlMock = getRedirectUrlOverride();
     if (errorMock) {
         mockResponseClone.errorIds = [errorMock];
     }
+    if (redirectUrlMock) {
+        mockResponseClone.redirectUrl = redirectUrlMock;
+    }
     return mockResponseClone;
 };
 const getSuccessStepMockResponseOverrides = (mockResponse) => {
@@ -14631,6 +14654,7 @@ const verificationServiceReducer = (state = getInitialState(), action) => {
         case "RESET_STATE":
             return {
                 ...deepClone(getInitialState()),
+                programId: state.programId,
             };
         case "FORCE_UPDATE":
             return deepClone(state);
@@ -18494,14 +18518,20 @@ const HowDoesVerifyingWorkComponent = ({ verificationService, initialVisibility
                 React.createElement(FaqLinkComponent, { verificationService: verificationService })))) : null));
 };
 
-const BaseCountryComponentWrapper = ({ verificationService, viewModel, intl, viewModelDraftDecorator, }) => {
+const BaseCountryComponentWrapper = ({ verificationService, viewModelDraftDecorator = undefined, intl, viewModel = undefined, nextFocusField = undefined, }) => {
+    if (viewModel) {
+        logger.warn("viewModel prop is deprecated, use verificationService.viewModel instead");
+    }
+    if (nextFocusField) {
+        logger.warn("nextFocusField prop is deprecated");
+    }
     const countryChoices = getAvailableCountryChoices(verificationService.programTheme, intl);
     const defaultCountryChoice = getDefaultCountryChoice(countryChoices);
     const { fieldValidationErrors } = verificationService;
     const hasMultipleCountries = countryChoices.length > 1;
     const [firstRender, setFirstRender] = React.useState(true);
     const updateCountryChoice = (countryChoice) => {
-        const nextState = fn(viewModel, (draft) => {
+        const nextState = fn(verificationService.viewModel, (draft) => {
             draft.countryChoice = countryChoice || undefined;
             // Adds backwards compatibility with Age and Employment programs
             draft.country = countryChoice ? countryChoice.value : undefined;
@@ -18514,8 +18544,8 @@ const BaseCountryComponentWrapper = ({ verificationService, viewModel, intl, vie
     React.useEffect(() => {
         if (firstRender) {
             setFirstRender(false);
-            const countryChoice = viewModel.countryChoice
-                ? viewModel.countryChoice
+            const countryChoice = verificationService.viewModel.countryChoice
+                ? verificationService.viewModel.countryChoice
                 : defaultCountryChoice;
             updateCountryChoice(countryChoice);
         }
@@ -18523,27 +18553,28 @@ const BaseCountryComponentWrapper = ({ verificationService, viewModel, intl, vie
     React.useEffect(() => {
         const includesUS = countryChoices.some((choice) => choice.value === "US");
         if (!hasMultipleCountries && !includesUS) {
-            const fieldsToSkip = viewModel.fieldsToSkipValidation
-                ? [...viewModel.fieldsToSkipValidation, "country"]
+            const fieldsToSkip = verificationService.viewModel.fieldsToSkipValidation
+                ? [...verificationService.viewModel.fieldsToSkipValidation, "country"]
                 : ["country", "address1", "postalCode", "state", "city"];
-            verificationService.updateViewModel(produceDraftViewModel(viewModel, "fieldsToSkipValidation", fieldsToSkip));
+            verificationService.updateViewModel(produceDraftViewModel(verificationService.viewModel, "fieldsToSkipValidation", fieldsToSkip));
         }
     }, [hasMultipleCountries]);
     React.useEffect(() => {
         const updatedFieldValidationErrors = fn(verificationService.fieldValidationErrors, (draft) => {
             if (draft.country) {
-                draft.country = validateFieldById("country", viewModel.countryChoice, verificationService.formValidationOptions);
+                draft.country = validateFieldById("country", verificationService.viewModel.countryChoice, verificationService.formValidationOptions);
             }
-            if ("postalCode" in viewModel && viewModel.postalCode) {
-                draft.postalCode = validateFieldById("postalCode", viewModel.postalCode, verificationService.formValidationOptions);
+            if ("postalCode" in verificationService.viewModel &&
+                verificationService.viewModel.postalCode) {
+                draft.postalCode = validateFieldById("postalCode", verificationService.viewModel.postalCode, verificationService.formValidationOptions);
             }
         });
         updateFieldValidationErrors(updatedFieldValidationErrors, verificationService);
-    }, [viewModel.countryChoice]);
+    }, [verificationService.viewModel.countryChoice]);
     if (!hasMultipleCountries) {
         return null;
     }
-    return (React.createElement(CountryComponent, { isRequired: true, options: countryChoices, value: viewModel.countryChoice, isErrored: Boolean(fieldValidationErrors.country), onChange: async (countryChoice) => {
+    return (React.createElement(CountryComponent, { isRequired: true, options: countryChoices, value: verificationService.viewModel.countryChoice, isErrored: Boolean(fieldValidationErrors.country), onChange: async (countryChoice) => {
             const countryValue = countryChoice ? countryChoice.value : undefined;
             updateCountryChoice(countryChoice);
             updateFieldValidationErrorsByFieldId("country", countryValue, verificationService);
@@ -18625,14 +18656,9 @@ const ExtraMessage = ({ verificationService, suffix }) => verificationService.me
 /**
  * TODO - preamble
  */
-const StepStudentPersonalInfo = ({ intl, verificationService, }) => {
+const StepStudentPersonalInfo = ({ verificationService, }) => {
     const viewModel = verificationService.viewModel;
     const { fieldValidationErrors } = verificationService;
-    const localeChoices = getAvailableLocaleChoices(verificationService.programTheme, intl);
-    const defaultLocaleChoice = {
-        value: "en-US",
-        label: "English",
-    };
     const verificationResponse = verificationService.verificationResponse;
     const failedInstantMatch = hasFailedInstantMatch(verificationResponse);
     const updateStudentViewModel = (key, value) => {
@@ -18641,12 +18667,6 @@ const StepStudentPersonalInfo = ({ intl, verificationService, }) => {
         });
         verificationService.updateViewModel(nextState);
     };
-    const updateLocale = (localeChoice) => {
-        const nextState = fn(viewModel, (draft) => {
-            draft.localeChoice = localeChoice;
-        });
-        verificationService.updateLocale(nextState, verificationService.programTheme, verificationService.verificationResponse.segment);
-    };
     return (React.createElement("div", { id: "sid-step-student-personal-info", className: "sid-l-container" },
         failedInstantMatch ? (React.createElement("div", { className: "sid-header" },
             React.createElement("div", { className: "sid-l-horz-center" },
@@ -18664,8 +18684,8 @@ const StepStudentPersonalInfo = ({ intl, verificationService, }) => {
                 "\u00A0",
                 React.createElement(HowDoesVerifyingWorkComponent, { verificationService: verificationService }),
                 React.createElement(RewardsRemainingComponent, { verificationService: verificationService })))),
-        localeChoices.length > 1 ? (React.createElement(ChangeLocaleComponent, { options: localeChoices, value: viewModel.localeChoice || defaultLocaleChoice, isErrored: false, onChange: (localeChoice) => updateLocale(localeChoice) })) : null,
-        React.createElement(CountryComponentWrapper, { verificationService: verificationService, viewModel: viewModel }),
+        React.createElement(ChangeLocaleV2Component, { verificationService: verificationService }),
+        React.createElement(CountryComponentWrapper, { verificationService: verificationService }),
         React.createElement(CollegeNameComponent, { value: verificationService.viewModel.organization, verificationService: verificationService, isErrored: !!fieldValidationErrors.organization, isRequired: true, onChange: (choice) => {
                 updateViewModelOrganization(choice, verificationService);
                 updateFieldValidationErrorsByFieldId("organization", choice, verificationService);
@@ -18709,7 +18729,7 @@ const StepStudentPersonalInfo = ({ intl, verificationService, }) => {
                     React.createElement("span", { id: "verify-status-text" }, failedInstantMatch ? (React.createElement(FormattedHTMLMessage, { id: "tryAgain", defaultMessage: "Try Again" })) : (React.createElement(FormattedHTMLMessage, { id: "verifyMyStudentStatus", defaultMessage: "Verify My Student Status" })))))),
         React.createElement(FormFooterComponent, { verificationService: verificationService })));
 };
-const StepStudentPersonalInfoComponent = injectIntl(StepStudentPersonalInfo);
+const StepStudentPersonalInfoComponent = StepStudentPersonalInfo;
 
 const PostalCodeInput = ({ onChange, value, isValid, intl, placeholder = "", ariaLabelledBy, }) => (React.createElement(InputTextComponent, { id: "postal-code", isErrored: !isValid, onChange: (e) => onChange(e.target.value), pattern: "[a-zA-Z0-9 ]*", placeholder: placeholder ||
         intl.formatHTMLMessage({ id: "postalCodePlaceholder", defaultMessage: "Postal Code" }), refId: "postalCode", value: value, required: true, "aria-labelledby": ariaLabelledBy }));
@@ -18739,7 +18759,7 @@ const StepSeniorPersonalInfo = ({ verificationService }) => {
         });
         verificationService.updateViewModel(nextState);
     };
-    return (React.createElement("div", { id: "sid-step-student-personal-info", className: "sid-l-container" },
+    return (React.createElement("div", { id: "sid-step-senior-personal-info", className: "sid-l-container" },
         failedInstantMatch ? (React.createElement("div", { className: "sid-header" },
             React.createElement("div", { className: "sid-l-horz-center" },
                 React.createElement(LogoComponent, { verificationService: verificationService })),
@@ -18756,6 +18776,7 @@ const StepSeniorPersonalInfo = ({ verificationService }) => {
                 "\u00A0",
                 React.createElement(HowDoesVerifyingWorkComponent, { verificationService: verificationService }),
                 React.createElement(RewardsRemainingComponent, { verificationService: verificationService })))),
+        React.createElement(ChangeLocaleV2Component, { verificationService: verificationService }),
         React.createElement("div", { className: "sid-names" },
             React.createElement(FirstNameComponent, { value: viewModel.firstName, isErrored: !!fieldValidationErrors.firstName, onChange: (newValue) => {
                     updateSeniorViewModel("firstName", newValue);
@@ -18905,7 +18926,8 @@ const StepAgePersonalInfo = ({ verificationService, intl }) => {
                 "\u00A0",
                 React.createElement(HowDoesVerifyingWorkComponent, { verificationService: verificationService }),
                 React.createElement(RewardsRemainingComponent, { verificationService: verificationService })))),
-        React.createElement(CountryComponentWrapper, { verificationService: verificationService, viewModel: viewModel, viewModelDraftDecorator: (draft, countryChoice) => {
+        React.createElement(ChangeLocaleV2Component, { verificationService: verificationService }),
+        React.createElement(CountryComponentWrapper, { verificationService: verificationService, viewModelDraftDecorator: (draft, countryChoice) => {
                 const viewModelDraft = draft;
                 const country = countryChoice ? countryChoice.value : undefined;
                 if (!displayPhoneNumber(country, smsLoopEnabled)) {
@@ -18988,32 +19010,17 @@ const TeacherSchool = ({ value, isErrored, onChange, verificationService, intl,
 };
 const TeacherSchoolComponent = injectIntl(TeacherSchool);
 
-/**
- * Step Teacher Personal Info Component
- * TODO - We need to import more from es6
- */
-const StepTeacherPersonalInfo = ({ intl, verificationService, }) => {
+const StepTeacherPersonalInfo = ({ verificationService, }) => {
     const viewModel = verificationService.viewModel;
     const { fieldValidationErrors } = verificationService;
     const verificationResponse = verificationService.verificationResponse;
     const failedInstantMatch = hasFailedInstantMatch(verificationResponse);
-    const localeChoices = getAvailableLocaleChoices(verificationService.programTheme, intl);
-    const defaultLocaleChoice = {
-        value: "en-US",
-        label: "English",
-    };
     const updateTeacherViewModel = (key, value) => {
         const nextState = fn(viewModel, (draft) => {
             draft[key] = value;
         });
         verificationService.updateViewModel(nextState);
     };
-    const updateLocale = (localeChoice) => {
-        const nextState = fn(viewModel, (draft) => {
-            draft.localeChoice = localeChoice;
-        });
-        verificationService.updateLocale(nextState, verificationService.programTheme, verificationService.verificationResponse.segment);
-    };
     // Don't validate DOB if ID Check is not enabled
     useEffect(() => {
         if (!verificationService.programTheme.idCheckAddOnEnabled) {
@@ -19041,8 +19048,8 @@ const StepTeacherPersonalInfo = ({ intl, verificationService, }) => {
                 "\u00A0",
                 React.createElement(HowDoesVerifyingWorkComponent, { verificationService: verificationService }),
                 React.createElement(RewardsRemainingComponent, { verificationService: verificationService })))),
-        localeChoices.length > 1 ? (React.createElement(ChangeLocaleComponent, { options: localeChoices, value: viewModel.localeChoice || defaultLocaleChoice, isErrored: false, onChange: (localeChoice) => updateLocale(localeChoice) })) : null,
-        React.createElement(CountryComponentWrapper, { verificationService: verificationService, viewModel: viewModel }),
+        React.createElement(ChangeLocaleV2Component, { verificationService: verificationService }),
+        React.createElement(CountryComponentWrapper, { verificationService: verificationService }),
         React.createElement(TeacherSchoolComponent, { value: verificationService.viewModel.organization, verificationService: verificationService, isErrored: !!fieldValidationErrors.organization, onChange: (choice) => {
                 updateViewModelOrganization(choice, verificationService);
                 updateFieldValidationErrorsByFieldId("organization", choice, verificationService);
@@ -19090,7 +19097,7 @@ const StepTeacherPersonalInfo = ({ intl, verificationService, }) => {
                     React.createElement("span", { id: "verify-status-text" }, failedInstantMatch ? (React.createElement(FormattedHTMLMessage, { id: "tryAgain", defaultMessage: "Try Again" })) : (React.createElement(FormattedHTMLMessage, { id: "verifyMyTeacherStatus", defaultMessage: "Verify My Teacher Status" })))))),
         React.createElement(FormFooterComponent, { verificationService: verificationService })));
 };
-const StepTeacherPersonalInfoComponent = injectIntl(StepTeacherPersonalInfo);
+const StepTeacherPersonalInfoComponent = StepTeacherPersonalInfo;
 
 const MemberId = ({ value, isErrored, onChange, explanation, intl, placeholder = "", isRequired = false, label, }) => {
     const getDefaultExplanation = () => !isRequired ? React.createElement(FormattedHTMLMessage, { id: "optional", defaultMessage: "Optional" }) : "";
@@ -19119,31 +19126,17 @@ const MembershipOrganization = ({ value, isErrored, onChange, verificationServic
 };
 const MembershipOrganizationComponent = injectIntl(MembershipOrganization);
 
-/**
- * Step Member Personal Info Component
- */
-const StepMemberPersonalInfo = ({ intl, verificationService, }) => {
+const StepMemberPersonalInfo = ({ verificationService }) => {
     const viewModel = verificationService.viewModel;
     const { fieldValidationErrors } = verificationService;
     const verificationResponse = verificationService.verificationResponse;
     const failedInstantMatch = hasFailedInstantMatch(verificationResponse);
-    const localeChoices = getAvailableLocaleChoices(verificationService.programTheme, intl);
-    const defaultLocaleChoice = {
-        value: "en-US",
-        label: "English",
-    };
     const updateMemberViewModel = (key, value) => {
         const nextState = fn(viewModel, (draft) => {
             draft[key] = value;
         });
         verificationService.updateViewModel(nextState);
     };
-    const updateLocale = (localeChoice) => {
-        const nextState = fn(viewModel, (draft) => {
-            draft.localeChoice = localeChoice;
-        });
-        verificationService.updateLocale(nextState, verificationService.programTheme, verificationService.verificationResponse.segment);
-    };
     return (React.createElement("div", { id: "sid-step-member-personal-info", className: "sid-l-container" },
         failedInstantMatch ? (React.createElement("div", { className: "sid-header" },
             React.createElement("div", { className: "sid-l-horz-center" },
@@ -19161,8 +19154,8 @@ const StepMemberPersonalInfo = ({ intl, verificationService, }) => {
                 "\u00A0",
                 React.createElement(HowDoesVerifyingWorkComponent, { verificationService: verificationService }),
                 React.createElement(RewardsRemainingComponent, { verificationService: verificationService })))),
-        localeChoices.length > 1 ? (React.createElement(ChangeLocaleComponent, { options: localeChoices, value: viewModel.localeChoice || defaultLocaleChoice, isErrored: false, onChange: (localeChoice) => updateLocale(localeChoice) })) : null,
-        React.createElement(CountryComponentWrapper, { verificationService: verificationService, viewModel: viewModel }),
+        React.createElement(ChangeLocaleV2Component, { verificationService: verificationService }),
+        React.createElement(CountryComponentWrapper, { verificationService: verificationService }),
         React.createElement(MembershipOrganizationComponent, { value: verificationService.viewModel.organization, verificationService: verificationService, isErrored: !!fieldValidationErrors.organization, onChange: (choice) => {
                 updateViewModelOrganization(choice, verificationService);
                 updateFieldValidationErrorsByFieldId("organization", choice, verificationService);
@@ -19210,7 +19203,7 @@ const StepMemberPersonalInfo = ({ intl, verificationService, }) => {
                     React.createElement("span", { id: "verify-status-text" }, failedInstantMatch ? (React.createElement(FormattedHTMLMessage, { id: "tryAgain", defaultMessage: "Try Again" })) : (React.createElement(FormattedHTMLMessage, { id: "verifyMyMembershipStatus", defaultMessage: "Verify My Membership Status" })))))),
         React.createElement(FormFooterComponent, { verificationService: verificationService })));
 };
-const StepMemberPersonalInfoComponent = injectIntl(StepMemberPersonalInfo);
+const StepMemberPersonalInfoComponent = StepMemberPersonalInfo;
 
 const compareLabel = (a, b) => {
     let sortValue;
@@ -19353,7 +19346,8 @@ const StepActiveMilitaryPersonalInfo = ({ intl, verificationService, }) => {
             React.createElement("div", { className: "sid-header__how-verifying-works sid-l-horz-center" },
                 React.createElement(HowDoesVerifyingWorkComponent, { verificationService: verificationService }),
                 React.createElement(RewardsRemainingComponent, { verificationService: verificationService })))),
-        React.createElement(CountryComponentWrapper, { verificationService: verificationService, viewModel: viewModel }),
+        React.createElement(ChangeLocaleV2Component, { verificationService: verificationService }),
+        React.createElement(CountryComponentWrapper, { verificationService: verificationService }),
         availableStatuses ? (React.createElement(MilitaryStatusComponent, { value: {
                 value: viewModel.status,
                 label: getStatusLabel(intl, viewModel.status, MilitaryStatusDefaultMessagesEnum),
@@ -19563,7 +19557,8 @@ const StepInactiveMilitaryPersonalInfo = ({ intl, verificationService, }) => {
                 "\u00A0",
                 React.createElement(HowDoesVerifyingWorkComponent, { verificationService: verificationService }),
                 React.createElement(RewardsRemainingComponent, { verificationService: verificationService })))),
-        React.createElement(CountryComponentWrapper, { verificationService: verificationService, viewModel: viewModel }),
+        React.createElement(ChangeLocaleV2Component, { verificationService: verificationService }),
+        React.createElement(CountryComponentWrapper, { verificationService: verificationService }),
         availableStatuses ? (React.createElement(MilitaryStatusComponent, { value: {
                 value: viewModel.status,
                 label: getStatusLabel(intl, viewModel.status, MilitaryStatusDefaultMessagesEnum),
@@ -19702,7 +19697,8 @@ const StepFirstResponderPersonalInfo = ({ intl, verificationService, }) => {
             React.createElement("div", { className: "sid-header__how-verifying-works sid-l-horz-center" },
                 React.createElement(HowDoesVerifyingWorkComponent, { verificationService: verificationService }),
                 React.createElement(RewardsRemainingComponent, { verificationService: verificationService })))),
-        React.createElement(CountryComponentWrapper, { verificationService: verificationService, viewModel: viewModel }),
+        React.createElement(ChangeLocaleV2Component, { verificationService: verificationService }),
+        React.createElement(CountryComponentWrapper, { verificationService: verificationService }),
         React.createElement(FirstResponderStatusComponent, { value: {
                 value: viewModel.status,
                 label: getStatusLabel(intl, viewModel.status, FirstResponderStatusDefaultMessagesEnum),
@@ -19857,7 +19853,8 @@ const StepMedicalProfessionalPersonalInfo = ({ intl, verificationService, }) =>
             React.createElement("div", { className: "sid-header__how-verifying-works sid-l-horz-center" },
                 React.createElement(HowDoesVerifyingWorkComponent, { verificationService: verificationService }),
                 React.createElement(RewardsRemainingComponent, { verificationService: verificationService })))),
-        React.createElement(CountryComponentWrapper, { verificationService: verificationService, viewModel: viewModel }),
+        React.createElement(ChangeLocaleV2Component, { verificationService: verificationService }),
+        React.createElement(CountryComponentWrapper, { verificationService: verificationService }),
         React.createElement(MedicalStatusComponent, { value: {
                 value: viewModel.status,
                 label: getStatusLabel(intl, viewModel.status, MedicalProfessionalStatusDefaultMessagesEnum),
@@ -19981,7 +19978,8 @@ const StepEmploymentPersonalInfo = ({ intl, verificationService, }) => {
                 "\u00A0",
                 React.createElement(HowDoesVerifyingWorkComponent, { verificationService: verificationService }),
                 React.createElement(RewardsRemainingComponent, { verificationService: verificationService }))),
-        React.createElement(CountryComponentWrapper, { verificationService: verificationService, viewModel: viewModel, viewModelDraftDecorator: (draft, countryChoice) => {
+        React.createElement(ChangeLocaleV2Component, { verificationService: verificationService }),
+        React.createElement(CountryComponentWrapper, { verificationService: verificationService, viewModelDraftDecorator: (draft, countryChoice) => {
                 const viewModel = draft;
                 viewModel.shouldCollectAddress = shouldCollectAddressFields(countryChoice, verificationService.programTheme.config.countries);
                 if (!viewModel.shouldCollectAddress) {
@@ -20104,6 +20102,7 @@ const StepDriverLicensePersonalInfo = ({ intl, verificationService, }) => {
             React.createElement("div", { className: "sid-header__how-verifying-works sid-l-horz-center" },
                 React.createElement(HowDoesVerifyingWorkComponent, { verificationService: verificationService }),
                 React.createElement(RewardsRemainingComponent, { verificationService: verificationService })))),
+        React.createElement(ChangeLocaleV2Component, { verificationService: verificationService }),
         React.createElement("div", { className: "sid-names" },
             React.createElement(FirstNameComponent, { value: viewModel.firstName, isErrored: !!fieldValidationErrors.firstName, onChange: (newValue) => {
                     updateIdentityViewModel("firstName", newValue);
@@ -20183,6 +20182,7 @@ const StepGeneralIdentityPersonalInfo = ({ intl, verificationService, }) => {
             React.createElement("div", { className: "sid-header__how-verifying-works sid-l-horz-center" },
                 React.createElement(HowDoesVerifyingWorkComponent, { verificationService: verificationService }),
                 React.createElement(RewardsRemainingComponent, { verificationService: verificationService })))),
+        React.createElement(ChangeLocaleV2Component, { verificationService: verificationService }),
         React.createElement("div", { className: "sid-names" },
             React.createElement(FirstNameComponent, { value: viewModel.firstName, isErrored: !!fieldValidationErrors.firstName, onChange: (newValue) => {
                     updateIdentityViewModel("firstName", newValue);
@@ -20275,6 +20275,7 @@ const StepHybridIdentityPersonalInfo = ({ intl, verificationService, }) => {
             React.createElement("div", { className: "sid-header__how-verifying-works sid-l-horz-center" },
                 React.createElement(HowDoesVerifyingWorkComponent, { verificationService: verificationService }),
                 React.createElement(RewardsRemainingComponent, { verificationService: verificationService })))),
+        React.createElement(ChangeLocaleV2Component, { verificationService: verificationService }),
         React.createElement("div", { className: "sid-names" },
             React.createElement(FirstNameComponent, { value: viewModel.firstName, isErrored: !!fieldValidationErrors.firstName, onChange: (newValue) => {
                     updateIdentityViewModel("firstName", newValue);
@@ -20403,7 +20404,9 @@ const StepLicensedProfessionalPersonalInfo = ({ intl, verificationService, }) =>
         return availableStatuses;
     };
     return (React.createElement("div", { id: "sid-step-licensed-professional-personal-info", className: "sid-l-container" },
-        failedInstantMatch ? (React.createElement("p", null, "Failied instant match")) : (React.createElement("div", { className: "sid-header" },
+        failedInstantMatch ? (
+        // TODO localize this message
+        React.createElement("p", null, "Failied instant match")) : (React.createElement("div", { className: "sid-header" },
             React.createElement("div", { className: "sid-l-horz-center" },
                 React.createElement(LogoComponent, { verificationService: verificationService })),
             React.createElement("div", { className: "sid-header__title sid-l-horz-center" },
@@ -20413,6 +20416,8 @@ const StepLicensedProfessionalPersonalInfo = ({ intl, verificationService, }) =>
             React.createElement("div", { className: "sid-header__how-verifying-works sid-l-horz-center" },
                 React.createElement(HowDoesVerifyingWorkComponent, { verificationService: verificationService }),
                 React.createElement(RewardsRemainingComponent, { verificationService: verificationService })))),
+        React.createElement(ChangeLocaleV2Component, { verificationService: verificationService }),
+        React.createElement(CountryComponentWrapper, { verificationService: verificationService }),
         React.createElement(StatusComponent, { segmentId: SEGMENT_ID$1, value: {
                 value: viewModel.statuses ? viewModel.statuses[0] : "",
                 label: viewModel.statuses ? getStatusLabel(viewModel.statuses[0]) : "",
@@ -20502,6 +20507,7 @@ const StepMoverPersonalInfo = ({ verificationService }) => {
                 React.createElement("br", null),
                 React.createElement(HowDoesVerifyingWorkComponent, { verificationService: verificationService }),
                 React.createElement(RewardsRemainingComponent, { verificationService: verificationService })))),
+        React.createElement(ChangeLocaleV2Component, { verificationService: verificationService }),
         React.createElement("div", { className: "sid-names" },
             React.createElement(FirstNameComponent, { value: viewModel.firstName, isErrored: !!fieldValidationErrors.firstName, onChange: (newValue) => {
                     updateMoverViewModel("firstName", newValue);
@@ -20576,11 +20582,6 @@ const StepLowIncomePersonalInfo = ({ intl, verificationService, }) => {
     const { fieldValidationErrors } = verificationService;
     const verificationResponse = verificationService.verificationResponse;
     const failedInstantMatch = hasFailedInstantMatch(verificationResponse);
-    const localeChoices = getAvailableLocaleChoices(verificationService.programTheme, intl);
-    const defaultLocaleChoice = {
-        value: "en-US",
-        label: "English",
-    };
     const selectedStatus = viewModel.statuses[0] ? viewModel.statuses[0] : undefined;
     const isSelectedStatusSnapBenefits = selectedStatus === "SNAP_BENEFITS";
     const updateLowIncomeViewModel = (key, value) => {
@@ -20608,12 +20609,6 @@ const StepLowIncomePersonalInfo = ({ intl, verificationService, }) => {
         }
         return availableStatuses;
     };
-    const updateLocale = (localeChoice) => {
-        const nextState = fn(viewModel, (draft) => {
-            draft.localeChoice = localeChoice;
-        });
-        verificationService.updateLocale(nextState, verificationService.programTheme, verificationService.verificationResponse.segment);
-    };
     React.useEffect(() => {
         if (isSelectedStatusSnapBenefits) {
             const updatedViewModel = { fieldsToSkipValidation: ["organization"] };
@@ -20637,8 +20632,8 @@ const StepLowIncomePersonalInfo = ({ intl, verificationService, }) => {
                 "\u00A0",
                 React.createElement(HowDoesVerifyingWorkComponent, { verificationService: verificationService }),
                 React.createElement(RewardsRemainingComponent, { verificationService: verificationService })))),
-        localeChoices.length > 1 ? (React.createElement(ChangeLocaleComponent, { options: localeChoices, value: viewModel.localeChoice || defaultLocaleChoice, isErrored: false, onChange: (localeChoice) => updateLocale(localeChoice) })) : null,
-        React.createElement(CountryComponentWrapper, { verificationService: verificationService, viewModel: viewModel }),
+        React.createElement(ChangeLocaleV2Component, { verificationService: verificationService }),
+        React.createElement(CountryComponentWrapper, { verificationService: verificationService }),
         React.createElement(StatusComponent, { segmentId: SEGMENT_ID, value: {
                 value: viewModel.statuses ? viewModel.statuses[0] : "",
                 label: viewModel.statuses ? getStatusLabel(viewModel.statuses[0]) : "",
@@ -20784,6 +20779,7 @@ const Step = ({ verificationService }) => {
                 React.createElement(LogoComponent, { verificationService: verificationService })),
             React.createElement("div", { className: "sid-header__title sid-l-horz-center" },
                 React.createElement(FormattedHTMLMessage, { id: "step.collectSocialSecurityNumber.title", defaultMessage: "Enter your social security number" })),
+            React.createElement(ChangeLocaleV2Component, { verificationService: verificationService }),
             React.createElement("div", { className: "sid-ssn-wrapper" },
                 React.createElement(SocialSecurityNumber, { value: viewModel.socialSecurityNumber, onChange: (value) => {
                         updateSSNViewModel("socialSecurityNumber", value);
@@ -23530,6 +23526,7 @@ class Iframe {
         if (Iframe.isValidHttpUrl(url)) {
             const options = {
                 className: iframeConstants.CLASS_NAMES.INLINE_IFRAME_CONTENT,
+                title: iframeTitle,
             };
             this.containerElement = containerElement;
             this.verificationUrl = new URL(getVerificationUrl(url));
@@ -23556,7 +23553,7 @@ class Iframe {
     createIframe(options) {
         this.iframe = document.createElement("iframe");
         this.iframe.classList.add(options.className);
-        this.iframe.title = this.verificationUrl.href;
+        this.iframe.title = options.title;
         let mark = "?";
         if (this.verificationUrl.search) {
             mark = "&";
@@ -23681,6 +23678,7 @@ class Modal {
         this.iframeInstance = new Iframe(wrapper, this.verificationUrl);
         const options = {
             className: iframeConstants.CLASS_NAMES.MODAL_IFRAME,
+            title: iframeTitle,
         };
         this.iframeInstance.createIframe(options);
         wrapper.appendChild(this.iframeInstance.iframe);