@axos-web-dev/shared-components 0.0.169 → 0.0.170

package/dist/ATMLocator/ATMLocator.js

@@ -58,13 +58,13 @@ import "../Input/InputAmount.js";
 import "../Input/InputPhone.js";
 import "../Input/InputTextArea.js";
 import "../Input/DownPaymentInput.js";
+import "../Input/RadioButton.js";
 import "react-hook-form";
 import { iconForm } from "../Forms/Forms.css.js";
 import "../Forms/SalesforceFieldsForm.js";
 import "../Input/RadioButton.css.js";
 import "../Input/Checkbox.css.js";
 import "../LoadingIndicator/LoadingIndicator.css.js";
-import "../Input/RadioButton.js";
 import "../Chevron/Chevron.css.js";
 import "../Interstitial/Interstitial-variants.css.js";
 import "../Inputs/Input.css.js";

package/dist/Button/Button.js

@@ -38,13 +38,13 @@ import "../Input/InputAmount.js";
 import "../Input/InputPhone.js";
 import "../Input/InputTextArea.js";
 import "../Input/DownPaymentInput.js";
+import "../Input/RadioButton.js";
 import "react-hook-form";
 import "../Forms/Forms.css.js";
 import "../Forms/SalesforceFieldsForm.js";
 import "../Input/RadioButton.css.js";
 import "../Input/Checkbox.css.js";
 import "../LoadingIndicator/LoadingIndicator.css.js";
-import "../Input/RadioButton.js";
 import "../Interstitial/Interstitial-variants.css.js";
 import "../Inputs/Input.css.js";
 /* empty css                                                         */

package/dist/Calculators/Calculator.js

@@ -61,6 +61,7 @@ import "../Input/InputAmount.js";
 import "../Input/InputPhone.js";
 import "../Input/InputTextArea.js";
 import "../Input/DownPaymentInput.js";
+import "../Input/RadioButton.js";
 /* empty css                                              */
 /* empty css                                                      */
 /* empty css                                            */
@@ -104,7 +105,6 @@ import { iconForm } from "../Forms/Forms.css.js";
 import "../Forms/SalesforceFieldsForm.js";
 import "../Input/RadioButton.css.js";
 import "../Input/Checkbox.css.js";
-import "../Input/RadioButton.js";
 import "../Inputs/Input.css.js";
 /* empty css                                                         */
 /* empty css                                                      */

package/dist/Carousel/index.js

@@ -44,13 +44,13 @@ import "../Input/InputAmount.js";
 import "../Input/InputPhone.js";
 import "../Input/InputTextArea.js";
 import "../Input/DownPaymentInput.js";
+import "../Input/RadioButton.js";
 import "react-hook-form";
 import "../Forms/Forms.css.js";
 import "../Forms/SalesforceFieldsForm.js";
 import "../Input/RadioButton.css.js";
 import "../Input/Checkbox.css.js";
 import "../LoadingIndicator/LoadingIndicator.css.js";
-import "../Input/RadioButton.js";
 import "../Inputs/Input.css.js";
 /* empty css                                                         */
 import "../Hyperlink/Hyperlink.css.js";

package/dist/Chevron/index.js

@@ -40,13 +40,13 @@ import "../Input/InputAmount.js";
 import "../Input/InputPhone.js";
 import "../Input/InputTextArea.js";
 import "../Input/DownPaymentInput.js";
+import "../Input/RadioButton.js";
 import "react-hook-form";
 import "../Forms/Forms.css.js";
 import "../Forms/SalesforceFieldsForm.js";
 import "../Input/RadioButton.css.js";
 import "../Input/Checkbox.css.js";
 import "../LoadingIndicator/LoadingIndicator.css.js";
-import "../Input/RadioButton.js";
 import "../Interstitial/Interstitial-variants.css.js";
 import "../Inputs/Input.css.js";
 /* empty css                                                         */

package/dist/Comparison/Comparison.js

@@ -38,13 +38,13 @@ import "../Input/InputAmount.js";
 import "../Input/InputPhone.js";
 import "../Input/InputTextArea.js";
 import "../Input/DownPaymentInput.js";
+import "../Input/RadioButton.js";
 import "react-hook-form";
 import "../Forms/Forms.css.js";
 import "../Forms/SalesforceFieldsForm.js";
 import "../Input/RadioButton.css.js";
 import "../Input/Checkbox.css.js";
 import "../LoadingIndicator/LoadingIndicator.css.js";
-import "../Input/RadioButton.js";
 import "../Chevron/Chevron.css.js";
 import "../Interstitial/Interstitial-variants.css.js";
 import "../Inputs/Input.css.js";

package/dist/FaqAccordion/index.js

@@ -38,13 +38,13 @@ import "../Input/InputAmount.js";
 import "../Input/InputPhone.js";
 import "../Input/InputTextArea.js";
 import "../Input/DownPaymentInput.js";
+import "../Input/RadioButton.js";
 import "react-hook-form";
 import "../Forms/Forms.css.js";
 import "../Forms/SalesforceFieldsForm.js";
 import "../Input/RadioButton.css.js";
 import "../Input/Checkbox.css.js";
 import "../LoadingIndicator/LoadingIndicator.css.js";
-import "../Input/RadioButton.js";
 import "../Chevron/Chevron.css.js";
 import "../Interstitial/Interstitial-variants.css.js";
 import "../Inputs/Input.css.js";

package/dist/FooterSiteMap/AxosBank/FooterSiteMap.js

@@ -39,13 +39,13 @@ import "../../Input/InputAmount.js";
 import "../../Input/InputPhone.js";
 import "../../Input/InputTextArea.js";
 import "../../Input/DownPaymentInput.js";
+import "../../Input/RadioButton.js";
 import "react-hook-form";
 import "../../Forms/Forms.css.js";
 import "../../Forms/SalesforceFieldsForm.js";
 import "../../Input/RadioButton.css.js";
 import "../../Input/Checkbox.css.js";
 import "../../LoadingIndicator/LoadingIndicator.css.js";
-import "../../Input/RadioButton.js";
 import "../../Inputs/Input.css.js";
 /* empty css                                                            */
 import "../../Hyperlink/Hyperlink.css.js";

package/dist/Forms/ApplicationStart.js

@@ -15,6 +15,7 @@ import "../Input/InputAmount.js";
 import { InputPhone } from "../Input/InputPhone.js";
 import "../Input/InputTextArea.js";
 import "../Input/DownPaymentInput.js";
+import "../Input/RadioButton.js";
 import "../icons/ArrowIcon/ArrowIcon.css.js";
 import SvgAxosX from "../icons/AxosX/index.js";
 import SvgComponent from "../icons/AxosX/Blue.js";

package/dist/Forms/ClearingForm.js

@@ -15,6 +15,7 @@ import "../Input/InputAmount.js";
 import { InputPhone } from "../Input/InputPhone.js";
 import "../Input/InputTextArea.js";
 import "../Input/DownPaymentInput.js";
+import "../Input/RadioButton.js";
 import CheckboxGroup from "../Input/CheckboxGroup.js";
 import "../icons/ArrowIcon/ArrowIcon.css.js";
 import SvgAxosX from "../icons/AxosX/index.js";

package/dist/Forms/CommercialDeposits.js

@@ -15,6 +15,7 @@ import "../Input/InputAmount.js";
 import { InputPhone } from "../Input/InputPhone.js";
 import "../Input/InputTextArea.js";
 import "../Input/DownPaymentInput.js";
+import "../Input/RadioButton.js";
 import "../icons/ArrowIcon/ArrowIcon.css.js";
 import SvgAxosX from "../icons/AxosX/index.js";
 import SvgComponent from "../icons/AxosX/Blue.js";

package/dist/Forms/CommercialLending.js

@@ -15,6 +15,7 @@ import "../Input/InputAmount.js";
 import { InputPhone } from "../Input/InputPhone.js";
 import "../Input/InputTextArea.js";
 import "../Input/DownPaymentInput.js";
+import "../Input/RadioButton.js";
 import { LoadingIndicator } from "../LoadingIndicator/index.js";
 import "../icons/ArrowIcon/ArrowIcon.css.js";
 import SvgAxosX from "../icons/AxosX/index.js";

package/dist/Forms/ContactCompany.js

@@ -15,6 +15,7 @@ import "../Input/InputAmount.js";
 import { InputPhone } from "../Input/InputPhone.js";
 import "../Input/InputTextArea.js";
 import "../Input/DownPaymentInput.js";
+import "../Input/RadioButton.js";
 import "../icons/ArrowIcon/ArrowIcon.css.js";
 import SvgAxosX from "../icons/AxosX/index.js";
 import SvgComponent from "../icons/AxosX/Blue.js";

package/dist/Forms/ContactUs.js

@@ -15,6 +15,7 @@ import "../Input/InputAmount.js";
 import { InputPhone } from "../Input/InputPhone.js";
 import "../Input/InputTextArea.js";
 import "../Input/DownPaymentInput.js";
+import "../Input/RadioButton.js";
 import "../icons/ArrowIcon/ArrowIcon.css.js";
 import SvgAxosX from "../icons/AxosX/index.js";
 import SvgComponent from "../icons/AxosX/Blue.js";

package/dist/Forms/ContactUsAAS.js

@@ -15,6 +15,7 @@ import "../Input/InputAmount.js";
 import { InputPhone } from "../Input/InputPhone.js";
 import { InputTextArea } from "../Input/InputTextArea.js";
 import "../Input/DownPaymentInput.js";
+import "../Input/RadioButton.js";
 import { LoadingIndicator } from "../LoadingIndicator/index.js";
 import "../icons/ArrowIcon/ArrowIcon.css.js";
 import SvgAxosX from "../icons/AxosX/index.js";

package/dist/Forms/ContactUsBusiness.js

@@ -11,6 +11,7 @@ import "../Input/InputAmount.js";
 import { InputPhone } from "../Input/InputPhone.js";
 import "../Input/InputTextArea.js";
 import "../Input/DownPaymentInput.js";
+import "../Input/RadioButton.js";
 import "../icons/ArrowIcon/ArrowIcon.css.js";
 import SvgAxosX from "../icons/AxosX/index.js";
 import SvgComponent from "../icons/AxosX/Blue.js";
@@ -46,7 +47,6 @@ import { SalesforceSchema } from "./SalesforceFieldsForm.js";
 import "../Input/RadioButton.css.js";
 import "../Input/Checkbox.css.js";
 import "../LoadingIndicator/LoadingIndicator.css.js";
-import "../Input/RadioButton.js";
 import "../Interstitial/Interstitial-variants.css.js";
 import "../Inputs/Input.css.js";
 /* empty css                                                  */

package/dist/Forms/ContactUsNMLSId.js

@@ -11,6 +11,7 @@ import "../Input/InputAmount.js";
 import { InputPhone } from "../Input/InputPhone.js";
 import "../Input/InputTextArea.js";
 import "../Input/DownPaymentInput.js";
+import "../Input/RadioButton.js";
 import "../icons/ArrowIcon/ArrowIcon.css.js";
 import SvgAxosX from "../icons/AxosX/index.js";
 import SvgComponent from "../icons/AxosX/Blue.js";
@@ -46,7 +47,6 @@ import { SalesforceSchema } from "./SalesforceFieldsForm.js";
 import "../Input/RadioButton.css.js";
 import "../Input/Checkbox.css.js";
 import "../LoadingIndicator/LoadingIndicator.css.js";
-import "../Input/RadioButton.js";
 import "../Interstitial/Interstitial-variants.css.js";
 import "../Inputs/Input.css.js";
 /* empty css                                                  */

package/dist/Forms/CpraRequest.js

@@ -15,6 +15,7 @@ import "../Input/InputAmount.js";
 import { InputPhone } from "../Input/InputPhone.js";
 import "../Input/InputTextArea.js";
 import "../Input/DownPaymentInput.js";
+import { RadioButtonSet, RadioButton } from "../Input/RadioButton.js";
 import "../icons/ArrowIcon/ArrowIcon.css.js";
 import SvgAxosX from "../icons/AxosX/index.js";
 import SvgComponent from "../icons/AxosX/Blue.js";
@@ -28,7 +29,6 @@ import clsx from "clsx";
 import { useForm, FormProvider } from "react-hook-form";
 import * as z from "zod";
 import { formContainer, iconForm, headerContainer, form, descriptionField, formWrapper, fullRowForm, disclosureForm, actions } from "./Forms.css.js";
-import { RadioButtonSet, RadioButton } from "../Input/RadioButton.js";
 import CheckboxGroup from "../Input/CheckboxGroup.js";
 import { findMoreAxosDomains } from "../utils/allowedAxosDomains.js";
 const CpraRequest = ({

package/dist/Forms/DealerServices.js

@@ -15,6 +15,7 @@ import "../Input/InputAmount.js";
 import { InputPhone } from "../Input/InputPhone.js";
 import { InputTextArea } from "../Input/InputTextArea.js";
 import "../Input/DownPaymentInput.js";
+import "../Input/RadioButton.js";
 import "../icons/ArrowIcon/ArrowIcon.css.js";
 import SvgAxosX from "../icons/AxosX/index.js";
 import SvgComponent from "../icons/AxosX/Blue.js";

package/dist/Forms/EmailOnly.js

@@ -11,6 +11,7 @@ import "../Input/InputAmount.js";
 import "../Input/InputPhone.js";
 import "../Input/InputTextArea.js";
 import "../Input/DownPaymentInput.js";
+import "../Input/RadioButton.js";
 import "../icons/ArrowIcon/ArrowIcon.css.js";
 import SvgAxosX from "../icons/AxosX/index.js";
 import SvgComponent from "../icons/AxosX/Blue.js";
@@ -47,7 +48,6 @@ import { SalesforceSchema } from "./SalesforceFieldsForm.js";
 import "../Input/RadioButton.css.js";
 import "../Input/Checkbox.css.js";
 import "../LoadingIndicator/LoadingIndicator.css.js";
-import "../Input/RadioButton.js";
 import "../Interstitial/Interstitial-variants.css.js";
 import "../Inputs/Input.css.js";
 /* empty css                                                  */

package/dist/Forms/Forms.css.js

@@ -4,6 +4,7 @@
 /* empty css                                */
 /* empty css                                          */
 /* empty css                                   */
+/* empty css                                      */
 /* empty css                         */
 import { createRuntimeFn } from "@vanilla-extract/recipes/createRuntimeFn";
 var formContainer = createRuntimeFn({ defaultClassName: "tfms6a0", variantClassNames: { variant: { primary: "tfms6a1", secondary: "tfms6a2", tertiary: "tfms6a3", quaternary: "tfms6a4" } }, defaultVariants: {}, compoundVariants: [] });

package/dist/Forms/MortgageRate/MortgageRateForm.d.ts

@@ -19,8 +19,11 @@ export type MortgageRateInputs = {
     loanPurpose: number;
     [key: string]: string | number;
 };
-export declare const MortgageRate: ({ icon, children, onSubmit, disclosure, variant: fullVariant, validateEmail, id, rateWatchOnSubmit, }: FormProps & {
+export declare const MortgageRate: ({ icon, children, onSubmit, disclosure, variant: fullVariant, validateEmail, id, rateWatchOnSubmit, setRateWatchSubmitted, hideModalValue, showingTables, }: FormProps & {
     rateWatchOnSubmit: (values: RateWatchInputs & {
         email: string;
     }) => Promise<void>;
-}) => false | import("react/jsx-runtime").JSX.Element;
+    setRateWatchSubmitted?: React.Dispatch<React.SetStateAction<boolean>>;
+    hideModalValue: boolean;
+    showingTables: boolean;
+}) => import("react/jsx-runtime").JSX.Element;

package/dist/Forms/MortgageRate/MortgageRateForm.js

@@ -39,15 +39,15 @@ import "../../Input/InputAmount.js";
 import { InputPhone } from "../../Input/InputPhone.js";
 import "../../Input/InputTextArea.js";
 import { DownPaymentInput } from "../../Input/DownPaymentInput.js";
+import "../../Input/RadioButton.js";
 import { useForm, FormProvider } from "react-hook-form";
 import * as z from "zod";
-import { modalMobile, formContainer, iconForm, headerContainer, headerForm, form, descriptionField, fullRowSelect, formWrapper, centerSelect, mt2rem, fullRowForm, disclosureForm, actions, formBtns, na_cursor } from "../Forms.css.js";
+import { formContainer, iconForm, headerContainer, headerForm, form, descriptionField, fullRowSelect, formWrapper, centerSelect, mt2rem, fullRowForm, disclosureForm, actions, formBtns, na_cursor } from "../Forms.css.js";
 import { SalesforceSchema } from "../SalesforceFieldsForm.js";
 import "../../Input/RadioButton.css.js";
 import "../../Input/Checkbox.css.js";
 import { LoadingIndicator } from "../../LoadingIndicator/index.js";
 import "react-use";
-import "../../Input/RadioButton.js";
 import { RateWatchForm } from "./MortgageRateWatch.js";
 import { marketing_tile } from "../../Interstitial/Interstitial-variants.css.js";
 import css from "../../Interstitial/Interstitial.module.js";
@@ -120,13 +120,16 @@ const MortgageRate = ({
   variant: fullVariant = "primary",
   validateEmail,
   id,
-  rateWatchOnSubmit
+  rateWatchOnSubmit,
+  setRateWatchSubmitted,
+  hideModalValue,
+  showingTables
 }) => {
   const [loanPurpose, setLoanPurpose] = useState(1);
   const [rateType, setRateType] = useState("Purchase");
-  const [isModalOpen, setModalOpen] = useState(false);
+  const [_isModalOpen, setModalOpen] = useState(false);
   const [hasOpenedModal, setHasOpenedModal] = useState(false);
-  const [hideModal, setHideModal] = useState(false);
+  const [hideModal, setHideModal] = useState(hideModalValue || true);
   const [downPaymentPercentage, setDownPaymentPercentage] = useState(10);
   const [_downPayment, setDownPayment] = useState(0);
   const [isTypingDownPayment, setIsTypingDownPayment] = useState(false);
@@ -249,6 +252,9 @@ const MortgageRate = ({
       ...data
     };
     await onSubmit(processData);
+    if (setRateWatchSubmitted) {
+      setRateWatchSubmitted(false);
+    }
     setHideModal(true);
   };
   const variant = getVariant(fullVariant);
@@ -259,6 +265,7 @@ const MortgageRate = ({
     } else {
       setHideModal(true);
     }
+    setHideModal(!hideModal);
   };
   const rateWatchModal = /* @__PURE__ */ jsx(
     "div",
@@ -268,7 +275,7 @@ const MortgageRate = ({
       children: /* @__PURE__ */ jsxs(
         "div",
         {
-          className: `${css.modal} active ${modalMobile}`,
+          className: `${css.modal} active`,
           role: "dialog",
           "aria-modal": "true",
           tabIndex: -1,
@@ -311,13 +318,13 @@ const MortgageRate = ({
     }
     return value;
   };
-  return !hideModal && /* @__PURE__ */ jsxs(
-    "section",
-    {
-      id: "MortgageRateQuoteForm",
-      className: clsx(formContainer({ variant })),
-      children: [
-        /* @__PURE__ */ jsx("div", { className: clsx("containment"), children: /* @__PURE__ */ jsxs(FormProvider, { ...methods, children: [
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    hideModal && !showingTables && /* @__PURE__ */ jsx(
+      "section",
+      {
+        id: "MortgageRateQuoteForm",
+        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: clsx(headerContainer, "text_center"), children: [
             /* @__PURE__ */ jsxs("h1", { className: clsx("header_1", headerForm({ variant })), children: [
@@ -359,7 +366,9 @@ const MortgageRate = ({
                   onChange: (e) => {
                     const selectedValue = Number(e.target.value);
                     setLoanPurpose(selectedValue);
-                    setRateType(selectedValue === 1 ? "Purchase" : "Refinance");
+                    setRateType(
+                      selectedValue === 1 ? "Purchase" : "Refinance"
+                    );
                   },
                   children: [
                     /* @__PURE__ */ jsx("option", { value: "1", children: "Purchase Rates" }),
@@ -725,6 +734,7 @@ const MortgageRate = ({
                     onClick: isValid ? handleSubmit(async (data) => {
                       await onSubmit(data);
                       toggleModal();
+                      setHideModal(false);
                     }) : (e) => {
                       e.preventDefault();
                     },
@@ -735,12 +745,12 @@ const MortgageRate = ({
               ] })
             ] }) })
           ] })
-        ] }) }),
-        isModalOpen && rateWatchModal
-      ]
-    },
-    id
-  );
+        ] }) })
+      },
+      id
+    ),
+    !hideModal && rateWatchModal
+  ] });
 };
 export {
   MortgageRate

package/dist/Forms/MortgageRate/MortgageRateModal.d.ts

@@ -8,7 +8,7 @@ type MortgageRateModalProps = {
         email: string;
         lastName: string;
     }) => Promise<void>;
-    isOpen: boolean;
+    isOpen?: boolean;
     toggleModal: () => void;
     isSubmitting?: boolean;
 };

package/dist/Forms/MortgageRate/MortgageRateModal.js

@@ -7,12 +7,11 @@ const MortgageRateModal = ({
   email,
   lastName,
   rateWatchOnSubmit,
-  isOpen,
+  isOpen = true,
   toggleModal,
   isSubmitting
 }) => {
-  if (!isOpen) return null;
-  return /* @__PURE__ */ jsx(
+  return isOpen && /* @__PURE__ */ jsx(
     "div",
     {
       className: `${marketing_tile} ${css.overlay} ${css.white_modal} active interstitial`,
@@ -20,7 +19,7 @@ const MortgageRateModal = ({
       children: /* @__PURE__ */ jsxs(
         "div",
         {
-          className: `${css.modal} active ${css.modalMobile}`,
+          className: `${css.modal} active`,
           role: "dialog",
           "aria-modal": "true",
           tabIndex: -1,

package/dist/Forms/MortgageRate/MortgageRateQuoteFilters.js

@@ -15,6 +15,7 @@ import "../../Input/InputAmount.js";
 import "../../Input/InputPhone.js";
 import "../../Input/InputTextArea.js";
 import { DownPaymentInput } from "../../Input/DownPaymentInput.js";
+import "../../Input/RadioButton.js";
 import clsx from "clsx";
 import { useForm, FormProvider } from "react-hook-form";
 import * as z from "zod";
@@ -28,7 +29,9 @@ const MortgageRateFilters = ({
   const [loanPurpose, setLoanPurpose] = useState(formData.loanPurpose);
   const [salesPriceVal, setSalesPriceVal] = useState(0);
   const [isTypingDownPayment, setIsTypingDownPayment] = useState(false);
-  const [downPaymentPercentage, setDownPaymentPercentage] = useState(10);
+  const [downPaymentPercentage, setDownPaymentPercentage] = useState(
+    formData.downPayment / formData.salesPrice * 100 || 10
+  );
   const [_downPayment, setDownPayment] = useState(0);
   const schema = z.object({
     loanPurpose: z.number({ message: "Loan Purpose is required." }),
@@ -279,7 +282,7 @@ const MortgageRateFilters = ({
                   isTypingDownPayment,
                   setIsTypingDownPayment,
                   methods,
-                  defaultValue: formData.downPayment
+                  defaultValue: formData.downPayment > 0 ? formatCurrency(formData.downPayment) : ""
                 }
               ) })
             ] }),

package/dist/Forms/MortgageRate/MortgageRateWatch.d.ts

@@ -23,6 +23,7 @@ type RateWatchFormProps = {
         lastName: string;
     }) => void;
     toggleModal: () => void;
+    setRateWatchSubmitted?: React.Dispatch<React.SetStateAction<boolean>>;
 };
-export declare const RateWatchForm: ({ email, lastName, rateWatchOnSubmit, toggleModal, }: RateWatchFormProps) => import("react/jsx-runtime").JSX.Element;
+export declare const RateWatchForm: ({ email, lastName, rateWatchOnSubmit, toggleModal, setRateWatchSubmitted, }: RateWatchFormProps) => import("react/jsx-runtime").JSX.Element;
 export {};