@axos-web-dev/shared-components 0.0.133 → 0.0.135

package/dist/FdicCallout/FdicCallout.module.js

@@ -1,5 +1,5 @@
-const fdic_callout = "_fdic_callout_1kihd_1";
-const inner_container = "_inner_container_1kihd_6";
+const fdic_callout = "_fdic_callout_1f6md_1";
+const inner_container = "_inner_container_1f6md_6";
 const css = {
   fdic_callout,
   inner_container

package/dist/FdicCallout/index.js

@@ -1,26 +1,23 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import css from "./FdicCallout.module.js";
 const FdicBanner = () => {
-  return /* @__PURE__ */ jsx("header", { className: css.fdic_callout, children: /* @__PURE__ */ jsx("div", { className: css.inner_container, children: /* @__PURE__ */ jsxs("div", { className: "flex middle", children: [
+  return /* @__PURE__ */ jsx("header", { className: css.fdic_callout, children: /* @__PURE__ */ jsx("div", { className: css.inner_container, children: /* @__PURE__ */ jsx("div", { className: "flex middle", children: /* @__PURE__ */ jsxs("picture", { children: [
     /* @__PURE__ */ jsx(
-      "svg",
+      "source",
       {
-        width: "39",
-        height: "16",
-        viewBox: "0 0 39 16",
-        fill: "none",
-        xmlns: "http://www.w3.org/2000/svg",
-        children: /* @__PURE__ */ jsx(
-          "path",
-          {
-            d: "M34.8999 3.9C36.1999 3.9 37.3999 4.5 38.1999 5.6V0.8C37.0999 0.3 35.9999 0 34.6999 0C32.6999 0 30.5999 0.9 29.1999 2.4C27.7999 4 27.0999 6 27.0999 8C27.0999 10.2 27.7999 12.2 29.3999 13.7C30.8999 15.1 32.7999 15.9 34.8999 15.9C36.0999 15.9 36.9999 15.6 38.1999 15.2V10.5C37.3999 11.5 36.1999 12.1 34.8999 12.1C32.4999 12.1 30.9999 10.4 30.9999 8C30.9999 5.6 32.5999 3.9 34.8999 3.9ZM22.7999 15.6H26.5999V0.5H22.7999V15.6ZM14.0999 12.2H13.1999V3.8H14.0999C16.4999 3.8 18.2999 5.3 18.2999 8C18.2999 10.9 16.3999 12.2 14.0999 12.2ZM14.8999 0.5H9.4999V15.6H14.8999C18.8999 15.6 22.2999 12.3 22.2999 8.1C22.2999 3.9 18.8999 0.5 14.8999 0.5ZM0.399902 15.5H4.1999V9.6H8.3999V6.3H4.1999V3.8H8.7999V0.5H0.399902V15.5Z",
-            fill: "#fff"
-          }
-        )
+        media: "(max-width:470px)",
+        srcSet: "https://images.axos.com/o9ov1v03uwqk/kntIyYva4pj4Lahj5IUiR/9a3f70731650a801033c3553a3c151d8/fdic-callout-mobile.png"
       }
     ),
-    /* @__PURE__ */ jsx("p", { className: "mb_0", children: "FDIC-Insured - Backed by the full faith and credit of the U.S. Government" })
-  ] }) }) });
+    /* @__PURE__ */ jsx(
+      "img",
+      {
+        src: "https://images.axos.com/o9ov1v03uwqk/3ptbiM1tUeC10mwamc0Hvg/9d11b3170a9a42a853f7342199865260/fdic-callout.png",
+        alt: "fdic-insured - backed by the full faith and credit of the u.s. government",
+        className: "img_fluid"
+      }
+    )
+  ] }) }) }) });
 };
 export {
   FdicBanner

package/dist/Forms/BlendPurchase.d.ts

@@ -0,0 +1,11 @@
+import { FormProps } from './FormProps';
+
+export type BlendPurchaseInputs = {
+    property_Type: string;
+    Occupancy: string;
+    SalesPrice: string;
+    DownPayment: string;
+    CreditScore: string;
+    ZipCode: string;
+};
+export declare const BlendPurchase: ({ icon, children, onSubmit, disclosure, variant: fullVariant, headline, description, callToAction, validateEmail, id, }: FormProps) => import("react/jsx-runtime").JSX.Element;

package/dist/Forms/BlendPurchase.js

@@ -0,0 +1,215 @@
+"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";
+/* empty css                                          */
+/* empty css                                   */
+import { Input } from "../Input/Input.js";
+import "../Input/Input.css.js";
+import "../Input/InputAmount.js";
+import { InputPhone } from "../Input/InputPhone.js";
+import "../Input/InputTextArea.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";
+/* empty css                                */
+/* empty css                                   */
+/* empty css                                                    */
+/* empty css                                                */
+import { associatedEmail } from "../utils/EverestValidity.js";
+import "../utils/allowedAxosDomains.js";
+import { getVariant } from "../utils/getVariant.js";
+import clsx from "clsx";
+import { useForm, FormProvider } from "react-hook-form";
+import * as z from "zod";
+import { formContainer, iconForm, headerContainer, headerForm, form, descriptionField, formWrapper, disclosureForm, actions } from "./Forms.css.js";
+import { SalesforceSchema } from "./SalesforceFieldsForm.js";
+const BlendPurchase = ({
+  icon = false,
+  children,
+  onSubmit = (values) => {
+    console.log(values);
+  },
+  disclosure,
+  variant: fullVariant = "primary",
+  headline,
+  description,
+  callToAction,
+  validateEmail,
+  id
+}) => {
+  const schema = z.object({
+    property_Type: z.string().regex(/^[A-Za-z][^0-9_!¡?÷?¿/\\+=@#$%ˆ&*,.^(){}|~<>;:[\]]{1,}$/g).trim().min(1, { message: "First Name is required." }),
+    Occupancy: z.string().regex(/^[A-Za-z][^0-9_!¡?÷?¿/\\+=@#$%ˆ&*,.^(){}|~<>;:[\]]{1,}$/g).trim().min(1, { message: "Last Name is required." }),
+    SalesPrice: z.string().email({ message: "Email is required." }).refine(async (val) => await validateEmail(val)),
+    DownPayment: z.string().regex(/[\d-]{10}/).min(10, { message: "Phone is required." }).max(12, { message: "Phone is required." }).transform((val, ctx) => {
+      const removeDashes = val.replace(/-/gi, "");
+      if (removeDashes.length !== 10) {
+        ctx.addIssue({
+          code: z.ZodIssueCode.custom,
+          message: "Phone must have at least 10 and no more than 10 characters."
+        });
+        return z.NEVER;
+      }
+      return removeDashes;
+    }),
+    CreditScore: z.string(),
+    ZipCode: z.string()
+  });
+  const methods = useForm({
+    resolver: zodResolver(schema.merge(SalesforceSchema), {
+      async: true
+    }),
+    mode: "all",
+    defaultValues: {}
+  });
+  const {
+    handleSubmit,
+    register,
+    formState: { errors, isValid, isSubmitting }
+  } = methods;
+  const submitForm = async (data) => {
+    await onSubmit(data);
+  };
+  const variant = getVariant(fullVariant);
+  return /* @__PURE__ */ jsx(
+    "section",
+    {
+      id: `id_${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: clsx(
+                "text_center",
+                form,
+                descriptionField({ variant })
+              ),
+              children: description
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs("form", { className: form, onSubmit: handleSubmit(submitForm), children: [
+          /* @__PURE__ */ jsxs("div", { className: clsx(formWrapper({ variant })), children: [
+            /* @__PURE__ */ jsx("div", { className: "", children: /* @__PURE__ */ jsx(
+              Input,
+              {
+                id: "property_Type",
+                ...register("property_Type", { required: true }),
+                label: "Property Type",
+                sizes: "medium",
+                required: true,
+                error: !!errors.property_Type,
+                helperText: errors.property_Type?.message,
+                variant
+              }
+            ) }),
+            /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
+              Input,
+              {
+                id: "Occupancy",
+                ...register("Occupancy", { required: true }),
+                label: "Property Usage",
+                sizes: "medium",
+                required: true,
+                error: !!errors.Occupancy,
+                helperText: errors.Occupancy?.message,
+                variant
+              }
+            ) }),
+            /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
+              Input,
+              {
+                id: "SalesPrice",
+                ...register("SalesPrice", {
+                  required: true,
+                  validate: {
+                    isValid: associatedEmail
+                  }
+                }),
+                label: "Purchase Price",
+                sizes: "medium",
+                required: true,
+                error: !!errors.SalesPrice,
+                helperText: errors.SalesPrice?.message,
+                variant
+              }
+            ) }),
+            /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
+              InputPhone,
+              {
+                id: "DownPayment",
+                ...register("DownPayment", {
+                  required: true,
+                  maxLength: 12
+                }),
+                label: "Down Payment",
+                sizes: "medium",
+                required: true,
+                error: !!errors.DownPayment,
+                helperText: errors.DownPayment?.message,
+                variant
+              }
+            ) }),
+            /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
+              InputPhone,
+              {
+                id: "CreditScore",
+                ...register("CreditScore", {
+                  required: true,
+                  maxLength: 12
+                }),
+                label: "Credit Score",
+                sizes: "medium",
+                required: true,
+                error: !!errors.CreditScore,
+                helperText: errors.CreditScore?.message,
+                variant
+              }
+            ) }),
+            /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
+              InputPhone,
+              {
+                id: "ZipCode",
+                ...register("ZipCode", { required: true, maxLength: 12 }),
+                label: "Zip Code",
+                sizes: "medium",
+                required: true,
+                error: !!errors.ZipCode,
+                helperText: errors.ZipCode?.message,
+                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 {
+  BlendPurchase
+};

package/dist/Forms/BlendRefinance.d.ts

@@ -0,0 +1,11 @@
+import { FormProps } from './FormProps';
+
+export type BlendPurchaseInputs = {
+    property_Type: string;
+    Occupancy: string;
+    SalesPrice: string;
+    DownPayment: string;
+    CreditScore: string;
+    ZipCode: string;
+};
+export declare const BlendPurchase: ({ icon, children, onSubmit, disclosure, variant: fullVariant, headline, description, callToAction, validateEmail, id, }: FormProps) => import("react/jsx-runtime").JSX.Element;

package/dist/Forms/BlendRefinance.js

@@ -0,0 +1,215 @@
+"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";
+/* empty css                                          */
+/* empty css                                   */
+import { Input } from "../Input/Input.js";
+import "../Input/Input.css.js";
+import "../Input/InputAmount.js";
+import { InputPhone } from "../Input/InputPhone.js";
+import "../Input/InputTextArea.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";
+/* empty css                                */
+/* empty css                                   */
+/* empty css                                                    */
+/* empty css                                                */
+import { associatedEmail } from "../utils/EverestValidity.js";
+import "../utils/allowedAxosDomains.js";
+import { getVariant } from "../utils/getVariant.js";
+import clsx from "clsx";
+import { useForm, FormProvider } from "react-hook-form";
+import * as z from "zod";
+import { formContainer, iconForm, headerContainer, headerForm, form, descriptionField, formWrapper, disclosureForm, actions } from "./Forms.css.js";
+import { SalesforceSchema } from "./SalesforceFieldsForm.js";
+const BlendPurchase = ({
+  icon = false,
+  children,
+  onSubmit = (values) => {
+    console.log(values);
+  },
+  disclosure,
+  variant: fullVariant = "primary",
+  headline,
+  description,
+  callToAction,
+  validateEmail,
+  id
+}) => {
+  const schema = z.object({
+    property_Type: z.string().regex(/^[A-Za-z][^0-9_!¡?÷?¿/\\+=@#$%ˆ&*,.^(){}|~<>;:[\]]{1,}$/g).trim().min(1, { message: "First Name is required." }),
+    Occupancy: z.string().regex(/^[A-Za-z][^0-9_!¡?÷?¿/\\+=@#$%ˆ&*,.^(){}|~<>;:[\]]{1,}$/g).trim().min(1, { message: "Last Name is required." }),
+    SalesPrice: z.string().email({ message: "Email is required." }).refine(async (val) => await validateEmail(val)),
+    DownPayment: z.string().regex(/[\d-]{10}/).min(10, { message: "Phone is required." }).max(12, { message: "Phone is required." }).transform((val, ctx) => {
+      const removeDashes = val.replace(/-/gi, "");
+      if (removeDashes.length !== 10) {
+        ctx.addIssue({
+          code: z.ZodIssueCode.custom,
+          message: "Phone must have at least 10 and no more than 10 characters."
+        });
+        return z.NEVER;
+      }
+      return removeDashes;
+    }),
+    CreditScore: z.string(),
+    ZipCode: z.string()
+  });
+  const methods = useForm({
+    resolver: zodResolver(schema.merge(SalesforceSchema), {
+      async: true
+    }),
+    mode: "all",
+    defaultValues: {}
+  });
+  const {
+    handleSubmit,
+    register,
+    formState: { errors, isValid, isSubmitting }
+  } = methods;
+  const submitForm = async (data) => {
+    await onSubmit(data);
+  };
+  const variant = getVariant(fullVariant);
+  return /* @__PURE__ */ jsx(
+    "section",
+    {
+      id: `id_${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: clsx(
+                "text_center",
+                form,
+                descriptionField({ variant })
+              ),
+              children: description
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs("form", { className: form, onSubmit: handleSubmit(submitForm), children: [
+          /* @__PURE__ */ jsxs("div", { className: clsx(formWrapper({ variant })), children: [
+            /* @__PURE__ */ jsx("div", { className: "", children: /* @__PURE__ */ jsx(
+              Input,
+              {
+                id: "property_Type",
+                ...register("property_Type", { required: true }),
+                label: "Property Type",
+                sizes: "medium",
+                required: true,
+                error: !!errors.property_Type,
+                helperText: errors.property_Type?.message,
+                variant
+              }
+            ) }),
+            /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
+              Input,
+              {
+                id: "Occupancy",
+                ...register("Occupancy", { required: true }),
+                label: "Property Usage",
+                sizes: "medium",
+                required: true,
+                error: !!errors.Occupancy,
+                helperText: errors.Occupancy?.message,
+                variant
+              }
+            ) }),
+            /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
+              Input,
+              {
+                id: "SalesPrice",
+                ...register("SalesPrice", {
+                  required: true,
+                  validate: {
+                    isValid: associatedEmail
+                  }
+                }),
+                label: "Purchase Price",
+                sizes: "medium",
+                required: true,
+                error: !!errors.SalesPrice,
+                helperText: errors.SalesPrice?.message,
+                variant
+              }
+            ) }),
+            /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
+              InputPhone,
+              {
+                id: "DownPayment",
+                ...register("DownPayment", {
+                  required: true,
+                  maxLength: 12
+                }),
+                label: "Down Payment",
+                sizes: "medium",
+                required: true,
+                error: !!errors.DownPayment,
+                helperText: errors.DownPayment?.message,
+                variant
+              }
+            ) }),
+            /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
+              InputPhone,
+              {
+                id: "CreditScore",
+                ...register("CreditScore", {
+                  required: true,
+                  maxLength: 12
+                }),
+                label: "Credit Score",
+                sizes: "medium",
+                required: true,
+                error: !!errors.CreditScore,
+                helperText: errors.CreditScore?.message,
+                variant
+              }
+            ) }),
+            /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
+              InputPhone,
+              {
+                id: "ZipCode",
+                ...register("ZipCode", { required: true, maxLength: 12 }),
+                label: "Zip Code",
+                sizes: "medium",
+                required: true,
+                error: !!errors.ZipCode,
+                helperText: errors.ZipCode?.message,
+                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 {
+  BlendPurchase
+};

package/dist/Forms/FormEnums.js

@@ -51,7 +51,7 @@ const Purposes = [
   "Refi Rate-Term/Limited C.O."
 ];
 const RepresentativesFico = [
-  "780 +",
+  "780",
   "779 - 760",
   "759 - 740",
   "739 - 720",
@@ -73,7 +73,8 @@ const DocType = [
   "Investor - DSCR No Ratio",
   "Written VOE",
   "2 Year Alt Doc",
-  "1yr Streamlined Full Doc"
+  "1yr Streamlined Full Doc",
+  "1yr Profit and Loss"
 ];
 const Citizenship = [
   "U.S. Citizen",

package/dist/Forms/QuickPricer.d.ts

@@ -1,15 +1,19 @@
 import { FormProps } from './FormProps';
 
 export type QuickPricerInputs = {
-    base_Loan_Amount: number;
-    appraised_Value: number;
-    loan_Purpose: string;
-    Cash_Out_Amount: number;
-    CblInterestOnly: string;
-    representative_FICO: string;
-    months_Reserves: number;
-    underwriting_Document_Type: string;
-    citizenship: string;
+    Base_Loan_Amount__c: number;
+    Appraised_Value__c: number;
+    Loan_Purpose__c: string;
+    Cash_Out_Amount__c: number;
+    Interest_Only__c: boolean;
+    Self_Employed__c: boolean;
+    Pledged_Assets__c: boolean;
+    Cross_Collateralization__c: boolean;
+    Representative_FICO__c: string;
+    Months_Reserves__c: number;
+    Underwriting_Document_Type__c: string;
+    Debt_To_Income_Ratio__c: number;
+    Citizenship__c: string;
     Mortgage_Lates_12: string;
     Mortgage_Lates_24: string;
     HousingEventType: string;
@@ -18,10 +22,10 @@ export type QuickPricerInputs = {
     Number_of_Properties_Financed: number;
     BankruptcySeasoning: string;
     zip: string;
-    property_Type: string;
-    occupance: string;
-    Units: string;
-    Prepayment_Penalty: string;
+    Property_Type__c: string;
+    Occupance__c: string;
+    Units__c: string;
+    Prepayment_Penalty__c: string;
     broker_Compensation: string;
     NMLS_ID__c: string;
     email: string;