@axos-web-dev/shared-components 0.0.151 → 0.0.153

package/README.md

@@ -1,111 +1,111 @@
-# Installation
-
-Using npm:
-
-```shell
-$ npm install @axos-web-dev/shared-components
-```
-
-To import components
-In Node.js:
-
-```js
-// Import Components
-import {
-  AlertBanner,
-  CallToActionBar,
-  DownloadTile,
-  ImageBillboard,
-  SecondaryFooter,
-} from "@axos-web-dev/shared-components";
-
-// Import Types/Interfaces
-
-import { AlertBannerInterface } from "@axos-web-dev/shared-components/dist/AlertBanner/AlertBanner.interface";
-```
-
-In css files:
-
-```css
-/*** Import styles ***/
-
-@import "@axos-web-dev/shared-components/dist/assets/AlertBanner/AlertBanner.css";
-```
-
-# Shared components
-
-This project is develop using `React + TypeScript + Vite + Storybook + Vanilla-extract` to building custom components for internal use.
-
-## How to add new component
-
-For add a new component use the `src/lib` folder and create a folder for the component. After that you should register an export in `src/lib/main.ts` file.
-
-Also you need create a storie for the new component. Go to `src/stories` and create a new file or folder.
-
-```shell
-git clone bofaz@vs-ssh.visualstudio.com:v3/bofaz/Axos%20Marketing%20Cloud/Shared%20Components shared-components
-
-cd shared-components
-
-npm install
-
-# for using storybook
-npm run storybook
-
-# for build
-npm run build
-
-# for testing in other projects
-npm run build
-
-npm link
-
-```
-
-For publishing we need to udpate the version we are using [semantic versioning](https://semver.org/)
-
-```
-Given a version number MAJOR.MINOR.PATCH, increment the:
-
-    MAJOR version when you make incompatible API changes
-    MINOR version when you add functionality in a backward compatible manner
-    PATCH version when you make backward compatible bug fixes
-
-Additional labels for pre-release and build metadata are available as extensions to the MAJOR.MINOR.PATCH format.
-```
-
-we can update the version with the following commands:
-
-```shell
-# bumps the patch number like 0.0.0 -> 0.0.1
-npm version patch
-
-# bumps the patch number like 0.0.0 -> 0.1.0
-npm version minor
-
-# bumps the patch number like 0.0.0 -> 1.0.0
-npm version major
-
-
-
-```
-
-## How to publish new library version to npm
-
-First update the version as previously described
-
-```shell
-npm version [...]
-```
-
-Then you will need to login into npm to do that write:
-
-```shell
-npm login --scope=@my-org
-```
-
-Last you to publish the new version:
-
-```shell
-npm publish
-```
+# Installation
+
+Using npm:
+
+```shell
+$ npm install @axos-web-dev/shared-components
+```
+
+To import components
+In Node.js:
+
+```js
+// Import Components
+import {
+  AlertBanner,
+  CallToActionBar,
+  DownloadTile,
+  ImageBillboard,
+  SecondaryFooter,
+} from "@axos-web-dev/shared-components";
+
+// Import Types/Interfaces
+
+import { AlertBannerInterface } from "@axos-web-dev/shared-components/dist/AlertBanner/AlertBanner.interface";
+```
+
+In css files:
+
+```css
+/*** Import styles ***/
+
+@import "@axos-web-dev/shared-components/dist/assets/AlertBanner/AlertBanner.css";
+```
+
+# Shared components
+
+This project is develop using `React + TypeScript + Vite + Storybook + Vanilla-extract` to building custom components for internal use.
+
+## How to add new component
+
+For add a new component use the `src/lib` folder and create a folder for the component. After that you should register an export in `src/lib/main.ts` file.
+
+Also you need create a storie for the new component. Go to `src/stories` and create a new file or folder.
+
+```shell
+git clone bofaz@vs-ssh.visualstudio.com:v3/bofaz/Axos%20Marketing%20Cloud/Shared%20Components shared-components
+
+cd shared-components
+
+npm install
+
+# for using storybook
+npm run storybook
+
+# for build
+npm run build
+
+# for testing in other projects
+npm run build
+
+npm link
+
+```
+
+For publishing we need to udpate the version we are using [semantic versioning](https://semver.org/)
+
+```
+Given a version number MAJOR.MINOR.PATCH, increment the:
+
+    MAJOR version when you make incompatible API changes
+    MINOR version when you add functionality in a backward compatible manner
+    PATCH version when you make backward compatible bug fixes
+
+Additional labels for pre-release and build metadata are available as extensions to the MAJOR.MINOR.PATCH format.
+```
+
+we can update the version with the following commands:
+
+```shell
+# bumps the patch number like 0.0.0 -> 0.0.1
+npm version patch
+
+# bumps the patch number like 0.0.0 -> 0.1.0
+npm version minor
+
+# bumps the patch number like 0.0.0 -> 1.0.0
+npm version major
+
+
+
+```
+
+## How to publish new library version to npm
+
+First update the version as previously described
+
+```shell
+npm version [...]
+```
+
+Then you will need to login into npm to do that write:
+
+```shell
+npm login --scope=@my-org
+```
+
+Last you to publish the new version:
+
+```shell
+npm publish
+```

package/dist/ATMLocator/ATMLocator.js

@@ -73,6 +73,7 @@ import "../ImageBillboard/ImageBillboard.css.js";
 import "react-wrap-balancer";
 /* empty css                                              */
 /* empty css                                                      */
+/* empty css                                            */
 /* empty css                                    */
 import "../LandingPageHeader/LandingPageHeader.css.js";
 /* empty css                                */

package/dist/Avatar/Avatar.module.js

@@ -1,10 +1,10 @@
-const avatar_sec = "_avatar_sec_wf36a_1";
-const container = "_container_wf36a_9";
-const image = "_image_wf36a_27";
-const text = "_text_wf36a_45";
-const name = "_name_wf36a_57";
-const title = "_title_wf36a_73";
-const description = "_description_wf36a_87";
+const avatar_sec = "_avatar_sec_1bnm9_1";
+const container = "_container_1bnm9_5";
+const image = "_image_1bnm9_14";
+const text = "_text_1bnm9_23";
+const name = "_name_1bnm9_29";
+const title = "_title_1bnm9_37";
+const description = "_description_1bnm9_44";
 const css = {
   avatar_sec,
   container,

package/dist/Blockquote/Blockquote.module.js

@@ -1,6 +1,6 @@
-const quote_spacer = "_quote_spacer_44gig_1";
-const author = "_author_44gig_15";
-const quote = "_quote_44gig_1";
+const quote_spacer = "_quote_spacer_4e152_1";
+const author = "_author_4e152_8";
+const quote = "_quote_4e152_1";
 const css = {
   quote_spacer,
   author,

package/dist/Button/Button.js

@@ -76,6 +76,7 @@ import "../ImageBillboard/ImageBillboard.css.js";
 import "react-wrap-balancer";
 /* empty css                                              */
 /* empty css                                                      */
+/* empty css                                            */
 /* empty css                                    */
 import "../LandingPageHeader/LandingPageHeader.css.js";
 /* empty css                                                      */

package/dist/Calculators/Calculator.js

@@ -64,6 +64,7 @@ import "../Input/DownPaymentInput.js";
 import "react-wrap-balancer";
 /* empty css                                              */
 /* empty css                                                      */
+/* empty css                                            */
 /* empty css                                    */
 import "../LandingPageHeader/LandingPageHeader.css.js";
 import "../LoadingIndicator/LoadingIndicator.css.js";

package/dist/Calculators/MarginTradingCalculator/index.js

@@ -4,7 +4,7 @@ import { Button } from "../../Button/Button.js";
 import { button } from "../../Button/Button.css.js";
 import { useEffect } from "react";
 import "react-use";
-import { container, field_row, marketingTile, bodyContent, header_theme } from "../ApyCalculator/ApyCalculator.css.js";
+import { container, field_row, errorTag, marketingTile, bodyContent, header_theme } from "../ApyCalculator/ApyCalculator.css.js";
 import { Chevron } from "../../Chevron/index.js";
 import { content, headerIconBillboard, buttons } from "../../IconBillboard/IconBillboard.css.js";
 import "../../utils/allowedAxosDomains.js";
@@ -233,7 +233,7 @@ const MarginTradingCalculator = ({
                   step: 1e3,
                   onKeyDown: (event) => {
                     const eventCode = event.code.toLowerCase();
-                    if (!(event.code !== null && (eventCode.includes("digit") || eventCode.includes("arrow") || eventCode.includes("home") || eventCode.includes("end") || eventCode.includes("backspace") || eventCode.includes("period") || eventCode.includes("numpaddecimal") || eventCode.includes("numpad") && eventCode.length === 7))) {
+                    if (!(event.code !== null && (eventCode.includes("digit") || eventCode.includes("arrow") || eventCode.includes("home") || eventCode.includes("end") || eventCode.includes("backspace") || eventCode.includes("period") || eventCode.includes("tab") || eventCode.includes("numpaddecimal") || eventCode.includes("numpad") && eventCode.length === 7))) {
                       event.preventDefault();
                     }
                   }
@@ -256,7 +256,7 @@ const MarginTradingCalculator = ({
                   step: 1e3,
                   onKeyDown: (event) => {
                     const eventCode = event.code.toLowerCase();
-                    if (!(event.code !== null && (eventCode.includes("digit") || eventCode.includes("arrow") || eventCode.includes("home") || eventCode.includes("end") || eventCode.includes("backspace") || eventCode.includes("period") || eventCode.includes("numpaddecimal") || eventCode.includes("numpad") && eventCode.length === 7))) {
+                    if (!(event.code !== null && (eventCode.includes("digit") || eventCode.includes("arrow") || eventCode.includes("home") || eventCode.includes("end") || eventCode.includes("backspace") || eventCode.includes("period") || eventCode.includes("tab") || eventCode.includes("numpaddecimal") || eventCode.includes("numpad") && eventCode.length === 7))) {
                       event.preventDefault();
                     }
                   }
@@ -325,7 +325,7 @@ const MarginTradingCalculator = ({
             /* @__PURE__ */ jsx("sup", { children: "3" })
           ] }),
           /* @__PURE__ */ jsxs("div", { children: [
-            /* @__PURE__ */ jsx("div", { id: "errMsg" }),
+            /* @__PURE__ */ jsx("div", { id: "errMsg", className: `${errorTag}` }),
             /* @__PURE__ */ jsxs("table", { className: `${table} ${r502_fs12}`, children: [
               /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsxs("tr", { children: [
                 /* @__PURE__ */ jsx("th", { className: `ax-th ${tc} ${bb0} ${btl} ${w25}`, children: "Axos Standard" }),

package/dist/Carousel/index.js

@@ -78,6 +78,7 @@ import "../ImageBillboard/ImageBillboard.css.js";
 import "react-wrap-balancer";
 /* empty css                                              */
 /* empty css                                                      */
+/* empty css                                            */
 /* empty css                                    */
 import "../LandingPageHeader/LandingPageHeader.css.js";
 /* empty css                                                      */

package/dist/Chevron/index.js

@@ -78,6 +78,7 @@ import "../ImageBillboard/ImageBillboard.css.js";
 import "react-wrap-balancer";
 /* empty css                                              */
 /* empty css                                                      */
+/* empty css                                            */
 /* empty css                                    */
 import "../LandingPageHeader/LandingPageHeader.css.js";
 /* empty css                                                      */

package/dist/Comparison/Comparison.js

@@ -75,6 +75,7 @@ import "../ImageBillboard/ImageBillboard.css.js";
 import "react-wrap-balancer";
 /* empty css                                              */
 /* empty css                                                      */
+/* empty css                                            */
 /* empty css                                    */
 import "../LandingPageHeader/LandingPageHeader.css.js";
 /* empty css                                */

package/dist/FaqAccordion/index.js

@@ -76,6 +76,7 @@ import "../ImageBillboard/ImageBillboard.css.js";
 import "react-wrap-balancer";
 /* empty css                                              */
 /* empty css                                                      */
+/* empty css                                            */
 /* empty css                                    */
 import "../LandingPageHeader/LandingPageHeader.css.js";
 /* empty css                                */

package/dist/FdicCallout/FdicCallout.module.js

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

package/dist/FooterSiteMap/AxosBank/FooterSiteMap.d.ts

@@ -1 +1,3 @@
-export declare const AxosFooterSiteMap: () => import("react/jsx-runtime").JSX.Element;
+export declare const AxosFooterSiteMap: ({ showButtons, }: {
+    showButtons?: boolean;
+}) => import("react/jsx-runtime").JSX.Element;

package/dist/FooterSiteMap/AxosBank/FooterSiteMap.js

@@ -1,4 +1,4 @@
-import { jsx, jsxs } from "react/jsx-runtime";
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import "../../Accordion/Accordion.js";
 import "../../Accordion/Accordion.css.js";
 import "../../icons/ArrowIcon/ArrowIcon.css.js";
@@ -74,6 +74,7 @@ import "../../ImageBillboard/ImageBillboard.css.js";
 import "react-wrap-balancer";
 /* empty css                                                 */
 /* empty css                                                         */
+/* empty css                                               */
 /* empty css                                       */
 import "../../LandingPageHeader/LandingPageHeader.css.js";
 /* empty css                                                         */
@@ -100,7 +101,9 @@ import "../../StepItemSet/StepItemSet.css.js";
 import "next/script.js";
 /* empty css                                           */
 /* empty css                                                 */
-const AxosFooterSiteMap = () => {
+const AxosFooterSiteMap = ({
+  showButtons = false
+}) => {
   return /* @__PURE__ */ jsx("footer", { className: footer_section, id: "site_map", children: /* @__PURE__ */ jsxs("div", { className: "containment", children: [
     /* @__PURE__ */ jsxs("nav", { className: footer_wrapper, children: [
       /* @__PURE__ */ jsxs("div", { className: ft_col, children: [
@@ -486,42 +489,44 @@ const AxosFooterSiteMap = () => {
       ) }) })
     ] }),
     /* @__PURE__ */ jsxs("div", { className: footer_mobile, children: [
-      /* @__PURE__ */ jsx("h2", { className: "gradient_text text_center", children: "All your finances. In one place." }),
-      /* @__PURE__ */ jsxs("div", { className: "push_up flex center middle gap_24", children: [
-        /* @__PURE__ */ jsx(
-          "a",
-          {
-            href: findMoreAxosDomains(
-              "https://play.google.com/store/apps/details?id=com.axos.udb"
-            ),
-            "aria-label": "visit the Google Play store to download the axos bank mobile app",
-            title: "Google Play",
-            children: /* @__PURE__ */ jsx(
-              "img",
-              {
-                alt: "get it on Google Play",
-                src: "https://images.axos.com/o9ov1v03uwqk/o446Mf5JdBS9RsXaaZYKb/10e6b082f3eeec4ecffc5d9b29ea4954/google-play.svg"
-              }
-            )
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          "a",
-          {
-            href: findMoreAxosDomains(
-              "https://apps.apple.com/us/app/axos-bank/id1396586421"
-            ),
-            "aria-label": "visit the App Store to download the Axos Bank mobile app",
-            title: "App Store",
-            children: /* @__PURE__ */ jsx(
-              "img",
-              {
-                alt: "download on the App Store",
-                src: "https://images.axos.com/o9ov1v03uwqk/6Ja0ODDH2HVdAFBIfQEiuh/d1894874d54c0dced3d7fe879135315a/app-store.svg"
-              }
-            )
-          }
-        )
+      showButtons && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx("h2", { className: "gradient_text text_center", children: "All your finances. In one place." }),
+        /* @__PURE__ */ jsxs("div", { className: "push_up flex center middle gap_24", children: [
+          /* @__PURE__ */ jsx(
+            "a",
+            {
+              href: findMoreAxosDomains(
+                "https://play.google.com/store/apps/details?id=com.axos.udb"
+              ),
+              "aria-label": "visit the Google Play store to download the axos bank mobile app",
+              title: "Google Play",
+              children: /* @__PURE__ */ jsx(
+                "img",
+                {
+                  alt: "get it on Google Play",
+                  src: "https://images.axos.com/o9ov1v03uwqk/o446Mf5JdBS9RsXaaZYKb/10e6b082f3eeec4ecffc5d9b29ea4954/google-play.svg"
+                }
+              )
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "a",
+            {
+              href: findMoreAxosDomains(
+                "https://apps.apple.com/us/app/axos-bank/id1396586421"
+              ),
+              "aria-label": "visit the App Store to download the Axos Bank mobile app",
+              title: "App Store",
+              children: /* @__PURE__ */ jsx(
+                "img",
+                {
+                  alt: "download on the App Store",
+                  src: "https://images.axos.com/o9ov1v03uwqk/6Ja0ODDH2HVdAFBIfQEiuh/d1894874d54c0dced3d7fe879135315a/app-store.svg"
+                }
+              )
+            }
+          )
+        ] })
       ] }),
       /* @__PURE__ */ jsxs("div", { className: ft_panel_group, children: [
         /* @__PURE__ */ jsxs("details", { className: `${ft_panel} push_up_32`, children: [

package/dist/Forms/ContactUsBusiness.js

@@ -78,6 +78,7 @@ import "../ImageBillboard/ImageBillboard.css.js";
 import "react-wrap-balancer";
 /* empty css                                              */
 /* empty css                                                      */
+/* empty css                                            */
 /* empty css                                    */
 import "../LandingPageHeader/LandingPageHeader.css.js";
 /* empty css                                */

package/dist/Forms/ContactUsNMLSId.js

@@ -78,6 +78,7 @@ import "../ImageBillboard/ImageBillboard.css.js";
 import "react-wrap-balancer";
 /* empty css                                              */
 /* empty css                                                      */
+/* empty css                                            */
 /* empty css                                    */
 import "../LandingPageHeader/LandingPageHeader.css.js";
 /* empty css                                */

package/dist/Forms/CpraRequest.js

@@ -30,6 +30,7 @@ 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 = ({
   icon = false,
   children,
@@ -47,8 +48,18 @@ const CpraRequest = ({
     California_Resident: z.string(),
     Categories_of_personal_info: z.string(),
     Pieces_of_personal_information: z.string(),
-    Request_Correction_of_Information: z.string(),
-    Corrected_Information: z.string(),
+    Request_Correction_of_Information: z.string().optional(),
+    Corrected_Information: z.string().optional().refine(
+      (val) => {
+        if (requestCorrectionOfInfo === "Yes" && !val) {
+          return false;
+        }
+        return true;
+      },
+      {
+        message: "Corrected Information is required."
+      }
+    ),
     Delete_personal_info: z.string(),
     Opt_out_of_sale_of_info: z.string(),
     Current_client: z.string(),
@@ -710,6 +721,13 @@ const CpraRequest = ({
       ] }),
       children,
       /* @__PURE__ */ jsx("div", { className: disclosureForm({ variant }), children: disclosure }),
+      /* @__PURE__ */ jsx("div", { className: `${headerContainer}`, children: /* @__PURE__ */ jsxs("div", { className: `${form} ${descriptionField({ variant })}`, children: [
+        "For additional questions or concerns, please",
+        " ",
+        /* @__PURE__ */ jsx("a", { href: findMoreAxosDomains("{ONLINEBANKING}/Messages/Inbox"), children: "log in to online banking" }),
+        " ",
+        "and send us a secure message."
+      ] }) }),
       /* @__PURE__ */ jsx("div", { className: actions, children: /* @__PURE__ */ jsx(
         Button,
         {
@@ -719,6 +737,14 @@ const CpraRequest = ({
           disabled: !isValid || isSubmitting,
           children: callToAction?.displayText
         }
+      ) }),
+      /* @__PURE__ */ jsx("div", { className: `${headerContainer}`, children: /* @__PURE__ */ jsx(
+        "div",
+        {
+          id: "test",
+          className: `${form} ${descriptionField({ variant })}`,
+          children: "* = Required Field"
+        }
       ) })
     ] })
   ] }) }) }, id);

package/dist/Forms/EmailOnly.js

@@ -79,6 +79,7 @@ import "../ImageBillboard/ImageBillboard.css.js";
 import "react-wrap-balancer";
 /* empty css                                              */
 /* empty css                                                      */
+/* empty css                                            */
 /* empty css                                    */
 import "../LandingPageHeader/LandingPageHeader.css.js";
 /* empty css                                */

package/dist/Forms/MortgageRate/MortgageRateForm.js

@@ -78,6 +78,7 @@ import "../../ImageBillboard/ImageBillboard.css.js";
 import "react-wrap-balancer";
 /* empty css                                                 */
 /* empty css                                                         */
+/* empty css                                               */
 /* empty css                                       */
 import "../../LandingPageHeader/LandingPageHeader.css.js";
 import { chevron_wrapper, chevron } from "../../Chevron/Chevron.css.js";
@@ -150,7 +151,7 @@ const MortgageRate = ({
     propertyType: z.number({ message: "Property Type is required." }).positive({ message: "Property Type is required." }),
     occupancy: z.number({ message: "Property Usage is required." }).positive({ message: "Property Usage is required." }),
     salesPrice: z.number({ message: "Purchase Price is required." }).optional().refine((val) => loanPurpose === 1 ? val != null : true, {
-      message: "Sales Price is required for purchase"
+      message: "Sales Price is required."
     }).refine(
       (val) => {
         if (loanPurpose === 1) {
@@ -213,6 +214,15 @@ const MortgageRate = ({
       methods.setValue("downPayment", 0);
     }
   }, [loanPurpose, methods]);
+  useEffect(() => {
+    const urlParams = new URLSearchParams(window.location.search);
+    const mortgageType = urlParams.get("mortgage-type");
+    if (mortgageType === "refinance") {
+      setLoanPurpose(2);
+      setRateType("Refinance");
+      methods.setValue("loanPurpose", 2);
+    }
+  }, [methods]);
   const {
     handleSubmit,
     register,

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

@@ -10,7 +10,20 @@ export type MortgageRateFilterInputs = {
     mortgageBalance: number;
     cashOut: number;
 };
-export declare const MortgageRateFilters: ({ onSubmit, initialLoanPurpose, }: {
-    onSubmit?: ((values: MortgageRateFilterInputs) => void) | undefined;
-    initialLoanPurpose?: number | undefined;
-}) => import("react/jsx-runtime").JSX.Element;
+interface MortgageRateFiltersProps {
+    formData: {
+        loanPurpose: number;
+        propertyType: string;
+        occupancy: string;
+        salesPrice: number;
+        downPayment: number;
+        creditScore: string;
+        zipCode: number;
+        appraisedValue: number;
+        mortgageBalance: number;
+        cashOut: number;
+    };
+    onSubmit: (values: MortgageRateFilterInputs) => void;
+}
+export declare const MortgageRateFilters: ({ formData, onSubmit, }: MortgageRateFiltersProps) => import("react/jsx-runtime").JSX.Element;
+export {};