@axos-web-dev/shared-components 2.0.0-dev.33 → 2.0.0-dev.37

package/dist/Forms/MortgageRate/MortgageRateWatch.js

@@ -24,7 +24,7 @@ import { checkbox } from "../../Input/Checkbox.css.js";
 import "../../IconBillboard/IconBillboard.css.js";
 import "../../icons/ArrowIcon/ArrowIcon.css.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/NavBar2.css';import '../../assets/NavigationMenu/AxosALTS/NavBar2.css';import '../../assets/NavigationMenu/AxosClearing/NavBar2.css';import '../../assets/NavigationMenu/AxosBank/SubNavbar.css';import '../../assets/NavigationMenu/ServerNavigation/NavigationBar.css';import '../../assets/NavigationMenu/AxosAdvisorServices/SubNavbar.css';import '../../assets/NavigationMenu/AxosAdvisorServices/NavBar2.css';import '../../assets/NavigationMenu/AxosAdvisor/SubNavbar.css';import '../../assets/NavigationMenu/AxosAdvisor/NavBar2.css';import '../../assets/NavigationMenu/AxosBank/NavBar2.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/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/Forms/QuickPricer/QuickPricerResults.css';import '../../assets/Modal/Modal.css';import '../../assets/Forms/HoneyPot/HoneyPot.css';import '../../assets/ImageToast/ImageToast.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                                   */
+import '../../assets/Modal/Modal.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                                       */
@@ -32,107 +32,13 @@ import '../../assets/VideoWrapper/VideoWrapper.css';import '../../assets/Topical
 /* empty css                                                   */
 /* empty css                                             */
 /* empty css                                             */
-import "../../Accordion/Accordion.js";
-import "../../Accordion/Accordion.css.js";
-import "../../AlertBanner/AlertBanner.css.js";
-import "../../Article/Article.css.js";
-import "../../ArticlesSet/ArticlesSet.css.js";
-import "../../Calculators/calculator.css.js";
-import "../../Calculators/AnnualFeeCalculator/AnnualFeeCalculator.css.js";
-import "../../Modal/contextApi/store.js";
-import "next/image.js";
-import { button } from "../../Button/Button.css.js";
-import "../../Calculators/ApyCalculator/ApyCalculator.css.js";
-import "../../Calculators/ApyCalculatorUserTest/ApyCalculatorUserTest.css.js";
-import "../../HeroBanner/LargeBanner.css.js";
-import "../../HeroBanner/HeroBanner.css.js";
-import "../../HeroBanner/SelectionBanner.css.js";
-/* empty css                                             */
-import "../../SetContainer/SetContainer.css.js";
-import "../../Table/Table.css.js";
-import "../../Calculators/AxosOneCalculator/BalanceAPYCalculator.css.js";
-import "../../Calculators/BalanceAPYCalculator/BalanceAPYCalculator.css.js";
-import "../../Input/PercentageInput.js";
-import "../../Calculators/BuyDownCalculator/BuyDownCalculator.css.js";
-/* empty css                                      */
-import "../HoneyPot/honeyPotValidation.js";
-import "../SalesforceFieldsForm.js";
-import "react-use";
 import "../../Chevron/Chevron.css.js";
 /* empty css                                   */
+import "../../Modal/contextApi/store.js";
 import "../../Interstitial/Interstitial-variants.css.js";
-/* empty css                                                   */
-import "../../Hyperlink/Hyperlink.css.js";
-/* empty css                                                */
+import { button } from "../../Button/Button.css.js";
+import "react-use";
 import { SuccesFormWrapper } from "../SuccesForm.js";
-import "iframe-resizer";
-/* empty css                                                                                   */
-import "../../Calculators/MonthlyPaymentCalculator/MonthlyPaymentCalculator.css.js";
-import "../../Calculators/MonthlyPaymentLVFCalculator/MonthlyPaymentCalculator.css.js";
-import "../../Calculators/SummitApyCalculator/BalanceAPYCalculator.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";
-import "../../Chatbot/Chatbot.js";
-import "../../Chatbot/Chatbot.css.ts.vanilla.css.js";
-/* empty css                                          */
-import "../../Chatbot/store/messages.js";
-/* empty css                                                                       */
-import "../../Comparison/Comparison.css.js";
-import "../../Tab/Tab.css.js";
-import "../../icons/Star/Star.css.js";
-import "../../ContentBanner/ContentBanner.css.js";
-/* empty css                                                 */
-import "../../ExecutiveBio/ExecutiveBio.css.js";
-import "../../FaqAccordion/index.js";
-import "../../FooterDisclosure/FooterDisclosure.css.js";
-/* empty css                                                             */
-/* empty css                                                            */
-/* empty css                                               */
-import "../../ImageBillboard/ImageBillboard.css.js";
-import "next/script.js";
-/* empty css                                           */
-/* empty css                                           */
-/* empty css                                                 */
-/* empty css                                                         */
-/* empty css                                               */
-import "../../LandingPageHeader/LandingPageHeader.css.js";
-import "next/link.js";
-/* empty css                                                      */
-/* empty css                                                         */
-import "next/navigation.js";
-/* empty css                                                            */
-/* empty css                                                                 */
-/* empty css                                                                    */
-/* empty css                                                                     */
-import "../../NavigationMenu/ServerNavigation/Menu.js";
-import "../../NavigationMenu/ServerNavigation/SubNavbar.css.js";
-/* empty css                                                         */
-/* empty css                                                          */
-/* empty css                                                      */
-/* empty css                                                        */
-import "../../PageNavItem/PageNavItem.css.js";
-import "react-slick";
-/* empty css                                                    */
-/* empty css                                             */
-/* empty css                                                       */
-/* empty css                                                     */
-import "../../StepItem/StepItem.css.js";
-import "../../StepItemSet/StepItemSet.css.js";
-/* empty css                                           */
-/* empty css                                   */
-/* empty css                                                     */
-/* empty css                                                   */
-/* empty css                                                 */
 const RateWatchForm = ({
   email,
   lastName,
@@ -140,12 +46,34 @@ const RateWatchForm = ({
   toggleModal,
   setRateWatchSubmitted
 }) => {
+  const desiredRateFields = [
+    "tR1DesiredRate",
+    "tR2DesiredRate",
+    "tR3DesiredRate"
+  ];
+  const sanitizeDesiredRate = (value) => {
+    if (!value) return "";
+    const normalizedValue = value.replace(/[^\d.]/g, "");
+    if (!normalizedValue || normalizedValue === ".") return "";
+    const [wholePart, decimalPart = ""] = normalizedValue.split(".");
+    const trimmedDecimal = decimalPart.slice(0, 4);
+    const formattedValue = trimmedDecimal ? `${wholePart || "0"}.${trimmedDecimal}` : wholePart || "0";
+    const numericValue = Number(formattedValue);
+    if (!Number.isFinite(numericValue)) return "";
+    return Number.isInteger(numericValue) ? String(numericValue) : numericValue.toFixed(4).replace(/\.0+$|(?<=\.\d*)(0+)$/, "").replace(/\.$/, "");
+  };
+  const isDesiredRateOutOfRange = (value) => {
+    if (!value) return false;
+    const numericValue = Number(value);
+    if (!Number.isFinite(numericValue)) return false;
+    return numericValue < 2 || numericValue > 10;
+  };
   const [updateType, setUpdateType] = useState(
     "Target Rate"
   );
   const schema = z.object({
     updateType: z.string().min(1, { message: "Update type is required." }),
-    updateCadence: z.string().refine((val) => !(updateType === "Frequency" && !val), {
+    updateCadence: z.string().optional().refine((val) => !(updateType === "Frequency" && !val), {
       message: "Frequency is required."
     }),
     loanTerms: z.string().optional().refine((val) => !(updateType === "Frequency" && !val), {
@@ -154,11 +82,13 @@ const RateWatchForm = ({
     hasSmsConsent: z.boolean().refine((val) => val === true, {
       message: "You must agree to receive SMS messages."
     }),
-    tR1DesiredRate: z.string().optional().refine(
+    tR1DesiredRate: z.string().optional().refine((val) => updateType === "Target Rate" ? !!val : true, {
+      message: "Desired Rate is required."
+    }).refine(
       (val) => {
         if (val && updateType === "Target Rate") {
           const numericValue = +val;
-          return !val || numericValue >= 2 && numericValue <= 10;
+          return numericValue >= 2 && numericValue <= 10;
         }
         return true;
       },
@@ -197,15 +127,21 @@ const RateWatchForm = ({
     email: z.string()
   });
   const methods = useForm({
-    resolver: zodResolver(schema)
+    resolver: zodResolver(schema),
+    mode: "onChange"
   });
   const {
     handleSubmit,
     register,
     formState: { errors, isSubmitting, isValid },
     setValue,
-    clearErrors
+    clearErrors,
+    watch
   } = methods;
+  const watchedDesiredRates = watch(desiredRateFields);
+  const hasDesiredRateWarning = desiredRateFields.some(
+    (_, index) => isDesiredRateOutOfRange(watchedDesiredRates[index])
+  );
   const submitForm = async (data) => {
     const processedData = {
       ...data,
@@ -244,12 +180,22 @@ const RateWatchForm = ({
   const handleTypeChange = (event) => {
     const value = event.target.value;
     setUpdateType(value);
+    methods.setValue("updateType", value, { shouldValidate: true });
+  };
+  const handleDesiredRateChange = (fieldName) => (event) => {
+    const sanitizedValue = sanitizeDesiredRate(event.target.value);
+    event.target.value = sanitizedValue;
+    setValue(fieldName, sanitizedValue, {
+      shouldValidate: true,
+      shouldDirty: true,
+      shouldTouch: true
+    });
   };
   const handleSubmitClick = () => {
     handleSubmit(submitForm)();
   };
   useEffect(() => {
-    methods.reset();
+    methods.reset({ updateType });
   }, [updateType]);
   return /* @__PURE__ */ jsx("section", { className: "rate-watch-form", children: /* @__PURE__ */ jsx(FormProvider, { ...methods, children: /* @__PURE__ */ jsx(
     SuccesFormWrapper,
@@ -327,7 +273,7 @@ const RateWatchForm = ({
           /* @__PURE__ */ jsx("p", { className: mt1Rem, children: "You can establish up to three different targets with one rate watch." }),
           /* @__PURE__ */ jsxs("div", { className: threeColRow, children: [
             /* @__PURE__ */ jsxs("div", { children: [
-              /* @__PURE__ */ jsx("label", { className: resposiveLabel, children: "Select a Loan Type*" }),
+              /* @__PURE__ */ jsx("label", { className: resposiveLabel, children: "Select a Loan Type" }),
               /* @__PURE__ */ jsxs(
                 Dropdown,
                 {
@@ -346,18 +292,24 @@ const RateWatchForm = ({
               )
             ] }),
             /* @__PURE__ */ jsxs("div", { children: [
-              /* @__PURE__ */ jsx("label", { className: resposiveLabel, children: "Desired Rate" }),
+              /* @__PURE__ */ jsxs("label", { className: resposiveLabel, children: [
+                "Desired Rate",
+                /* @__PURE__ */ jsx("sup", { children: "*" })
+              ] }),
               /* @__PURE__ */ jsx(
                 Input,
                 {
                   className: dynPH,
                   ...register("tR1DesiredRate", {
-                    setValueAs: (value) => value ? `${value}` : ""
+                    setValueAs: (value) => sanitizeDesiredRate(String(value ?? ""))
                   }),
+                  onChange: handleDesiredRateChange("tR1DesiredRate"),
                   type: "number",
+                  min: "2",
+                  max: "10",
                   placeholder: "Desired Rate",
                   error: !!errors.tR1DesiredRate,
-                  helperText: errors.tR1DesiredRate?.message
+                  helperText: isDesiredRateOutOfRange(watch("tR1DesiredRate")) ? "Desired Rate must be between 2 and 10." : errors.tR1DesiredRate?.message
                 }
               )
             ] }),
@@ -408,9 +360,16 @@ const RateWatchForm = ({
               Input,
               {
                 className: dynPH,
-                ...register("tR2DesiredRate"),
-                type: "string",
-                placeholder: "Desired Rate"
+                ...register("tR2DesiredRate", {
+                  setValueAs: (value) => sanitizeDesiredRate(String(value ?? ""))
+                }),
+                onChange: handleDesiredRateChange("tR2DesiredRate"),
+                type: "number",
+                min: "2",
+                max: "10",
+                placeholder: "Desired Rate",
+                error: isDesiredRateOutOfRange(watch("tR2DesiredRate")),
+                helperText: isDesiredRateOutOfRange(watch("tR2DesiredRate")) ? "Desired Rate must be between 2 and 10." : errors.tR2DesiredRate?.message
               }
             ) }),
             /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsxs(
@@ -456,10 +415,17 @@ const RateWatchForm = ({
             /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
               Input,
               {
-                ...register("tR3DesiredRate"),
-                type: "string",
+                ...register("tR3DesiredRate", {
+                  setValueAs: (value) => sanitizeDesiredRate(String(value ?? ""))
+                }),
+                onChange: handleDesiredRateChange("tR3DesiredRate"),
+                type: "number",
+                min: "2",
+                max: "10",
                 placeholder: "Desired Rate",
-                className: dynPH
+                className: dynPH,
+                error: isDesiredRateOutOfRange(watch("tR3DesiredRate")),
+                helperText: isDesiredRateOutOfRange(watch("tR3DesiredRate")) ? "Desired Rate must be between 2 and 10." : errors.tR3DesiredRate?.message
               }
             ) }),
             /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsxs(
@@ -484,7 +450,20 @@ const RateWatchForm = ({
               }
             ) })
           ] }),
-          /* @__PURE__ */ jsx("p", { className: mt1Rem, children: "*The number in Desired Rate must be at least 2% and no more than 10%" })
+          /* @__PURE__ */ jsxs(
+            "p",
+            {
+              className: mt1Rem,
+              style: {
+                color: hasDesiredRateWarning ? "#d92d20" : void 0,
+                fontWeight: hasDesiredRateWarning ? 600 : void 0
+              },
+              children: [
+                /* @__PURE__ */ jsx("sup", { children: "*" }),
+                " Please enter a desired rate between 2% and 10%"
+              ]
+            }
+          )
         ] }),
         /* @__PURE__ */ jsxs("div", { className: modalCheckboxContainer, children: [
           /* @__PURE__ */ jsx(

package/dist/Forms/MortgageWarehouseLending.js

@@ -1,6 +1,10 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { zodResolver } from "@hookform/resolvers/zod";
+import { Button } from "../Button/Button.js";
+import "../Button/Button.css.js";
+import "react";
+import "react-use";
 import "../Input/Checkbox.js";
 import "../Input/CurrencyInput.js";
 import "../Input/Dropdown.js";
@@ -16,126 +20,20 @@ import "../icons/ArrowIcon/ArrowIcon.css.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/NavBar2.css';import '../assets/NavigationMenu/AxosALTS/NavBar2.css';import '../assets/NavigationMenu/AxosClearing/NavBar2.css';import '../assets/NavigationMenu/AxosBank/SubNavbar.css';import '../assets/NavigationMenu/ServerNavigation/NavigationBar.css';import '../assets/NavigationMenu/AxosAdvisorServices/SubNavbar.css';import '../assets/NavigationMenu/AxosAdvisorServices/NavBar2.css';import '../assets/NavigationMenu/AxosAdvisor/SubNavbar.css';import '../assets/NavigationMenu/AxosAdvisor/NavBar2.css';import '../assets/NavigationMenu/AxosBank/NavBar2.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/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/Forms/QuickPricer/QuickPricerResults.css';import '../assets/Modal/Modal.css';import '../assets/ImageToast/ImageToast.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                                */
+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 "../Accordion/Accordion.js";
-import "../Accordion/Accordion.css.js";
 import { z } from "zod";
 import { getVariant } from "../utils/getVariant.js";
 import { useCachedEmailValidator } from "../utils/useCachedValidators.js";
 import clsx from "clsx";
-import "react";
-import "../Chevron/Chevron.css.js";
-import "../AlertBanner/AlertBanner.css.js";
-import "../Article/Article.css.js";
-import { Button } from "../Button/Button.js";
-import "../Button/Button.css.js";
-import "react-use";
-import "../ArticlesSet/ArticlesSet.css.js";
-import "../IconBillboard/IconBillboard.css.js";
-import "../Calculators/calculator.css.js";
-import "../Calculators/AnnualFeeCalculator/AnnualFeeCalculator.css.js";
-import "../Modal/contextApi/store.js";
-import "next/image.js";
-import "../Calculators/ApyCalculator/ApyCalculator.css.js";
-import "../Calculators/ApyCalculatorUserTest/ApyCalculatorUserTest.css.js";
-import "../HeroBanner/LargeBanner.css.js";
-import "../HeroBanner/HeroBanner.css.js";
-import "../HeroBanner/SelectionBanner.css.js";
-/* empty css                                          */
-/* empty css                                          */
-/* empty css                                          */
-import "../SetContainer/SetContainer.css.js";
-import "../Table/Table.css.js";
-import "../Calculators/AxosOneCalculator/BalanceAPYCalculator.css.js";
-import "../Calculators/BalanceAPYCalculator/BalanceAPYCalculator.css.js";
-import "../Input/PercentageInput.js";
 import { useForm, FormProvider } from "react-hook-form";
-import "../Calculators/BuyDownCalculator/BuyDownCalculator.css.js";
 import { iconForm, headerContainer, headerForm, form, descriptionField, formWrapper, disclosureForm, actions, formContainer } from "./Forms.css.js";
 import { HoneyPot } from "./HoneyPot/index.js";
 import { SalesforceSchema } from "./SalesforceFieldsForm.js";
-import "../Input/RadioButton.css.js";
-import "../Input/Checkbox.css.js";
-import "../LoadingIndicator/LoadingIndicator.css.js";
-/* empty css                                */
-import "../Interstitial/Interstitial-variants.css.js";
-import "../Inputs/Input.css.js";
-/* empty css                                                  */
-import "../Hyperlink/Hyperlink.css.js";
-/* empty css                                               */
-import "iframe-resizer";
-/* empty css                                                                                */
-import "../Calculators/MonthlyPaymentCalculator/MonthlyPaymentCalculator.css.js";
-import "../Calculators/MonthlyPaymentLVFCalculator/MonthlyPaymentCalculator.css.js";
-import "../Calculators/SummitApyCalculator/BalanceAPYCalculator.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";
-import "../Chatbot/Chatbot.js";
-import "../Chatbot/Chatbot.css.ts.vanilla.css.js";
-/* empty css                                       */
-import "../Chatbot/store/messages.js";
-/* empty css                                                                    */
-import "../Comparison/Comparison.css.js";
-import "../Tab/Tab.css.js";
-import "../icons/Star/Star.css.js";
-import "../ContentBanner/ContentBanner.css.js";
-/* empty css                                              */
-import "../ExecutiveBio/ExecutiveBio.css.js";
-import "../FaqAccordion/index.js";
-import "../FooterDisclosure/FooterDisclosure.css.js";
-/* empty css                                                          */
-/* empty css                                                         */
-/* empty css                                            */
-import "../ImageBillboard/ImageBillboard.css.js";
-import "next/script.js";
-/* empty css                                        */
-/* empty css                                        */
-/* empty css                                              */
-/* empty css                                                      */
-/* empty css                                            */
-import "../LandingPageHeader/LandingPageHeader.css.js";
-import "next/link.js";
-/* empty css                                                   */
-/* empty css                                                      */
-import "next/navigation.js";
-/* empty css                                                         */
-/* empty css                                                              */
-/* empty css                                                                 */
-/* empty css                                                                  */
-import "../NavigationMenu/ServerNavigation/Menu.js";
-import "../NavigationMenu/ServerNavigation/SubNavbar.css.js";
-/* empty css                                                      */
-/* empty css                                                       */
-/* empty css                                                   */
-/* empty css                                                     */
-import "../PageNavItem/PageNavItem.css.js";
-import "react-slick";
-/* empty css                                                 */
-/* empty css                                          */
-/* empty css                                                    */
-/* empty css                                                  */
-import "../StepItem/StepItem.css.js";
-import "../StepItemSet/StepItemSet.css.js";
-/* empty css                                        */
-/* empty css                                */
-/* empty css                                                  */
-/* empty css                                                */
-/* empty css                                              */
 import { honeyPotSchema, isValidHoneyPot } from "./HoneyPot/honeyPotValidation.js";
 const MortgageWarehouseLending = ({
   icon = false,

package/dist/Forms/NameAndEmail.d.ts

@@ -0,0 +1,8 @@
+import { FormProps } from './FormProps';
+
+export type NameAndEmailInputs = {
+    first_name: string;
+    last_name: string;
+    email: string;
+};
+export declare const NameAndEmail: ({ icon, children, onSubmit, disclosure, variant: fullVariant, headline, description, callToAction, validateEmail, onValidate, id, }: FormProps) => import("react").JSX.Element;

package/dist/Forms/NameAndEmail.js

@@ -0,0 +1,165 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { Button } from "../Button/Button.js";
+import "../Button/Button.css.js";
+import "react";
+import "react-use";
+import { Input } from "../Input/Input.js";
+import "../icons/ArrowIcon/ArrowIcon.css.js";
+import SvgAxosX from "../icons/AxosX/index.js";
+import SvgComponent from "../icons/AxosX/Blue.js";
+import "../icons/CheckIcon/CheckIcon.css.js";
+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 * 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";
+import { useForm, FormProvider } from "react-hook-form";
+import { iconForm, headerContainer, headerForm, form, descriptionField, fullRowForm, formWrapper, disclosureForm, actions, formContainer } from "./Forms.css.js";
+import { HoneyPot } from "./HoneyPot/index.js";
+import { SalesforceSchema } from "./SalesforceFieldsForm.js";
+import { honeyPotSchema, isValidHoneyPot } from "./HoneyPot/honeyPotValidation.js";
+const NameAndEmail = ({
+  icon = false,
+  children,
+  onSubmit = (values) => {
+    console.log(values);
+  },
+  disclosure,
+  variant: fullVariant = "primary",
+  headline,
+  description,
+  callToAction,
+  validateEmail,
+  onValidate,
+  id
+}) => {
+  const cachedEmailValidator = useCachedEmailValidator(validateEmail);
+  const schema = z.object({
+    first_name: z.string().regex(/^[A-Za-z][^0-9_!¡?÷?¿/\\+=@#$%ˆ&*,.^(){}|~<>;:[\]]{1,}$/g).trim().min(1, { message: "First Name is required." }),
+    last_name: z.string().regex(/^[A-Za-z][^0-9_!¡?÷?¿/\\+=@#$%ˆ&*,.^(){}|~<>;:[\]]{1,}$/g).trim().min(1, { message: "Last Name is required." }),
+    email: z.string().email({ message: "Email is required." }).refine(cachedEmailValidator, { message: "Invalid email address." })
+  });
+  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(gen_schema),
+    mode: "all",
+    defaultValues: {
+      email: ""
+    }
+  });
+  const {
+    handleSubmit,
+    register,
+    formState: { errors, isValid, isSubmitting }
+  } = methods;
+  const submitForm = async (data) => {
+    await onSubmit(data);
+  };
+  const variant = getVariant(fullVariant);
+  return /* @__PURE__ */ jsx("section", { id, className: clsx(formContainer({ variant })), children: /* @__PURE__ */ jsx("div", { className: clsx("containment"), children: /* @__PURE__ */ jsxs(FormProvider, { ...methods, children: [
+    icon && /* @__PURE__ */ jsx("div", { className: clsx("text_center", iconForm), children: ["primary", "secondary"].includes(variant) ? /* @__PURE__ */ jsx(SvgComponent, {}) : /* @__PURE__ */ jsx(SvgAxosX, {}) }),
+    /* @__PURE__ */ jsxs("div", { className: `${headerContainer} text_center`, children: [
+      /* @__PURE__ */ jsx("h2", { className: clsx("header_2", headerForm({ variant })), children: headline }),
+      description && /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: `${form} ${descriptionField({ variant })} text_center`,
+          children: description
+        }
+      )
+    ] }),
+    /* @__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", { className: "", children: /* @__PURE__ */ jsx(
+              Input,
+              {
+                id: "first_name",
+                ...register("first_name", { required: true }),
+                label: "First Name",
+                sizes: "medium",
+                placeholder: "First Name",
+                required: true,
+                error: !!errors.first_name,
+                helperText: errors.first_name?.message,
+                variant
+              }
+            ) }),
+            /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
+              Input,
+              {
+                id: "last_name",
+                ...register("last_name", { required: true }),
+                label: "Last Name",
+                sizes: "medium",
+                placeholder: "Last Name",
+                required: true,
+                error: !!errors.last_name,
+                helperText: errors.last_name?.message,
+                variant
+              }
+            ) }),
+            /* @__PURE__ */ jsx("div", { className: fullRowForm, children: /* @__PURE__ */ jsx(
+              Input,
+              {
+                id: "email",
+                ...register("email", {
+                  required: true,
+                  validate: {
+                    isValid: associatedEmail
+                  }
+                }),
+                label: "Email",
+                sizes: "medium",
+                placeholder: "Email",
+                required: true,
+                error: !!errors.email,
+                helperText: errors.email?.message,
+                variant
+              }
+            ) }),
+            /* @__PURE__ */ jsx(HoneyPot, { register, variant })
+          ] }),
+          children,
+          /* @__PURE__ */ jsx("div", { className: disclosureForm({ variant }), children: disclosure }),
+          /* @__PURE__ */ jsx("div", { className: actions, children: /* @__PURE__ */ jsx(
+            Button,
+            {
+              color: getVariant(callToAction?.variant),
+              as: "button",
+              type: "submit",
+              disabled: !isValid || isSubmitting,
+              children: callToAction?.displayText
+            }
+          ) })
+        ]
+      }
+    )
+  ] }) }) }, id);
+};
+export {
+  NameAndEmail
+};