@axos-web-dev/shared-components 0.0.74 → 0.0.76

package/dist/ApyCalculator/index.js

@@ -1,14 +1,21 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { Button } from "../Button/Button.js";
 import { button } from "../Button/Button.css.js";
 import { useState, useCallback, useEffect } from "react";
+import { container, apy_calculator, calculator_section, section_header, header_theme, mt_8, apy_calculator_form, pis_0, errorTag, fieldset, field_row, relative, label_symbol, cash, prefix_pad, percent, submit_section, span_12, form_disclosure, marketing, marketingTile, bodyContent } from "./ApyCalculator.css.js";
+import { Button } from "../Button/Button.js";
 import "react-use";
-import { vars } from "../themes/axos.css.js";
-/* empty css                                */
-/* empty css                                   */
-import { apy_calculator, calculator_section, section_header, apy_calculator_form, errorTag, fieldset, field_row, relative, label_symbol, cash, prefix_pad, percent, submit_section, span_12, form_disclosure, marketing, marketing_tile, cta_section, marketing_table } from "./ApyCalculator.css.js";
-const ApyCalculator = ({ header }) => {
+import { getVariant } from "../utils/getVariant.js";
+import { Chevron } from "../Chevron/index.js";
+import { section_container, content, headerIconBillboard, buttons } from "../IconBillboard/IconBillboard.css.js";
+const ApyCalculator = ({
+  header,
+  body,
+  marketingTiles,
+  disclosure,
+  variant
+}) => {
+  const calculator_variant = getVariant(variant);
   const [initialDeposit, setInititalDeposit] = useState(1e3);
   const [APR, setAPR] = useState(2.32);
   const [APY, setAPY] = useState(2.35);
@@ -16,12 +23,12 @@ const ApyCalculator = ({ header }) => {
   const [compounding, setCompounding] = useState(360);
   const [monthlyDeposits, setMonthlyDeposits] = useState(100);
   const [endingBalance, setEndingBalance] = useState("");
-  const [error, setError] = useState("");
+  const [errors, setErrors] = useState([]);
   const [interestRate, setInterestRate] = useState(0);
   const isValidNumber = (input) => {
     if (typeof input !== "number") {
       return false;
-    } else if (input < 0) {
+    } else if (input < 0 || Number.isNaN(input)) {
       return false;
     } else
       return true;
@@ -29,7 +36,7 @@ const ApyCalculator = ({ header }) => {
   const isValidAPY = (input) => {
     if (typeof input !== "number") {
       return false;
-    } else if (input <= 0) {
+    } else if (input <= 0 || Number.isNaN(input)) {
       return false;
     } else
       return true;
@@ -43,9 +50,27 @@ const ApyCalculator = ({ header }) => {
   }, [convertInterest, interestRate, setInterestRate]);
   const handleCalculate = () => {
     convertInterest();
-    if (!isValidNumber(initialDeposit) || !isValidNumber(months) || !isValidNumber(monthlyDeposits) || !isValidAPY(APY) || !isValidAPY(APR)) {
-      setError("Invalid input. Please enter positive numeric values.");
+    let newErrors = [];
+    if (!isValidNumber(initialDeposit)) {
+      newErrors.push("Initial Deposit must be a positive number.");
+    }
+    if (!isValidNumber(months)) {
+      newErrors.push("Months must be a positive number.");
+    }
+    if (!isValidNumber(monthlyDeposits)) {
+      newErrors.push("Monthly Deposits must be a positive number.");
+    }
+    if (!isValidAPY(APY)) {
+      newErrors.push("APY must be a positive number.");
+    }
+    if (!isValidAPY(APR)) {
+      newErrors.push("APR must be a positive number.");
+    }
+    if (newErrors.length > 0) {
+      setErrors(newErrors);
     } else {
+      newErrors = [];
+      setErrors([]);
       let total;
       if (compounding === 360) {
         total = initialDeposit * Math.pow(1 + interestRate / compounding, 30 * months) + monthlyDeposits / (interestRate / 12) * (Math.pow(1 + interestRate / compounding, 30 * months) - 1);
@@ -88,20 +113,21 @@ const ApyCalculator = ({ header }) => {
   return /* @__PURE__ */ jsx(
     "section",
     {
-      className: `section_spacer`,
-      style: {
-        background: vars.colors.secondary.background,
-        color: "black",
-        paddingBlock: "42px"
-      },
+      className: `section_spacer ${container({ variant: getVariant(variant) })}`,
       children: /* @__PURE__ */ jsxs("div", { className: `${apy_calculator} containment flex between`, children: [
         /* @__PURE__ */ jsxs("div", { className: `${calculator_section}`, children: [
-          /* @__PURE__ */ jsxs("div", { className: `${section_header}`, children: [
-            /* @__PURE__ */ jsx("h1", { className: "header_1", children: header }),
-            /* @__PURE__ */ jsx("p", { className: "push_up", children: "Calculate how much interest you can earn on your money with our APY Interest Calculator." })
+          (header || body) && /* @__PURE__ */ jsxs("div", { className: `${section_header}`, children: [
+            header && /* @__PURE__ */ jsx(
+              "h2",
+              {
+                className: `header_2 ${header_theme({ variant: calculator_variant })}`,
+                children: header
+              }
+            ),
+            body && /* @__PURE__ */ jsx("div", { className: mt_8, children: body })
           ] }),
           /* @__PURE__ */ jsxs("form", { id: "calculator_form", className: `${apy_calculator_form}`, children: [
-            /* @__PURE__ */ jsx("div", { id: "errmsgbox", className: " flex middle", children: /* @__PURE__ */ jsx("span", { className: `${errorTag}`, children: error }) }),
+            /* @__PURE__ */ jsx("div", { id: "errmsgbox", className: " flex middle", children: errors.length > 0 && /* @__PURE__ */ jsx("ul", { className: pis_0, children: errors.map((error, index) => /* @__PURE__ */ jsx("li", { className: `${errorTag}`, children: error }, index)) }) }),
             /* @__PURE__ */ jsxs("div", { className: `${fieldset}`, children: [
               /* @__PURE__ */ jsxs("div", { className: `${field_row} ${relative} flex flex_col`, children: [
                 /* @__PURE__ */ jsx("label", { className: "input_label", htmlFor: "initDeposit", children: "Initial Deposit" }),
@@ -109,13 +135,13 @@ const ApyCalculator = ({ header }) => {
                 /* @__PURE__ */ jsx(
                   "input",
                   {
-                    className: `${prefix_pad}`,
+                    className: `${prefix_pad} bordered`,
                     id: "initDeposit",
                     type: "number",
                     step: 100,
                     name: "initDeposit",
                     value: initialDeposit,
-                    onChange: (e) => setInititalDeposit(Number(e.target.value))
+                    onChange: (e) => setInititalDeposit(parseInt(e.target.value))
                   }
                 )
               ] }),
@@ -125,13 +151,13 @@ const ApyCalculator = ({ header }) => {
                 /* @__PURE__ */ jsx(
                   "input",
                   {
-                    className: `${prefix_pad}`,
+                    className: `${prefix_pad} bordered`,
                     id: "apr",
                     type: "number",
                     step: 0.01,
                     name: "apr",
                     value: APR,
-                    onChange: (e) => updateAPR(Number(e.target.value))
+                    onChange: (e) => updateAPR(parseFloat(e.target.value))
                   }
                 )
               ] }),
@@ -141,13 +167,13 @@ const ApyCalculator = ({ header }) => {
                 /* @__PURE__ */ jsx(
                   "input",
                   {
-                    className: `${prefix_pad}`,
+                    className: `${prefix_pad} bordered`,
                     id: "apy",
                     type: "number",
                     step: 0.01,
                     name: "apy",
                     value: APY,
-                    onChange: (e) => updateAPY(Number(e.target.value))
+                    onChange: (e) => updateAPY(parseFloat(e.target.value))
                   }
                 )
               ] }),
@@ -156,13 +182,14 @@ const ApyCalculator = ({ header }) => {
                 /* @__PURE__ */ jsx(
                   "input",
                   {
-                    className: `${prefix_pad}`,
+                    className: `${prefix_pad} bordered`,
                     id: "months",
+                    min: 1,
                     maxLength: 4,
                     type: "number",
                     name: "months",
                     value: months,
-                    onChange: (e) => setMonths(Number(e.target.value))
+                    onChange: (e) => setMonths(parseInt(e.target.value))
                   }
                 )
               ] }),
@@ -171,7 +198,7 @@ const ApyCalculator = ({ header }) => {
                 /* @__PURE__ */ jsxs(
                   "select",
                   {
-                    className: `${prefix_pad}`,
+                    className: `${prefix_pad} bordered`,
                     id: "compounding",
                     name: "compounding",
                     value: compounding,
@@ -192,13 +219,13 @@ const ApyCalculator = ({ header }) => {
                 /* @__PURE__ */ jsx(
                   "input",
                   {
-                    className: `${prefix_pad}`,
+                    className: `${prefix_pad} bordered`,
                     id: "monthlyDeposits",
                     maxLength: 25,
                     type: "number",
                     value: monthlyDeposits,
                     name: "monthlyDeposits",
-                    onChange: (e) => setMonthlyDeposits(Number(e.target.value))
+                    onChange: (e) => setMonthlyDeposits(parseInt(e.target.value))
                   }
                 )
               ] }),
@@ -207,7 +234,7 @@ const ApyCalculator = ({ header }) => {
                 /* @__PURE__ */ jsx(
                   "input",
                   {
-                    className: `${prefix_pad}`,
+                    className: `${prefix_pad} bordered`,
                     id: "endBal",
                     maxLength: 30,
                     type: "string",
@@ -224,7 +251,7 @@ const ApyCalculator = ({ header }) => {
                   children: /* @__PURE__ */ jsx(
                     "input",
                     {
-                      className: `${button({ color: "secondary", size: "medium", rounded: "medium" })} center`,
+                      className: `${button({ color: "primary", size: "medium", rounded: "medium" })} center`,
                       type: "button",
                       value: "Calculate",
                       onClick: handleCalculate
@@ -232,66 +259,58 @@ const ApyCalculator = ({ header }) => {
                   )
                 }
               ),
-              /* @__PURE__ */ jsx("div", { className: `${form_disclosure} push_up_24`, children: /* @__PURE__ */ jsxs("p", { children: [
-                /* @__PURE__ */ jsx("strong", { children: "NOTE:" }),
-                " Our APY Interest Calculator is an educational tool to help you determine potential earnings. Your calculator results are estimates and do not guarantee cost savings or tax benefits. Axos Bank does not guarantee your results as determined by using this calculator."
-              ] }) })
+              disclosure && /* @__PURE__ */ jsx("div", { className: `${form_disclosure} push_up_24`, children: disclosure })
             ] })
           ] })
         ] }),
-        /* @__PURE__ */ jsxs("div", { className: `${marketing} section_spacer`, children: [
-          /* @__PURE__ */ jsxs("div", { className: "flex flex_col", children: [
-            /* @__PURE__ */ jsxs(
-              "div",
-              {
-                className: `${marketing_tile} rounded framed flex flex_col between ${span_12}`,
-                style: { backgroundColor: "#efeef0", maxWidth: "520px" },
-                children: [
-                  /* @__PURE__ */ jsx("h2", { className: "header_2", children: "Select Savings" }),
-                  /* @__PURE__ */ jsx("div", { className: "push_up mb_0", children: "Zero fees. Up to 0.20% APY*. Complimentary ATM card. Select Savings helps your clients bank smarter with an account that rewards their savvy money habits." }),
-                  /* @__PURE__ */ jsx("div", { className: `${cta_section} push_up_24 flex flex_row center`, children: /* @__PURE__ */ jsx(
+        /* @__PURE__ */ jsx("div", { className: `${marketing} ${section_container}`, children: marketingTiles && marketingTiles?.map(
+          ({ id, headline, bodyCopy, callToActionRow }) => /* @__PURE__ */ jsxs(
+            "div",
+            {
+              className: `${container({ variant: getVariant(variant) })} ${marketingTile} rounded bordered`,
+              children: [
+                /* @__PURE__ */ jsx("div", { className: `${content} ${bodyContent}`, children: /* @__PURE__ */ jsxs("div", { className: headerIconBillboard, children: [
+                  /* @__PURE__ */ jsx(
+                    "div",
+                    {
+                      className: `header_3 ${header_theme({ variant: calculator_variant })}`,
+                      children: headline
+                    }
+                  ),
+                  /* @__PURE__ */ jsx("div", { children: bodyCopy })
+                ] }) }),
+                callToActionRow && /* @__PURE__ */ jsx("div", { className: `${buttons} middle`, children: callToActionRow.map(
+                  ({
+                    id: id2,
+                    variant: variant2,
+                    displayText,
+                    targetUrl,
+                    type
+                  }) => type === "Button" ? /* @__PURE__ */ jsx(
                     Button,
                     {
-                      id: "btn-savings",
-                      targetUrl: "/products/select-savings",
-                      color: "secondary",
+                      targetUrl,
+                      color: getVariant(variant2),
                       size: "medium",
                       rounded: "medium",
-                      children: "Learn More"
-                    }
-                  ) })
-                ]
-              }
-            ),
-            /* @__PURE__ */ jsx(
-              "section",
-              {
-                className: `${marketing_tile} section_spacer framed rounded`,
-                id: "table",
-                children: /* @__PURE__ */ jsxs("div", { children: [
-                  /* @__PURE__ */ jsx("h2", { className: "header_2", children: "Recommended Accounts" }),
-                  /* @__PURE__ */ jsxs("table", { className: `${marketing_table}`, children: [
-                    /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsxs("tr", { children: [
-                      /* @__PURE__ */ jsx("th", { style: { width: "50%" }, scope: "col slate", children: "Account" }),
-                      /* @__PURE__ */ jsx("th", { style: { width: "50%" }, scope: "col slate", children: "APY*" })
-                    ] }) }),
-                    /* @__PURE__ */ jsxs("tbody", { children: [
-                      /* @__PURE__ */ jsxs("tr", { children: [
-                        /* @__PURE__ */ jsx("td", { "aria-label": "Select Checking", children: /* @__PURE__ */ jsx("a", { className: "link", href: "/products/select-savings", children: "Select Savings" }) }),
-                        /* @__PURE__ */ jsx("td", { "aria-label": "Up to 5.25%", children: "Up to 0.20%" })
-                      ] }),
-                      /* @__PURE__ */ jsxs("tr", { children: [
-                        /* @__PURE__ */ jsx("td", { "aria-label": "Select Checking", children: /* @__PURE__ */ jsx("a", { className: "link", href: "/products/select-checking", children: "Select Checking" }) }),
-                        /* @__PURE__ */ jsx("td", { "aria-label": "Up to 5.25%", children: "Up to 0.10%" })
-                      ] })
-                    ] })
-                  ] })
-                ] })
-              }
-            )
-          ] }),
-          /* @__PURE__ */ jsx("div", {})
-        ] })
+                      children: displayText
+                    },
+                    id2
+                  ) : /* @__PURE__ */ jsx(
+                    Chevron,
+                    {
+                      targetUrl,
+                      variant: getVariant(variant2),
+                      children: displayText
+                    },
+                    id2
+                  )
+                ) })
+              ]
+            },
+            id
+          )
+        ) })
       ] })
     }
   );

package/dist/Calculators/Calculator.d.ts

@@ -1,4 +1,5 @@
 import { default as React } from 'react';
+import { IconBillboardProps } from '../IconBillboard/IconBillboard.interface';
 
 export interface CalculatorProps {
     id?: string;
@@ -9,5 +10,6 @@ export interface CalculatorProps {
     headline?: React.ReactNode;
     bodyCopy?: React.ReactNode;
     disclosure?: React.ReactNode;
+    marketingTiles?: IconBillboardProps[];
 }
 export declare const Calculator: (props: CalculatorProps) => import("react/jsx-runtime").JSX.Element;

package/dist/Calculators/Calculator.js

@@ -31,7 +31,7 @@ import "../Accordion/Accordion.js";
 import "../Accordion/Accordion.css.js";
 import "../Chevron/Chevron.css.js";
 import "../AlertBanner/AlertBanner.css.js";
-/* empty css                                                */
+import { ApyCalculator } from "../ApyCalculator/index.js";
 import "../Article/Article.css.js";
 import "../ArticlesSet/ArticlesSet.css.js";
 /* empty css                                              */
@@ -81,8 +81,18 @@ import "next/script.js";
 import "../Input/RadioButton.js";
 import { iframeResizer } from "iframe-resizer";
 import { calculators } from "./calculators.js";
+import { MonthlyPaymentCalculator } from "../MonthlyPaymentCalculator/index.js";
+import { AnnualFeeCalculator } from "../AnnualFeeCalculator/index.js";
 const Calculator = (props) => {
-  const { id, bodyCopy, icon = false, disclosure, headline, name } = props;
+  const {
+    id,
+    bodyCopy,
+    icon = false,
+    disclosure,
+    headline,
+    name,
+    marketingTiles
+  } = props;
   const ref = useRef(null);
   const iframe = calculators.get(name || "");
   useEffect(() => {
@@ -91,39 +101,70 @@ const Calculator = (props) => {
     }
   }, []);
   const variant = getVariant(props.variant);
-  return /* @__PURE__ */ jsx("section", { id, className: "", children: /* @__PURE__ */ jsxs("div", { className: clsx("containment"), children: [
-    /* @__PURE__ */ jsxs("div", { children: [
-      icon && /* @__PURE__ */ jsx("div", { className: clsx("text_center", iconForm), children: ["primary", "secondary"].includes(variant) ? /* @__PURE__ */ jsx(SvgComponent, {}) : /* @__PURE__ */ jsx(SvgAxosX, {}) }),
-      /* @__PURE__ */ jsx(
-        "h2",
-        {
-          className: clsx(
-            "header_2 text_center",
-            calculator_headline({ variant })
-          ),
-          children: headline
-        }
-      ),
-      /* @__PURE__ */ jsx("div", { className: clsx(calculator_description({ variant })), children: bodyCopy })
-    ] }),
-    /* @__PURE__ */ jsx("div", { className: "calc section-narrow", children: /* @__PURE__ */ jsx(
-      "iframe",
+  if (name === "APY Calculator") {
+    return /* @__PURE__ */ jsx(
+      ApyCalculator,
+      {
+        header: headline,
+        body: bodyCopy,
+        marketingTiles,
+        variant,
+        disclosure
+      }
+    );
+  } else if (name === "Monthly Payment Calculator") {
+    return /* @__PURE__ */ jsx(
+      MonthlyPaymentCalculator,
       {
-        ref,
-        style: {
-          width: "100%",
-          maxWidth: "100%",
-          minHeight: "clamp(1100px, 200vh)"
-        },
-        scrolling: "no",
-        frameBorder: "0",
-        className: "iframe-calculator",
-        allow: "from",
-        src: iframe?.src
+        header: headline,
+        body: bodyCopy,
+        variant
       }
-    ) }),
-    /* @__PURE__ */ jsx("div", { className: clsx(calculator_description({ variant })), children: disclosure })
-  ] }) });
+    );
+  } else if (name === "Annual Fee Calculator") {
+    return /* @__PURE__ */ jsx(
+      AnnualFeeCalculator,
+      {
+        header: headline,
+        body: bodyCopy,
+        marketingTiles,
+        variant
+      }
+    );
+  } else
+    return /* @__PURE__ */ jsx("section", { id, className: "", children: /* @__PURE__ */ jsxs("div", { className: clsx("containment"), children: [
+      /* @__PURE__ */ jsxs("div", { children: [
+        icon && /* @__PURE__ */ jsx("div", { className: clsx("text_center", iconForm), children: ["primary", "secondary"].includes(variant) ? /* @__PURE__ */ jsx(SvgComponent, {}) : /* @__PURE__ */ jsx(SvgAxosX, {}) }),
+        /* @__PURE__ */ jsx(
+          "h2",
+          {
+            className: clsx(
+              "header_2 text_center",
+              calculator_headline({ variant })
+            ),
+            children: headline
+          }
+        ),
+        /* @__PURE__ */ jsx("div", { className: clsx(calculator_description({ variant })), children: bodyCopy })
+      ] }),
+      /* @__PURE__ */ jsx("div", { className: "calc section-narrow", children: /* @__PURE__ */ jsx(
+        "iframe",
+        {
+          ref,
+          style: {
+            width: "100%",
+            maxWidth: "100%",
+            minHeight: "clamp(1100px, 200vh)"
+          },
+          scrolling: "no",
+          frameBorder: "0",
+          className: "iframe-calculator",
+          allow: "from",
+          src: iframe?.src
+        }
+      ) }),
+      /* @__PURE__ */ jsx("div", { className: clsx(calculator_description({ variant })), children: disclosure })
+    ] }) });
 };
 export {
   Calculator

package/dist/Carousel/index.js

@@ -16,12 +16,12 @@ import { getVariant } from "../utils/getVariant.js";
 import "../Accordion/Accordion.js";
 import "../Accordion/Accordion.css.js";
 import "../AlertBanner/AlertBanner.css.js";
+import "../Button/Button.css.js";
+import React, { useEffect, Children, cloneElement } from "react";
+import "../ApyCalculator/ApyCalculator.css.js";
 import "../Modal/contextApi/store.js";
 import clsx from "clsx";
-import React, { useEffect, Children, cloneElement } from "react";
-import "../Button/Button.css.js";
 import "react-use";
-/* empty css                                                */
 import "../Article/Article.css.js";
 import "../ArticlesSet/ArticlesSet.css.js";
 /* empty css                                              */
@@ -42,6 +42,8 @@ import "../LoadingIndicator/LoadingIndicator.css.js";
 import "../Input/RadioButton.js";
 import "iframe-resizer";
 import "../Calculators/calculator.css.js";
+import "../MonthlyPaymentCalculator/MonthlyPaymentCalculator.css.js";
+import "../AnnualFeeCalculator/AnnualFeeCalculator.css.js";
 /* empty css                                                    */
 /* empty css                                                                    */
 import "../Comparison/Comparison.css.js";

package/dist/Chevron/index.js

@@ -9,21 +9,21 @@ import "../icons/CheckIcon/CheckIcon.css.js";
 import "../Accordion/Accordion.js";
 import "../Accordion/Accordion.css.js";
 import "../AlertBanner/AlertBanner.css.js";
+import "../Button/Button.css.js";
+import "react";
+import "../ApyCalculator/ApyCalculator.css.js";
 import { useGlobalContext } from "../Modal/contextApi/store.js";
 import { findMoreAxosDomains } from "../utils/allowedAxosDomains.js";
 import { getVariant } from "../utils/getVariant.js";
 import { validateLink } from "../utils/validateExternalLinks.js";
 import "clsx";
-import "react";
-import "../Button/Button.css.js";
 import "react-use";
-/* empty css                                                */
+import "../IconBillboard/IconBillboard.css.js";
 import "../Article/Article.css.js";
 import "../ArticlesSet/ArticlesSet.css.js";
 /* empty css                                              */
 /* empty css                                          */
 /* empty css                                          */
-import "../IconBillboard/IconBillboard.css.js";
 /* empty css                                          */
 import "@hookform/resolvers/zod";
 import "../Input/Checkbox.js";
@@ -41,6 +41,8 @@ import "../LoadingIndicator/LoadingIndicator.css.js";
 import "../Input/RadioButton.js";
 import "iframe-resizer";
 import "../Calculators/calculator.css.js";
+import "../MonthlyPaymentCalculator/MonthlyPaymentCalculator.css.js";
+import "../AnnualFeeCalculator/AnnualFeeCalculator.css.js";
 /* empty css                                                    */
 import "../Carousel/index.js";
 /* empty css                                                                    */

package/dist/Comparison/Comparison.js

@@ -18,7 +18,7 @@ import "../icons/CheckIcon/CheckIcon.css.js";
 /* empty css                                                    */
 /* empty css                                                */
 import "../AlertBanner/AlertBanner.css.js";
-/* empty css                                                */
+import "../ApyCalculator/ApyCalculator.css.js";
 import "../Article/Article.css.js";
 import "../ArticlesSet/ArticlesSet.css.js";
 /* empty css                                              */
@@ -40,6 +40,8 @@ import "../LoadingIndicator/LoadingIndicator.css.js";
 import "../Input/RadioButton.js";
 import "iframe-resizer";
 import "../Calculators/calculator.css.js";
+import "../MonthlyPaymentCalculator/MonthlyPaymentCalculator.css.js";
+import "../AnnualFeeCalculator/AnnualFeeCalculator.css.js";
 /* empty css                                                    */
 import "../Carousel/index.js";
 /* empty css                                                                    */

package/dist/Comparison/ComparisonSet.js

@@ -11,17 +11,17 @@ import "../icons/CheckIcon/CheckIcon.css.js";
 /* empty css                                                    */
 /* empty css                                                */
 import "../AlertBanner/AlertBanner.css.js";
-import { Button } from "../Button/Button.js";
 import "../Button/Button.css.js";
+import "../ApyCalculator/ApyCalculator.css.js";
+import { Button } from "../Button/Button.js";
 import "react-use";
-/* empty css                                                */
 import { getVariant } from "../utils/getVariant.js";
+import { buttons } from "../IconBillboard/IconBillboard.css.js";
 import "../Article/Article.css.js";
 import "../ArticlesSet/ArticlesSet.css.js";
 /* empty css                                              */
 /* empty css                                          */
 /* empty css                                          */
-import { buttons } from "../IconBillboard/IconBillboard.css.js";
 /* empty css                                          */
 import "@hookform/resolvers/zod";
 import "../Input/Checkbox.js";
@@ -40,6 +40,8 @@ import "../LoadingIndicator/LoadingIndicator.css.js";
 import "../Input/RadioButton.js";
 import "iframe-resizer";
 import "../Calculators/calculator.css.js";
+import "../MonthlyPaymentCalculator/MonthlyPaymentCalculator.css.js";
+import "../AnnualFeeCalculator/AnnualFeeCalculator.css.js";
 /* empty css                                                    */
 import "../Carousel/index.js";
 /* empty css                                                                    */

package/dist/FooterSiteMap/AxosBank/FooterSiteMap.js

@@ -9,19 +9,19 @@ import "../../icons/CheckIcon/CheckIcon.css.js";
 /* empty css                                                   */
 import "../../Chevron/Chevron.css.js";
 import "../../AlertBanner/AlertBanner.css.js";
+import "../../Button/Button.css.js";
+import "react";
+import "../../ApyCalculator/ApyCalculator.css.js";
 import "../../Modal/contextApi/store.js";
 import { findMoreAxosDomains } from "../../utils/allowedAxosDomains.js";
 import "clsx";
-import "react";
-import "../../Button/Button.css.js";
 import "react-use";
-/* empty css                                                   */
+import "../../IconBillboard/IconBillboard.css.js";
 import "../../Article/Article.css.js";
 import "../../ArticlesSet/ArticlesSet.css.js";
 /* empty css                                                 */
 /* empty css                                             */
 /* empty css                                             */
-import "../../IconBillboard/IconBillboard.css.js";
 /* empty css                                             */
 import "@hookform/resolvers/zod";
 import "../../Input/Checkbox.js";
@@ -39,6 +39,8 @@ import "../../LoadingIndicator/LoadingIndicator.css.js";
 import "../../Input/RadioButton.js";
 import "iframe-resizer";
 import "../../Calculators/calculator.css.js";
+import "../../MonthlyPaymentCalculator/MonthlyPaymentCalculator.css.js";
+import "../../AnnualFeeCalculator/AnnualFeeCalculator.css.js";
 /* empty css                                                       */
 import "../../Carousel/index.js";
 /* empty css                                                                       */

package/dist/Forms/ContactUsAAS.js

@@ -23,16 +23,16 @@ import "../Accordion/Accordion.css.js";
 import { getVariant } from "../utils/getVariant.js";
 import "../Chevron/Chevron.css.js";
 import "../AlertBanner/AlertBanner.css.js";
-import { Button } from "../Button/Button.js";
 import "../Button/Button.css.js";
 import "react";
+import "../ApyCalculator/ApyCalculator.css.js";
+import { Button } from "../Button/Button.js";
 import "react-use";
-/* empty css                                                */
+import "../IconBillboard/IconBillboard.css.js";
 import "../Article/Article.css.js";
 import "../ArticlesSet/ArticlesSet.css.js";
 /* empty css                                              */
 /* empty css                                          */
-import "../IconBillboard/IconBillboard.css.js";
 /* empty css                                          */
 import clsx from "clsx";
 import { useForm, FormProvider } from "react-hook-form";
@@ -43,6 +43,8 @@ import { LoadingIndicator } from "../LoadingIndicator/index.js";
 import "../Input/RadioButton.js";
 import "iframe-resizer";
 import "../Calculators/calculator.css.js";
+import "../MonthlyPaymentCalculator/MonthlyPaymentCalculator.css.js";
+import "../AnnualFeeCalculator/AnnualFeeCalculator.css.js";
 /* empty css                                                    */
 import "../Carousel/index.js";
 /* empty css                                                                    */