@axos-web-dev/shared-components 1.0.77-patch.9 → 1.0.77-patch.92-rev.1

package/dist/Forms/MortgageRate/MortgageRateForm.js

@@ -6,14 +6,17 @@ import SvgArrowIcon from "../../icons/ArrowIcon/index.js";
 import SvgAxosX from "../../icons/AxosX/index.js";
 import SvgComponent from "../../icons/AxosX/Blue.js";
 import "../../icons/CheckIcon/CheckIcon.css.js";
-import '../../assets/VideoWrapper/VideoWrapper.css';import '../../assets/TopicalNavSet/TopicalNavSet.css';import '../../assets/TopicalNavItem/TopicalNavItem.css';import '../../assets/Topic/Topic.css';import '../../assets/TextBlock/TextBlock.css';import '../../assets/SocialMediaBar/SocialMediaBar.css';import '../../assets/SecondaryFooter/SecondaryFooter.css';import '../../assets/Pagination/Pagination.css';import '../../assets/PageNavSet/PageNavigationSet.css';import '../../assets/NavigationMenu/LaVictoire/NavBar.css';import '../../assets/NavigationMenu/AxosALTS/NavBar.css';import '../../assets/NavigationMenu/AxosClearing/NavBar.css';import '../../assets/NavigationMenu/AxosBank/SubNavbar.css';import '../../assets/NavigationMenu/AxosBank/NavBar.css';import '../../assets/NavigationMenu/AxosAdvisorServices/SubNavbar.css';import '../../assets/NavigationMenu/AxosAdvisorServices/NavBar.css';import '../../assets/NavigationMenu/AxosAdvisor/SubNavbar.css';import '../../assets/NavigationMenu/AxosAdvisor/NavBar.css';import '../../assets/Insight/Insight.css';import '../../assets/Insight/Featured/Header.css';import '../../assets/Insight/Featured/CategorySelector.css';import '../../assets/Insight/Featured/Featured.css';import '../../assets/ImageLink/ImageLink.css';import '../../assets/VideoTile/VideoTile.css';import '../../assets/HelpArticle/HelpArticle.css';import '../../assets/FooterSiteMap/AxosBank/FooterSiteMap.css';import '../../assets/FooterDisclosure/LVF/LaVictorieFooter.css';import '../../assets/DownloadTile/DownloadTile.css';import '../../assets/CollectInformationAlert/CollectInformationAlert.css';import '../../assets/CallToActionBar/CallToActionBar.css';import '../../assets/AwardsItem/AwardsItem.css';import '../../assets/AwardsBanner/AwardsBanner.css';import '../../assets/Auth/SignIn.css';import '../../assets/Auth/ErrorAlert.css';import '../../assets/Calculators/MarginTradingCalculator/MarginTradingCalculator.css';import '../../assets/Forms/QuickPricer/UserInformation.css';import '../../assets/Modal/Modal.css';import '../../assets/Forms/QuickPricer/QuickPricerResults.css';import '../../assets/BulletItem/BulletItem.css';import '../../assets/Typography/Typography.css';import '../../assets/icons/FollowIcon/FollowIcon.css';import '../../assets/icons/DownloadIcon/DownloadIcon.css';import '../../assets/themes/victorie.css';import '../../assets/themes/premier.css';import '../../assets/themes/axos.css';/* empty css                                   */
+import '../../assets/VideoWrapper/VideoWrapper.css';import '../../assets/TopicalNavSet/TopicalNavSet.css';import '../../assets/TopicalNavItem/TopicalNavItem.css';import '../../assets/Topic/Topic.css';import '../../assets/TextBlock/TextBlock.css';import '../../assets/SocialMediaBar/SocialMediaBar.css';import '../../assets/SecondaryFooter/SecondaryFooter.css';import '../../assets/Pagination/Pagination.css';import '../../assets/PageNavSet/PageNavigationSet.css';import '../../assets/NavigationMenu/LaVictoire/NavBar.css';import '../../assets/NavigationMenu/AxosALTS/NavBar.css';import '../../assets/NavigationMenu/AxosClearing/NavBar.css';import '../../assets/NavigationMenu/AxosBank/SubNavbar.css';import '../../assets/NavigationMenu/AxosBank/NavBar.css';import '../../assets/NavigationMenu/AxosAdvisorServices/SubNavbar.css';import '../../assets/NavigationMenu/AxosAdvisorServices/NavBar.css';import '../../assets/NavigationMenu/AxosAdvisor/SubNavbar.css';import '../../assets/NavigationMenu/AxosAdvisor/NavBar.css';import '../../assets/Insight/Featured/Header.css';import '../../assets/Insight/Featured/CategorySelector.css';import '../../assets/Insight/Featured/Featured.css';import '../../assets/ImageLink/ImageLink.css';import '../../assets/VideoTile/VideoTile.css';import '../../assets/HelpArticle/HelpArticle.css';import '../../assets/FooterSiteMap/AxosBank/FooterSiteMap.css';import '../../assets/FooterDisclosure/LVF/LaVictorieFooter.css';import '../../assets/DownloadTile/DownloadTile.css';import '../../assets/CollectInformationAlert/CollectInformationAlert.css';import '../../assets/Chatbot/ChatWindow.css';import '../../assets/Chatbot/Chatbot.css';import '../../assets/Chatbot/Bubble.css';import '../../assets/Chatbot/AnimatedGradientBorder.css';import '../../assets/CallToActionBar/CallToActionBar.css';import '../../assets/Insight/Insight.css';import '../../assets/AwardsItem/AwardsItem.css';import '../../assets/AwardsBanner/AwardsBanner.css';import '../../assets/Auth/SignIn.css';import '../../assets/Auth/ErrorAlert.css';import '../../assets/Calculators/MarginTradingCalculator/MarginTradingCalculator.css';import '../../assets/Forms/QuickPricer/UserInformation.css';import '../../assets/Modal/Modal.css';import '../../assets/Forms/QuickPricer/QuickPricerResults.css';import '../../assets/BulletItem/BulletItem.css';import '../../assets/Typography/Typography.css';import '../../assets/icons/FollowIcon/FollowIcon.css';import '../../assets/icons/DownloadIcon/DownloadIcon.css';import '../../assets/themes/victorie.css';import '../../assets/themes/ufb.css';import '../../assets/themes/premier.css';import '../../assets/themes/axos.css';/* empty css                                   */
 /* empty css                                      */
+/* empty css                                  */
 /* empty css                                       */
 /* empty css                                                       */
 /* empty css                                                   */
 import "../../utils/allowedAxosDomains.js";
+import * as z from "zod";
 import { associatedEmail } from "../../utils/EverestValidity.js";
 import { getVariant } from "../../utils/getVariant.js";
+import { useCachedEmailValidator } from "../../utils/useCachedValidators.js";
 import clsx from "clsx";
 /* empty css                                             */
 /* empty css                                             */
@@ -41,9 +44,11 @@ import { InputPhone } from "../../Input/InputPhone.js";
 import "../../Input/InputTextArea.js";
 import { DownPaymentInput } from "../../Input/DownPaymentInput.js";
 import "../../Input/RadioButton.js";
+import "../../Input/PercentageInput.js";
 import { useForm, FormProvider } from "react-hook-form";
-import * as z from "zod";
-import { iconForm, headerForm, form, descriptionField, headerContainer, fullRowSelect, formWrapper, centerSelect, mt2rem, fullRowForm, disclosureForm, actions, formBtns, na_cursor, formContainer } from "../Forms.css.js";
+import "../../Calculators/BuyDownCalculator/BuyDownCalculator.css.js";
+import { iconForm, headerForm, form, descriptionField, headerContainer, fullRowSelect, centerSelect, formWrapper, mt2rem, fullRowForm, disclosureForm, actions, formBtns, na_cursor, formContainer } from "../Forms.css.js";
+import { honeyPotSchema, isValidHoneyPot, HoneyPot } from "../HoneyPot/index.js";
 import { SalesforceSchema } from "../SalesforceFieldsForm.js";
 import "../../Input/RadioButton.css.js";
 import "../../Input/Checkbox.css.js";
@@ -63,21 +68,26 @@ import "iframe-resizer";
 import "../../Calculators/MonthlyPaymentCalculator/MonthlyPaymentCalculator.css.js";
 import "../../Calculators/MonthlyPaymentLVFCalculator/MonthlyPaymentCalculator.css.js";
 import "../../Calculators/SummitApyCalculator/BalanceAPYCalculator.css.js";
-import "../../Input/PercentageInput.js";
-import "../../Calculators/BuyDownCalculator/BuyDownCalculator.css.js";
 /* empty css                                       */
 import "react-dom";
 /* empty css                                   */
 import "../../Auth/SignInPassword.js";
 /* empty css                                                 */
 /* empty css                                             */
+/* empty css                                       */
 /* empty css                                                       */
 import "../../Carousel/index.js";
+/* empty css                                                      */
+/* empty css                                      */
+import "../../Chatbot/store/chat.js";
+/* empty css                                       */
+/* empty css                                          */
+import "../../Chatbot/store/messages.js";
 /* empty css                                                                       */
 import "../../Comparison/Comparison.css.js";
 import "next/image.js";
-import "../../HeroBanner/HeroBanner.css.js";
 import "../../HeroBanner/LargeBanner.css.js";
+import "../../HeroBanner/HeroBanner.css.js";
 import "../../HeroBanner/SelectionBanner.css.js";
 import "../../SetContainer/SetContainer.css.js";
 import "../../Tab/Tab.css.js";
@@ -97,7 +107,6 @@ import "next/script.js";
 /* empty css                                                 */
 /* empty css                                                         */
 /* empty css                                               */
-/* empty css                                       */
 import "../../LandingPageHeader/LandingPageHeader.css.js";
 /* empty css                                                         */
 import "next/navigation.js";
@@ -140,7 +149,8 @@ const MortgageRate = ({
   rateWatchOnSubmit,
   setRateWatchSubmitted,
   hideModalValue,
-  showingTables
+  showingTables,
+  onValidate
 }) => {
   const [loanPurpose, setLoanPurpose] = useState(1);
   const [rateType, setRateType] = useState("Purchase");
@@ -151,6 +161,7 @@ const MortgageRate = ({
   const [_downPayment, setDownPayment] = useState(0);
   const [isTypingDownPayment, setIsTypingDownPayment] = useState(false);
   const [salesPriceVal, setSalesPriceVal] = useState(0);
+  const cachedEmailValidator = useCachedEmailValidator(validateEmail);
   const schema = z.object({
     firstName: z.string({ message: "First Name is required." }).regex(/^[A-Za-z][^0-9_!¡?÷?¿/\\+=@#$%ˆ&*,.^(){}|~<>;:[\]]{1,}$/g, {
       message: "First Name is required."
@@ -158,7 +169,7 @@ const MortgageRate = ({
     lastName: z.string({ message: "Last Name is required." }).regex(/^[A-Za-z][^0-9_!¡?÷?¿/\\+=@#$%ˆ&*,.^(){}|~<>;:[\]]{1,}$/g, {
       message: "Last Name is required."
     }).trim().min(1, { message: "Last Name is required." }),
-    email: z.string().email({ message: "Email is required." }).refine(async (val) => await validateEmail(val)),
+    email: z.string().email({ message: "Email is required." }).refine(cachedEmailValidator, { message: "Invalid email address." }),
     phone: z.string({ message: "Phone is required." }).regex(/[\d-]{10}/, { message: "Phone is required." }).min(10, { message: "Phone is required." }).max(12, { message: "Phone is required." }).transform((val, ctx) => {
       const removeDashes = val.replace(/-/gi, "");
       if (removeDashes.length !== 10) {
@@ -197,7 +208,7 @@ const MortgageRate = ({
       }
     ),
     creditScore: z.number({ message: "Credit Score is required." }).positive({ message: "Credit Score is required." }),
-    zipCode: z.number({ message: "Zip Code is required." }).positive({ message: "Zip Code is required." }),
+    zipCode: z.string().trim().min(1, { message: "Zip Code is required." }).regex(/^\d{5}$/, { message: "ZIP code must be 5 digits." }),
     appraisedValue: z.number({ message: "Home Price is required." }).optional().refine(
       (val) => {
         if (loanPurpose === 2 && val == null) {
@@ -205,7 +216,7 @@ const MortgageRate = ({
         }
         return true;
       },
-      { message: "Appraised Value is required for refinance" }
+      { message: "Appraised Value is required for refinance." }
     ),
     mortgageBalance: z.number({ message: "Mortgage Balance is required." }).optional().refine(
       (val) => {
@@ -214,30 +225,50 @@ const MortgageRate = ({
         }
         return true;
       },
-      { message: "Mortgage Balance is required for refinance" }
+      { message: "Mortgage Balance is required for refinance." }
     ),
     cashOut: z.number({ message: "Cash Out is required." }).optional(),
     loanPurpose: z.number({ message: "Loan Purpose is required." })
   });
+  const gen_schema = schema.merge(SalesforceSchema).merge(honeyPotSchema).superRefine((data, ctx) => {
+    if (!isValidHoneyPot(data)) {
+      ctx.addIssue({
+        code: z.ZodIssueCode.custom,
+        message: "fields are not valid."
+      });
+    }
+  });
   const methods = useForm({
-    resolver: zodResolver(schema.merge(SalesforceSchema), {
+    resolver: zodResolver(gen_schema, {
       async: true
     }),
     mode: "all",
     defaultValues: {
-      loanPurpose: 1
+      loanPurpose: 1,
+      AlternativeEmail: "bestbank@axos.com",
+      AlternativePhone: ""
     }
   });
+  const setHoneypotDefaults = () => {
+    const { AlternativeEmail, AlternativePhone } = methods.getValues();
+    methods.setValue(
+      "AlternativeEmail",
+      AlternativeEmail || "bestbank@axos.com"
+    );
+    methods.setValue("AlternativePhone", AlternativePhone || "");
+  };
   useEffect(() => {
     if (loanPurpose === 1) {
       methods.reset();
       methods.setValue("appraisedValue", 0);
       methods.setValue("mortgageBalance", 0);
+      setHoneypotDefaults();
     } else if (loanPurpose === 2) {
       methods.reset();
       methods.setValue("loanPurpose", 2);
       methods.setValue("salesPrice", 0);
       methods.setValue("downPayment", 0);
+      setHoneypotDefaults();
     }
   }, [loanPurpose, methods]);
   useEffect(() => {
@@ -410,361 +441,379 @@ const MortgageRate = ({
               children: "Tell us about your property and loan to personalize your rate."
             }
           ) }),
-          /* @__PURE__ */ jsxs("form", { className: form, onSubmit: handleSubmit(submitForm), children: [
-            /* @__PURE__ */ jsxs("div", { className: clsx(formWrapper({ variant })), children: [
-              /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsxs(
-                Dropdown,
-                {
-                  id: "propertyType",
-                  ...register("propertyType", {
-                    required: true,
-                    setValueAs: (value) => Number(value)
-                  }),
-                  label: "Property Type",
-                  sizes: "medium",
-                  required: true,
-                  error: !!errors.propertyType,
-                  helperText: errors.propertyType?.message,
-                  variant,
-                  defaultValue: "Select option",
-                  children: [
-                    /* @__PURE__ */ jsx("option", { disabled: true, value: "Select option", children: "Select Option" }),
-                    /* @__PURE__ */ jsx("option", { value: "1", children: "Single Family Home" }),
-                    /* @__PURE__ */ jsx("option", { value: "3", children: "Condo" }),
-                    /* @__PURE__ */ jsx("option", { value: "5", children: "Hi-Rise Condo" }),
-                    /* @__PURE__ */ jsx("option", { value: "2", children: "Co-op" }),
-                    /* @__PURE__ */ jsx("option", { value: "4", children: "2-4 Unit" }),
-                    /* @__PURE__ */ jsx("option", { value: "6", children: "Manufactured" })
-                  ]
-                }
-              ) }),
-              /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsxs(
-                Dropdown,
-                {
-                  id: "occupancy",
-                  ...register("occupancy", {
-                    required: true,
-                    setValueAs: (value) => Number(value)
-                  }),
-                  label: "Property Usage",
-                  sizes: "medium",
-                  required: true,
-                  error: !!errors.occupancy,
-                  helperText: errors.occupancy?.message,
-                  variant,
-                  defaultValue: "Select option",
-                  children: [
-                    /* @__PURE__ */ jsx("option", { disabled: true, value: "Select option", children: "Select Option" }),
-                    /* @__PURE__ */ jsx("option", { value: "1", children: "Primary Residence" }),
-                    /* @__PURE__ */ jsx("option", { value: "2", children: "Vacation Home" }),
-                    /* @__PURE__ */ jsx("option", { value: "3", children: "Investment" })
-                  ]
-                }
-              ) }),
-              loanPurpose === 1 && /* @__PURE__ */ jsxs(Fragment, { children: [
-                /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
-                  Input,
-                  {
-                    id: "salesPrice",
-                    type: "text",
-                    ...register("salesPrice", {
+          /* @__PURE__ */ jsxs(
+            "form",
+            {
+              className: form,
+              onSubmit: async (e) => {
+                onValidate && onValidate(e);
+                await handleSubmit(submitForm)(e);
+                e.preventDefault();
+              },
+              children: [
+                /* @__PURE__ */ jsxs("div", { className: clsx(formWrapper({ variant })), children: [
+                  /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsxs(
+                    Dropdown,
+                    {
+                      id: "propertyType",
+                      ...register("propertyType", {
+                        required: true,
+                        setValueAs: (value) => Number(value)
+                      }),
+                      label: "Property Type",
+                      sizes: "medium",
                       required: true,
-                      setValueAs: (value) => parseCurrency(value)
-                    }),
-                    label: "Purchase Price",
-                    sizes: "medium",
-                    required: true,
-                    error: !!errors.salesPrice,
-                    helperText: errors.salesPrice?.message,
-                    variant,
-                    onBlur: (e) => {
-                      setIsTypingDownPayment(false);
-                      const rawValue = e.target.value;
-                      const parsedValue = parseCurrency(rawValue);
-                      if (parsedValue === 0) {
-                        methods.setError("salesPrice", {
-                          type: "manual",
-                          message: "Purchase Price is required."
-                        });
-                      } else {
-                        methods.setValue("salesPrice", parsedValue);
+                      error: !!errors.propertyType,
+                      helperText: errors.propertyType?.message,
+                      variant,
+                      defaultValue: "Select option",
+                      children: [
+                        /* @__PURE__ */ jsx("option", { disabled: true, value: "Select option", children: "Select Option" }),
+                        /* @__PURE__ */ jsx("option", { value: "1", children: "Single Family Home" }),
+                        /* @__PURE__ */ jsx("option", { value: "3", children: "Condo" }),
+                        /* @__PURE__ */ jsx("option", { value: "5", children: "Hi-Rise Condo" }),
+                        /* @__PURE__ */ jsx("option", { value: "2", children: "Co-op" }),
+                        /* @__PURE__ */ jsx("option", { value: "4", children: "2-4 Unit" }),
+                        /* @__PURE__ */ jsx("option", { value: "6", children: "Manufactured" })
+                      ]
+                    }
+                  ) }),
+                  /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsxs(
+                    Dropdown,
+                    {
+                      id: "occupancy",
+                      ...register("occupancy", {
+                        required: true,
+                        setValueAs: (value) => Number(value)
+                      }),
+                      label: "Property Usage",
+                      sizes: "medium",
+                      required: true,
+                      error: !!errors.occupancy,
+                      helperText: errors.occupancy?.message,
+                      variant,
+                      defaultValue: "Select option",
+                      children: [
+                        /* @__PURE__ */ jsx("option", { disabled: true, value: "Select option", children: "Select Option" }),
+                        /* @__PURE__ */ jsx("option", { value: "1", children: "Primary Residence" }),
+                        /* @__PURE__ */ jsx("option", { value: "2", children: "Vacation Home" }),
+                        /* @__PURE__ */ jsx("option", { value: "3", children: "Investment" })
+                      ]
+                    }
+                  ) }),
+                  loanPurpose === 1 && /* @__PURE__ */ jsxs(Fragment, { children: [
+                    /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
+                      Input,
+                      {
+                        id: "salesPrice",
+                        type: "text",
+                        ...register("salesPrice", {
+                          required: true,
+                          setValueAs: (value) => parseCurrency(value)
+                        }),
+                        label: "Purchase Price",
+                        sizes: "medium",
+                        required: true,
+                        error: !!errors.salesPrice,
+                        helperText: errors.salesPrice?.message,
+                        variant,
+                        onBlur: (e) => {
+                          setIsTypingDownPayment(false);
+                          const rawValue = e.target.value;
+                          const parsedValue = parseCurrency(rawValue);
+                          if (parsedValue === 0) {
+                            methods.setError("salesPrice", {
+                              type: "manual",
+                              message: "Purchase Price is required."
+                            });
+                          } else {
+                            methods.setValue("salesPrice", parsedValue);
+                            e.target.value = formatCurrency(parsedValue);
+                          }
+                          methods.trigger("downPayment");
+                        },
+                        onFocus: (e) => {
+                          const currentValue = e.target.value;
+                          e.target.value = currentValue.replace(/[$,]/g, "");
+                        }
+                      }
+                    ) }),
+                    /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
+                      DownPaymentInput,
+                      {
+                        id: "downPayment",
+                        type: "text",
+                        ...register("downPayment", {
+                          required: true,
+                          setValueAs: (value) => parseCurrency(value)
+                        }),
+                        salesPrice: watch("salesPrice"),
+                        downPaymentPercentage,
+                        setDownPaymentPercentage,
+                        label: "Down Payment",
+                        sizes: "medium",
+                        error: !!errors.downPayment,
+                        helperText: errors.downPayment?.message,
+                        onChange: (e) => {
+                          const value = parseCurrency(e.target.value);
+                          methods.setValue("downPayment", value);
+                        },
+                        variant,
+                        isTypingDownPayment,
+                        setIsTypingDownPayment,
+                        methods
+                      }
+                    ) })
+                  ] }),
+                  loanPurpose === 2 && /* @__PURE__ */ jsxs(Fragment, { children: [
+                    /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
+                      Input,
+                      {
+                        id: "appraisedValue",
+                        type: "text",
+                        ...register("appraisedValue", {
+                          required: true,
+                          setValueAs: (value) => parseCurrency(value)
+                        }),
+                        label: "Home Value",
+                        sizes: "medium",
+                        required: true,
+                        error: !!errors.appraisedValue,
+                        helperText: errors.appraisedValue?.message,
+                        variant,
+                        onBlur: (e) => {
+                          const rawValue = e.target.value;
+                          const parsedValue = parseCurrency(rawValue);
+                          methods.setValue("appraisedValue", parsedValue);
+                          e.target.value = formatCurrency(parsedValue);
+                        },
+                        onFocus: (e) => {
+                          const currentValue = e.target.value;
+                          e.target.value = currentValue.replace(/[$,]/g, "");
+                        }
+                      }
+                    ) }),
+                    /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
+                      Input,
+                      {
+                        id: "mortgageBalance",
+                        type: "text",
+                        ...register("mortgageBalance", {
+                          required: true,
+                          setValueAs: (value) => parseCurrency(value)
+                        }),
+                        label: "Mortgage Balance",
+                        sizes: "medium",
+                        required: true,
+                        error: !!errors.mortgageBalance,
+                        helperText: errors.mortgageBalance?.message,
+                        variant,
+                        onBlur: (e) => {
+                          const rawValue = e.target.value;
+                          const parsedValue = parseCurrency(rawValue);
+                          methods.setValue("mortgageBalance", parsedValue);
+                          e.target.value = formatCurrency(parsedValue);
+                        },
+                        onFocus: (e) => {
+                          const currentValue = e.target.value;
+                          e.target.value = currentValue.replace(/[$,]/g, "");
+                        }
+                      }
+                    ) })
+                  ] }),
+                  /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsxs(
+                    Dropdown,
+                    {
+                      id: "creditScore",
+                      ...register("creditScore", {
+                        required: true,
+                        setValueAs: (value) => value === "" ? void 0 : Number(value)
+                      }),
+                      label: "Credit Score",
+                      sizes: "medium",
+                      required: true,
+                      error: !!errors.creditScore,
+                      helperText: errors.creditScore?.message,
+                      variant,
+                      defaultValue: "Select option",
+                      children: [
+                        /* @__PURE__ */ jsx("option", { disabled: true, value: "Select option", children: "Select Option" }),
+                        /* @__PURE__ */ jsx("option", { value: "740", children: "740+" }),
+                        /* @__PURE__ */ jsx("option", { value: "720", children: "739-720" }),
+                        /* @__PURE__ */ jsx("option", { value: "700", children: "719-700" }),
+                        /* @__PURE__ */ jsx("option", { value: "680", children: "699-680" }),
+                        /* @__PURE__ */ jsx("option", { value: "660", children: "679-660" }),
+                        /* @__PURE__ */ jsx("option", { value: "640", children: "659-640" }),
+                        /* @__PURE__ */ jsx("option", { value: "620", children: "639-620" }),
+                        /* @__PURE__ */ jsx("option", { value: "600", children: "Below 620" })
+                      ]
+                    }
+                  ) }),
+                  /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
+                    Input,
+                    {
+                      id: "zipCode",
+                      type: "text",
+                      inputMode: "numeric",
+                      ...register("zipCode", {
+                        required: true,
+                        pattern: /^\d{5}$/
+                      }),
+                      label: "Zip Code",
+                      sizes: "medium",
+                      required: true,
+                      error: !!errors.zipCode,
+                      helperText: errors.zipCode?.message,
+                      variant,
+                      maxLength: 5,
+                      onInput: (e) => {
+                        const target = e.target;
+                        target.value = target.value.replace(/\D/g, "");
+                      }
+                    }
+                  ) }),
+                  loanPurpose === 2 ? /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx("div", { className: fullRowForm, children: /* @__PURE__ */ jsx(
+                    Input,
+                    {
+                      id: "cashOut",
+                      type: "text",
+                      ...register("cashOut", {
+                        required: true,
+                        setValueAs: (value) => parseCurrency(value)
+                      }),
+                      label: "Cash Out (Optional)",
+                      sizes: "medium",
+                      error: !!errors.cashOut,
+                      helperText: errors.cashOut?.message,
+                      variant,
+                      onBlur: (e) => {
+                        const rawValue = e.target.value;
+                        const parsedValue = parseCurrency(rawValue);
+                        methods.setValue("cashOut", parsedValue);
                         e.target.value = formatCurrency(parsedValue);
+                      },
+                      onFocus: (e) => {
+                        const currentValue = e.target.value;
+                        e.target.value = currentValue.replace(/[$,]/g, "");
                       }
-                      methods.trigger("downPayment");
-                    },
-                    onFocus: (e) => {
-                      const currentValue = e.target.value;
-                      e.target.value = currentValue.replace(/[$,]/g, "");
                     }
-                  }
-                ) }),
-                /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
-                  DownPaymentInput,
-                  {
-                    id: "downPayment",
-                    type: "text",
-                    ...register("downPayment", {
+                  ) }) }) : null,
+                  /* @__PURE__ */ jsx("div", { className: clsx(fullRowForm, "text_center"), children: /* @__PURE__ */ jsx(
+                    "div",
+                    {
+                      className: clsx(
+                        descriptionField({ variant }),
+                        "text_center"
+                      ),
+                      children: "Almost there! Please provide your contact information to view rates and sign up for Rate Watch."
+                    }
+                  ) }),
+                  /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
+                    Input,
+                    {
+                      id: "firstName",
+                      ...register("firstName", {
+                        required: "First Name is required"
+                      }),
+                      label: "First Name",
+                      sizes: "medium",
                       required: true,
-                      setValueAs: (value) => parseCurrency(value)
-                    }),
-                    salesPrice: watch("salesPrice"),
-                    downPaymentPercentage,
-                    setDownPaymentPercentage,
-                    label: "Down Payment",
-                    sizes: "medium",
-                    error: !!errors.downPayment,
-                    helperText: errors.downPayment?.message,
-                    onChange: (e) => {
-                      const value = parseCurrency(e.target.value);
-                      methods.setValue("downPayment", value);
-                    },
-                    variant,
-                    isTypingDownPayment,
-                    setIsTypingDownPayment,
-                    methods
-                  }
-                ) })
-              ] }),
-              loanPurpose === 2 && /* @__PURE__ */ jsxs(Fragment, { children: [
-                /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
-                  Input,
-                  {
-                    id: "appraisedValue",
-                    type: "text",
-                    ...register("appraisedValue", {
+                      error: !!errors.firstName,
+                      helperText: errors.firstName?.message,
+                      variant
+                    }
+                  ) }),
+                  /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
+                    Input,
+                    {
+                      id: "lastName",
+                      ...register("lastName", { required: true }),
+                      label: "Last Name",
+                      sizes: "medium",
                       required: true,
-                      setValueAs: (value) => parseCurrency(value)
-                    }),
-                    label: "Home Value",
-                    sizes: "medium",
-                    required: true,
-                    error: !!errors.appraisedValue,
-                    helperText: errors.appraisedValue?.message,
-                    variant,
-                    onBlur: (e) => {
-                      const rawValue = e.target.value;
-                      const parsedValue = parseCurrency(rawValue);
-                      methods.setValue("appraisedValue", parsedValue);
-                      e.target.value = formatCurrency(parsedValue);
-                    },
-                    onFocus: (e) => {
-                      const currentValue = e.target.value;
-                      e.target.value = currentValue.replace(/[$,]/g, "");
+                      error: !!errors.lastName,
+                      helperText: errors.lastName?.message,
+                      variant
                     }
-                  }
-                ) }),
-                /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
-                  Input,
-                  {
-                    id: "mortgageBalance",
-                    type: "text",
-                    ...register("mortgageBalance", {
+                  ) }),
+                  /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
+                    Input,
+                    {
+                      id: "email",
+                      ...register("email", {
+                        required: true,
+                        validate: {
+                          isValid: associatedEmail
+                        }
+                      }),
+                      label: "Email",
+                      sizes: "medium",
                       required: true,
-                      setValueAs: (value) => parseCurrency(value)
-                    }),
-                    label: "Mortgage Balance",
-                    sizes: "medium",
-                    required: true,
-                    error: !!errors.mortgageBalance,
-                    helperText: errors.mortgageBalance?.message,
-                    variant,
-                    onBlur: (e) => {
-                      const rawValue = e.target.value;
-                      const parsedValue = parseCurrency(rawValue);
-                      methods.setValue("mortgageBalance", parsedValue);
-                      e.target.value = formatCurrency(parsedValue);
-                    },
-                    onFocus: (e) => {
-                      const currentValue = e.target.value;
-                      e.target.value = currentValue.replace(/[$,]/g, "");
+                      error: !!errors.email,
+                      helperText: errors.email?.message,
+                      variant
                     }
-                  }
-                ) })
-              ] }),
-              /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsxs(
-                Dropdown,
-                {
-                  id: "creditScore",
-                  ...register("creditScore", {
-                    required: true,
-                    setValueAs: (value) => value === "" ? void 0 : Number(value)
-                  }),
-                  label: "Credit Score",
-                  sizes: "medium",
-                  required: true,
-                  error: !!errors.creditScore,
-                  helperText: errors.creditScore?.message,
-                  variant,
-                  defaultValue: "Select option",
-                  children: [
-                    /* @__PURE__ */ jsx("option", { disabled: true, value: "Select option", children: "Select Option" }),
-                    /* @__PURE__ */ jsx("option", { value: "740", children: "740+" }),
-                    /* @__PURE__ */ jsx("option", { value: "720", children: "739-720" }),
-                    /* @__PURE__ */ jsx("option", { value: "700", children: "719-700" }),
-                    /* @__PURE__ */ jsx("option", { value: "680", children: "699-680" }),
-                    /* @__PURE__ */ jsx("option", { value: "660", children: "679-660" }),
-                    /* @__PURE__ */ jsx("option", { value: "640", children: "659-640" }),
-                    /* @__PURE__ */ jsx("option", { value: "620", children: "639-620" }),
-                    /* @__PURE__ */ jsx("option", { value: "600", children: "Below 620" })
-                  ]
-                }
-              ) }),
-              /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
-                Input,
-                {
-                  id: "zipCode",
-                  type: "number",
-                  ...register("zipCode", {
-                    required: true,
-                    setValueAs: (value) => Number(value)
-                  }),
-                  label: "Zip Code",
-                  sizes: "medium",
-                  required: true,
-                  error: !!errors.zipCode,
-                  helperText: errors.zipCode?.message,
-                  variant
-                }
-              ) }),
-              loanPurpose === 2 ? /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx("div", { className: fullRowForm, children: /* @__PURE__ */ jsx(
-                Input,
-                {
-                  id: "cashOut",
-                  type: "text",
-                  ...register("cashOut", {
-                    required: true,
-                    setValueAs: (value) => parseCurrency(value)
-                  }),
-                  label: "Cash Out (Optional)",
-                  sizes: "medium",
-                  error: !!errors.cashOut,
-                  helperText: errors.cashOut?.message,
-                  variant,
-                  onBlur: (e) => {
-                    const rawValue = e.target.value;
-                    const parsedValue = parseCurrency(rawValue);
-                    methods.setValue("cashOut", parsedValue);
-                    e.target.value = formatCurrency(parsedValue);
-                  },
-                  onFocus: (e) => {
-                    const currentValue = e.target.value;
-                    e.target.value = currentValue.replace(/[$,]/g, "");
-                  }
-                }
-              ) }) }) : null,
-              /* @__PURE__ */ jsx("div", { className: clsx(fullRowForm, "text_center"), children: /* @__PURE__ */ jsx(
-                "div",
-                {
-                  className: clsx(
-                    descriptionField({ variant }),
-                    "text_center"
-                  ),
-                  children: "Almost there! Please provide your contact information to view rates and sign up for Rate Watch."
-                }
-              ) }),
-              /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
-                Input,
-                {
-                  id: "firstName",
-                  ...register("firstName", {
-                    required: "First Name is required"
-                  }),
-                  label: "First Name",
-                  sizes: "medium",
-                  required: true,
-                  error: !!errors.firstName,
-                  helperText: errors.firstName?.message,
-                  variant
-                }
-              ) }),
-              /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
-                Input,
-                {
-                  id: "lastName",
-                  ...register("lastName", { required: true }),
-                  label: "Last Name",
-                  sizes: "medium",
-                  required: true,
-                  error: !!errors.lastName,
-                  helperText: errors.lastName?.message,
-                  variant
-                }
-              ) }),
-              /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
-                Input,
-                {
-                  id: "email",
-                  ...register("email", {
-                    required: true,
-                    validate: {
-                      isValid: associatedEmail
+                  ) }),
+                  /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
+                    InputPhone,
+                    {
+                      id: "phone",
+                      ...register("phone", { required: true, maxLength: 12 }),
+                      label: "Phone Number",
+                      sizes: "medium",
+                      required: true,
+                      error: !!errors.phone,
+                      helperText: errors.phone?.message,
+                      variant
                     }
-                  }),
-                  label: "Email",
-                  sizes: "medium",
-                  required: true,
-                  error: !!errors.email,
-                  helperText: errors.email?.message,
-                  variant
-                }
-              ) }),
-              /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
-                InputPhone,
-                {
-                  id: "phone",
-                  ...register("phone", { required: true, maxLength: 12 }),
-                  label: "Phone Number",
-                  sizes: "medium",
-                  required: true,
-                  error: !!errors.phone,
-                  helperText: errors.phone?.message,
-                  variant
-                }
-              ) })
-            ] }),
-            children,
-            /* @__PURE__ */ jsx("div", { className: disclosureForm({ variant }), children: disclosure }),
-            /* @__PURE__ */ jsx("div", { className: actions, children: isSubmitting ? /* @__PURE__ */ jsx(
-              LoadingIndicator,
-              {
-                style: { marginInline: "auto" },
-                variant
-              }
-            ) : /* @__PURE__ */ jsxs("div", { className: formBtns, children: [
-              /* @__PURE__ */ jsx(
-                "button",
-                {
-                  type: "submit",
-                  disabled: !isValid,
-                  className: button({
-                    color: "secondary",
-                    size: "large",
-                    rounded: "medium",
-                    disabled: !isValid
-                  }),
-                  children: "Get My Rate"
-                }
-              ),
-              /* @__PURE__ */ jsxs("span", { className: `sc__btn ${chevron_wrapper}`, children: [
-                /* @__PURE__ */ jsx(
-                  "a",
+                  ) }),
+                  /* @__PURE__ */ jsx(HoneyPot, { variant, register })
+                ] }),
+                children,
+                /* @__PURE__ */ jsx("div", { className: disclosureForm({ variant }), children: disclosure }),
+                /* @__PURE__ */ jsx("div", { className: actions, children: isSubmitting ? /* @__PURE__ */ jsx(
+                  LoadingIndicator,
                   {
-                    id,
-                    className: `${chevron({ variant })} ${!isValid ? na_cursor : ""}`,
-                    onClick: isValid ? handleSubmit(async (data) => {
-                      await onSubmit(data);
-                      toggleModal();
-                      setHideModal(false);
-                    }) : (e) => {
-                      e.preventDefault();
-                    },
-                    children: "Sign Up For Ratewatch"
+                    style: { marginInline: "auto" },
+                    variant
                   }
-                ),
-                /* @__PURE__ */ jsx(SvgArrowIcon, { className: "arrow", variant: "tertiary" })
-              ] })
-            ] }) })
-          ] })
+                ) : /* @__PURE__ */ jsxs("div", { className: formBtns, children: [
+                  /* @__PURE__ */ jsx(
+                    "button",
+                    {
+                      type: "submit",
+                      disabled: !isValid,
+                      className: button({
+                        color: "secondary",
+                        size: "large",
+                        rounded: "medium",
+                        disabled: !isValid
+                      }),
+                      children: "Get My Rate"
+                    }
+                  ),
+                  /* @__PURE__ */ jsxs("span", { className: `sc__btn ${chevron_wrapper}`, children: [
+                    /* @__PURE__ */ jsx(
+                      "a",
+                      {
+                        id,
+                        className: `${chevron({ variant })} ${!isValid ? na_cursor : ""}`,
+                        onClick: isValid ? handleSubmit(async (data) => {
+                          await onSubmit(data);
+                          toggleModal();
+                          setHideModal(false);
+                        }) : (e) => {
+                          e.preventDefault();
+                        },
+                        children: "Sign Up For Ratewatch"
+                      }
+                    ),
+                    /* @__PURE__ */ jsx(SvgArrowIcon, { className: "arrow", variant: "tertiary" })
+                  ] })
+                ] }) })
+              ]
+            }
+          )
         ] }) })
       },
       id