@axos-web-dev/shared-components 1.0.99-dev.2 → 1.0.99-dev.21

package/dist/Calculators/Calculator.js

@@ -7,7 +7,7 @@ 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                                */
+import '../assets/Forms/QuickPricer/UserInformation.css';import '../assets/Forms/QuickPricer/QuickPricerResults.css';import '../assets/VideoWrapper/VideoWrapper.css';import '../assets/TopicalNavSet/TopicalNavSet.css';import '../assets/TopicalNavItem/TopicalNavItem.css';import '../assets/Topic/Topic.css';import '../assets/TextBlock/TextBlock.css';import '../assets/SocialMediaBar/SocialMediaBar.css';import '../assets/SecondaryFooter/SecondaryFooter.css';import '../assets/Pagination/Pagination.css';import '../assets/PageNavSet/PageNavigationSet.css';import '../assets/NavigationMenu/LaVictoire/NavBar.css';import '../assets/NavigationMenu/AxosALTS/NavBar.css';import '../assets/NavigationMenu/AxosClearing/NavBar.css';import '../assets/NavigationMenu/AxosBank/SubNavbar.css';import '../assets/NavigationMenu/AxosBank/NavBar.css';import '../assets/NavigationMenu/AxosAdvisorServices/SubNavbar.css';import '../assets/NavigationMenu/AxosAdvisorServices/NavBar.css';import '../assets/NavigationMenu/AxosAdvisor/SubNavbar.css';import '../assets/NavigationMenu/AxosAdvisor/NavBar.css';import '../assets/Insight/Insight.css';import '../assets/Insight/Featured/Header.css';import '../assets/Insight/Featured/CategorySelector.css';import '../assets/Insight/Featured/Featured.css';import '../assets/ImageLink/ImageLink.css';import '../assets/VideoTile/VideoTile.css';import '../assets/HelpArticle/HelpArticle.css';import '../assets/FooterSiteMap/AxosBank/FooterSiteMap.css';import '../assets/FooterDisclosure/LVF/LaVictorieFooter.css';import '../assets/DownloadTile/DownloadTile.css';import '../assets/CollectInformationAlert/CollectInformationAlert.css';import '../assets/CallToActionBar/CallToActionBar.css';import '../assets/AwardsItem/AwardsItem.css';import '../assets/AwardsBanner/AwardsBanner.css';import '../assets/Auth/SignIn.css';import '../assets/Auth/ErrorAlert.css';import '../assets/Modal/Modal.css';import '../assets/BulletItem/BulletItem.css';import '../assets/Typography/Typography.css';import '../assets/icons/FollowIcon/FollowIcon.css';import '../assets/icons/DownloadIcon/DownloadIcon.css';import '../assets/themes/victorie.css';import '../assets/themes/premier.css';import '../assets/themes/axos.css';/* empty css                                */
 /* empty css                                   */
 /* empty css                                    */
 /* empty css                                                    */
@@ -38,13 +38,14 @@ import { AnnualFeeCalculator } from "./AnnualFeeCalculator/index.js";
 import { ApyCalculator } from "./ApyCalculator/index.js";
 import { AxosOneCalculator } from "./AxosOneCalculator/index.js";
 import { BalanceAPYCalculator } from "./BalanceAPYCalculator/index.js";
+import { BuyDownCalculator } from "./BuyDownCalculator/index.js";
 import { calculator_headline, calculator_description } from "./calculator.css.js";
 import { MarginTradingCalculator } from "./MarginTradingCalculator/index.js";
+import { MarineLoanMonthlyPaymentCalculator } from "./MarineLoanMonthlyPaymentCalculator/index.js";
 import { MaxLoanCalculator } from "./MaxLoanCalculator/index.js";
 import { MonthlyPaymentCalculator } from "./MonthlyPaymentCalculator/index.js";
 import { MonthlyPaymentLVFCalculator } from "./MonthlyPaymentLVFCalculator/index.js";
 import { SummitApyCalculator } from "./SummitApyCalculator/index.js";
-import { BuyDownCalculator } from "./BuyDownCalculator/index.js";
 /* empty css                                                    */
 import "../Carousel/index.js";
 /* empty css                                                                    */
@@ -118,6 +119,7 @@ import "../Table/Table.css.js";
 import "../Interstitial/Interstitial-variants.css.js";
 import "../Button/Button.css.js";
 import { iconForm } from "../Forms/Forms.css.js";
+import "../Forms/HoneyPot/index.js";
 import "../Forms/SalesforceFieldsForm.js";
 import "../Input/RadioButton.css.js";
 import "../Input/Checkbox.css.js";
@@ -134,7 +136,9 @@ const Calculator = (props) => {
     disclosure,
     headline,
     name,
-    marketingTiles
+    marketingTiles,
+    callToActionRow,
+    initialBalance
   } = props;
   const ref = useRef(null);
   const iframe = calculators.get(name || "");
@@ -225,7 +229,9 @@ const Calculator = (props) => {
         bodyCopy,
         variant,
         disclosure,
-        icon
+        icon,
+        callToActionRow,
+        initialBalance
       }
     );
   } else if (name === "APY Balance Summit Savings") {
@@ -249,7 +255,17 @@ const Calculator = (props) => {
         disclosure
       }
     );
-  } else
+  } else if (name === "Marine Loan Monthly Payment Calculator") {
+    return /* @__PURE__ */ jsx(
+      MarineLoanMonthlyPaymentCalculator,
+      {
+        header: headline,
+        bodyCopy,
+        variant,
+        disclosure
+      }
+    );
+  } else {
     return /* @__PURE__ */ jsx("section", { id, 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, {}) }),
@@ -283,6 +299,7 @@ const Calculator = (props) => {
       ) }),
       /* @__PURE__ */ jsx("div", { className: clsx(calculator_description({ variant })), children: disclosure })
     ] }) });
+  }
 };
 export {
   Calculator

package/dist/Calculators/MarginTradingCalculator/MarginTradingCalculator.css.js

@@ -1,4 +1,4 @@
-/* empty css                                           */
+import '../../assets/Calculators/MarginTradingCalculator/MarginTradingCalculator.css';/* empty css                                           */
 var w100 = "_1mgfcbj0";
 var w50 = "_1mgfcbj1";
 var g24 = "_1mgfcbj2";

package/dist/Calculators/MarginTradingCalculator/index.js

@@ -74,8 +74,8 @@ const MarginTradingCalculator = ({
         4: { axs: 12.5, axe: 12, td: 12.125, et: 13.2 },
         5: { axs: 12, axe: 11.5, td: 12.075, et: 12.7 },
         6: { axs: 12, axe: 11.5, td: 12.75, et: 12.2 },
-        7: { axs: 11.5, axe: 11, td: "N/A", et: "N/A" },
-        8: { axs: 11, axe: 10.75, td: "N/A", et: "N/A" }
+        7: { axs: 11.5, axe: 11 },
+        8: { axs: 11, axe: 10.75 }
       };
       if (cashVal && secVal && axsCell && axeCell && tdCell && etCell && duration) {
         const totalValue = Number(cashVal.value) + Number(secVal.value);

package/dist/Calculators/MarineLoanMonthlyPaymentCalculator/index.d.ts

@@ -0,0 +1,9 @@
+import { default as React, FC } from 'react';
+
+export interface MarineLoanMonthlyPaymentCalculatorProps {
+    header?: React.ReactNode | string;
+    bodyCopy?: React.ReactNode | string;
+    variant?: string;
+    disclosure?: React.ReactNode;
+}
+export declare const MarineLoanMonthlyPaymentCalculator: FC<MarineLoanMonthlyPaymentCalculatorProps>;

package/dist/Calculators/MarineLoanMonthlyPaymentCalculator/index.js

@@ -0,0 +1,219 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { button } from "../../Button/Button.css.js";
+import { title } from "../../IconBillboard/IconBillboard.css.js";
+import "../../utils/allowedAxosDomains.js";
+import { getVariant } from "../../utils/getVariant.js";
+import clsx from "clsx";
+import { useState } from "react";
+import { calc_text, description_text, calc_disclosure } from "../BalanceAPYCalculator/BalanceAPYCalculator.css.js";
+import { calculator } from "../calculator.css.js";
+import { calc_container, container, h2i, inputs_container, input_container, input_box, error_message, hide_select_arrow, calculation_header, payment_results } from "../MonthlyPaymentCalculator/MonthlyPaymentCalculator.css.js";
+const MarineLoanMonthlyPaymentCalculator = ({ variant, header, disclosure, bodyCopy = true }) => {
+  const fullVariant = getVariant(variant);
+  const [loanAmountDisplay, setLoanAmountDisplay] = useState("$75,000");
+  const [loanAmount, setLoanAmount] = useState(75e3);
+  const [loanDuration, setLoanDuration] = useState(240);
+  const [interestRateDisplay, setInterestRateDisplay] = useState("8.25%");
+  const [interestRate, setInterestRate] = useState("8.25");
+  const [estimatedPayment, setEstimatedPayment] = useState(0);
+  const [loanAmountError, setLoanAmountError] = useState(null);
+  const [interestRateError, setInterestRateError] = useState(
+    null
+  );
+  const formatToCurrency = (value) => {
+    const numericValue = parseFloat(value.replace(/[^0-9.]/g, ""));
+    if (isNaN(numericValue)) {
+      return "";
+    }
+    return numericValue.toLocaleString("en-US", {
+      style: "currency",
+      currency: "USD",
+      minimumFractionDigits: 0,
+      maximumFractionDigits: 0
+    });
+  };
+  const validateInputs = () => {
+    let isValid = true;
+    if (!loanAmount || isNaN(loanAmount) || loanAmount < 75e3 || loanAmount > 5e6) {
+      setLoanAmountError(
+        "Please enter an amount between $75,000 and $5,000,000."
+      );
+      isValid = false;
+    } else {
+      setLoanAmountError(null);
+    }
+    if (!interestRate || isNaN(parseFloat(interestRate)) || parseFloat(interestRate) === 0) {
+      setInterestRateError("Please enter an Interest Rate.");
+      isValid = false;
+    } else {
+      setInterestRateError(null);
+    }
+    return isValid;
+  };
+  const handleLoanAmountChange = (event) => {
+    const value = event.target.value;
+    const formattedValue = formatToCurrency(value);
+    setLoanAmountDisplay(formattedValue);
+    const numericValue = parseFloat(value.replace(/[^0-9.]/g, ""));
+    setLoanAmount(isNaN(numericValue) ? void 0 : numericValue);
+  };
+  const handleLoanDurationChange = (event) => {
+    setLoanDuration(Number(event.target.value));
+  };
+  const formatToPercentage = (value) => {
+    let numericValue = value.replace(/[^0-9.]/g, "");
+    const parts = numericValue.split(".");
+    if (parts.length > 2) {
+      numericValue = parts[0] + "." + parts.slice(1).join("");
+    }
+    if (numericValue === "") return "";
+    const cleaned = numericValue.startsWith("0") && numericValue !== "0" ? String(parseFloat(numericValue)) : numericValue;
+    return cleaned + "%";
+  };
+  const handleInterestRateChange = (event) => {
+    let value = event.target.value;
+    if (value.length < interestRateDisplay.length) {
+      if (interestRateDisplay.length > 1 && interestRateDisplay.endsWith("%")) {
+        value = interestRateDisplay.substring(0, interestRateDisplay.length - 2) + "%";
+      } else if (interestRateDisplay.length === 1) {
+        value = "";
+      } else {
+        value = interestRateDisplay.substring(
+          0,
+          interestRateDisplay.length - 1
+        );
+      }
+    } else {
+      value = formatToPercentage(value);
+    }
+    setInterestRateDisplay(value);
+    const numeric = value.replace(/[^0-9.]/g, "");
+    setInterestRate(numeric);
+  };
+  const calculateMonthlyPayment = () => {
+    const numericInterestRate = parseFloat(interestRate);
+    const monthlyInterestRate = numericInterestRate / 100 / 12;
+    const months = loanDuration;
+    if (!isNaN(loanAmount || 0) && !isNaN(numericInterestRate)) {
+      const monthlyPayment = (loanAmount || 0) * monthlyInterestRate / (1 - Math.pow(1 + monthlyInterestRate, -months));
+      setEstimatedPayment(monthlyPayment);
+    } else {
+      setEstimatedPayment(0);
+    }
+  };
+  const handleCalculate = () => {
+    if (validateInputs()) {
+      calculateMonthlyPayment();
+    } else {
+      setEstimatedPayment(0);
+    }
+  };
+  return /* @__PURE__ */ jsx("section", { className: clsx(calculator), children: /* @__PURE__ */ jsx("div", { className: "containment", children: /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: `rounded ${calc_container} ${container({ variant: fullVariant })}`,
+      children: [
+        /* @__PURE__ */ jsxs("div", { children: [
+          /* @__PURE__ */ jsx(
+            "h2",
+            {
+              className: `text_center ${title({ variant: fullVariant })} ${h2i}`,
+              children: header
+            }
+          ),
+          bodyCopy && /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: `${calc_text} ${description_text({ variant: fullVariant })} text_center`,
+              children: bodyCopy
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: `flex center text_center push_up_32 bottom ${inputs_container}`,
+            children: [
+              /* @__PURE__ */ jsxs("div", { className: `flex flex_col ${input_container}`, children: [
+                /* @__PURE__ */ jsx("label", { htmlFor: "loanAmount", id: "amount1", children: "Loan Amount" }),
+                /* @__PURE__ */ jsx(
+                  "input",
+                  {
+                    className: `text_center bordered ${input_box({ variant: fullVariant })}`,
+                    id: "loanAmount",
+                    maxLength: 10,
+                    name: "loanAmount",
+                    type: "text",
+                    placeholder: "$0",
+                    value: loanAmountDisplay,
+                    onChange: handleLoanAmountChange
+                  }
+                ),
+                loanAmountError && /* @__PURE__ */ jsx("span", { className: error_message, children: loanAmountError })
+              ] }),
+              /* @__PURE__ */ jsxs("div", { className: `flex flex_col ${input_container}`, children: [
+                /* @__PURE__ */ jsx("label", { htmlFor: "loanDuration", children: "Loan Duration (Months)" }),
+                /* @__PURE__ */ jsx(
+                  "select",
+                  {
+                    className: `text_center bordered ${input_box({ variant: fullVariant })} ${hide_select_arrow}`,
+                    id: "loanDuration",
+                    name: "loanDuration",
+                    value: loanDuration,
+                    onChange: handleLoanDurationChange,
+                    disabled: true,
+                    children: /* @__PURE__ */ jsx("option", { value: "240", children: "240" })
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ jsxs("div", { className: `flex flex_col ${input_container}`, children: [
+                /* @__PURE__ */ jsx("label", { htmlFor: "interestRate", children: "Interest Rate" }),
+                /* @__PURE__ */ jsx(
+                  "input",
+                  {
+                    className: `text_center bordered ${input_box({ variant: fullVariant })}`,
+                    id: "interestRate",
+                    maxLength: 6,
+                    name: "interestRate",
+                    type: "text",
+                    placeholder: "0.00%",
+                    value: interestRateDisplay,
+                    onChange: handleInterestRateChange
+                  }
+                ),
+                interestRateError && /* @__PURE__ */ jsx("span", { className: error_message, children: interestRateError })
+              ] })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs("div", { children: [
+          /* @__PURE__ */ jsx("div", { className: `flex center middle push_up_32`, children: /* @__PURE__ */ jsx(
+            "input",
+            {
+              className: `${button({
+                color: "primary",
+                size: "medium",
+                rounded: "medium"
+              })} center`,
+              type: "button",
+              value: "Calculate",
+              onClick: handleCalculate
+            }
+          ) }),
+          /* @__PURE__ */ jsxs("div", { className: "text_center flex flex_col center middle push_up_32", children: [
+            /* @__PURE__ */ jsx("span", { className: calculation_header, children: "Estimated Monthly Payment:" }),
+            /* @__PURE__ */ jsxs("span", { id: "estimatedPayment", className: payment_results, children: [
+              "$",
+              estimatedPayment.toFixed(2)
+            ] })
+          ] })
+        ] }),
+        disclosure && /* @__PURE__ */ jsx("div", { className: calc_disclosure({ variant: fullVariant }), children: disclosure })
+      ]
+    }
+  ) }) });
+};
+export {
+  MarineLoanMonthlyPaymentCalculator
+};

package/dist/Calculators/MaxLoanCalculator/index.js

@@ -204,11 +204,28 @@ const MaxLoanCalculator = ({
             }
           ) }),
           /* @__PURE__ */ jsxs("div", { className: "text_center flex flex_col center middle push_up_32", children: [
-            /* @__PURE__ */ jsx("span", { className: calculation_header, children: "Maximum Loan Amount You Can Borrow:" }),
-            /* @__PURE__ */ jsxs("span", { id: "estimatedLoanAmount", className: payment_results, children: [
-              "$",
-              loanAmount.toFixed(2)
-            ] })
+            /* @__PURE__ */ jsx(
+              "label",
+              {
+                htmlFor: "estimatedLoanAmount",
+                className: calculation_header,
+                children: "Maximum Loan Amount You Can Borrow:"
+              }
+            ),
+            /* @__PURE__ */ jsxs(
+              "output",
+              {
+                id: "estimatedLoanAmount",
+                className: payment_results,
+                name: "estimated-loan-amount",
+                htmlFor: "monthlyPayment loanDuration interestRate",
+                role: "status",
+                children: [
+                  "$",
+                  loanAmount.toFixed(2)
+                ]
+              }
+            )
           ] })
         ] })
       ]

package/dist/Calculators/MonthlyPaymentCalculator/MonthlyPaymentCalculator.css.d.ts

@@ -1,20 +1,20 @@
 export declare const container: import('@vanilla-extract/recipes').RuntimeFn<{
     variant: {
         primary: {
-            background: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
-            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            background: `var(--${string})`;
+            color: `var(--${string})`;
         };
         secondary: {
-            background: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
-            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            background: `var(--${string})`;
+            color: `var(--${string})`;
         };
         tertiary: {
-            background: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
-            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            background: `var(--${string})`;
+            color: `var(--${string})`;
         };
         quaternary: {
-            background: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
-            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            background: `var(--${string})`;
+            color: `var(--${string})`;
         };
     };
 }>;
@@ -22,16 +22,16 @@ export declare const input_container: string;
 export declare const input_box: import('@vanilla-extract/recipes').RuntimeFn<{
     variant: {
         primary: {
-            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            color: `var(--${string})`;
         };
         secondary: {
-            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            color: `var(--${string})`;
         };
         tertiary: {
-            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            color: `var(--${string})`;
         };
         quaternary: {
-            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            color: `var(--${string})`;
         };
     };
 }>;
@@ -41,3 +41,4 @@ export declare const inputs_container: string;
 export declare const calculation_header: string;
 export declare const error_message: string;
 export declare const h2i: string;
+export declare const hide_select_arrow: string;

package/dist/Calculators/MonthlyPaymentCalculator/MonthlyPaymentCalculator.css.js

@@ -1,4 +1,4 @@
-/* empty css                                   */
+import '../../assets/Calculators/MonthlyPaymentCalculator/MonthlyPaymentCalculator.css';import '../../assets/themes/victorie.css';import '../../assets/themes/premier.css';import '../../assets/themes/axos.css';/* empty css                                   */
 /* empty css                                      */
 /* empty css                                       */
 /* empty css                                            */
@@ -12,12 +12,14 @@ var inputs_container = "_10pitvcd";
 var calculation_header = "_10pitvce";
 var error_message = "_10pitvcf";
 var h2i = "_10pitvcg";
+var hide_select_arrow = "_10pitvch";
 export {
   calc_container,
   calculation_header,
   container,
   error_message,
   h2i,
+  hide_select_arrow,
   input_box,
   input_container,
   inputs_container,

package/dist/Calculators/MonthlyPaymentCalculator/index.js

@@ -212,11 +212,21 @@ const MonthlyPaymentCalculator = ({
             }
           ) }),
           /* @__PURE__ */ jsxs("div", { className: "text_center flex flex_col center middle push_up_32", children: [
-            /* @__PURE__ */ jsx("span", { className: calculation_header, children: "Estimated Monthly Payment:" }),
-            /* @__PURE__ */ jsxs("span", { id: "estimatedPayment", className: payment_results, children: [
-              "$",
-              estimatedPayment.toFixed(2)
-            ] })
+            /* @__PURE__ */ jsx("label", { htmlFor: "estimatedPayment", className: calculation_header, children: "Estimated Monthly Payment:" }),
+            /* @__PURE__ */ jsxs(
+              "output",
+              {
+                id: "estimatedPayment",
+                className: payment_results,
+                name: "estimated-payment",
+                htmlFor: "loanAmount loanDuration interestRate",
+                role: "status",
+                children: [
+                  "$",
+                  estimatedPayment.toFixed(2)
+                ]
+              }
+            )
           ] })
         ] }),
         disclosure && /* @__PURE__ */ jsx("div", { className: calc_disclosure({ variant: fullVariant }), children: disclosure })

package/dist/Calculators/MonthlyPaymentLVFCalculator/MonthlyPaymentCalculator.css.d.ts

@@ -1,16 +1,16 @@
 export declare const bg_vars: import('@vanilla-extract/recipes').RuntimeFn<{
     variant: {
         primary: {
-            background: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            background: `var(--${string})`;
         };
         secondary: {
-            background: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            background: `var(--${string})`;
         };
         tertiary: {
-            background: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            background: `var(--${string})`;
         };
         quaternary: {
-            background: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            background: `var(--${string})`;
         };
     };
 }>;
@@ -18,32 +18,32 @@ export declare const calc_content_area: string;
 export declare const calc_h2: import('@vanilla-extract/recipes').RuntimeFn<{
     variant: {
         primary: {
-            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            color: `var(--${string})`;
         };
         secondary: {
-            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            color: `var(--${string})`;
         };
         tertiary: {
-            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            color: `var(--${string})`;
         };
         quaternary: {
-            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            color: `var(--${string})`;
         };
     };
 }>;
 export declare const calc_bodycopy: import('@vanilla-extract/recipes').RuntimeFn<{
     variant: {
         primary: {
-            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            color: `var(--${string})`;
         };
         secondary: {
-            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            color: `var(--${string})`;
         };
         tertiary: {
-            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            color: `var(--${string})`;
         };
         quaternary: {
-            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            color: `var(--${string})`;
         };
     };
 }>;

package/dist/Calculators/MonthlyPaymentLVFCalculator/MonthlyPaymentCalculator.css.js

@@ -1,4 +1,4 @@
-/* empty css                                   */
+import '../../assets/Calculators/MonthlyPaymentLVFCalculator/MonthlyPaymentCalculator.css';import '../../assets/Typography/Typography.css';import '../../assets/themes/victorie.css';import '../../assets/themes/premier.css';import '../../assets/themes/axos.css';/* empty css                                   */
 /* empty css                                      */
 /* empty css                                       */
 /* empty css                                             */

package/dist/Calculators/SummitApyCalculator/BalanceAPYCalculator.css.d.ts

@@ -15,32 +15,32 @@ export declare const summit_calc_text: string;
 export declare const summit_description_text: import('@vanilla-extract/recipes').RuntimeFn<{
     variant: {
         primary: {
-            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            color: `var(--${string})`;
         };
         secondary: {
-            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            color: `var(--${string})`;
         };
         tertiary: {
-            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            color: `var(--${string})`;
         };
         quaternary: {
-            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            color: `var(--${string})`;
         };
     };
 }>;
 export declare const summit_calc_disclosure: import('@vanilla-extract/recipes').RuntimeFn<{
     variant: {
         primary: {
-            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            color: `var(--${string})`;
         };
         secondary: {
-            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            color: `var(--${string})`;
         };
         tertiary: {
-            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            color: `var(--${string})`;
         };
         quaternary: {
-            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            color: `var(--${string})`;
         };
     };
 }>;

package/dist/Calculators/SummitApyCalculator/BalanceAPYCalculator.css.js

@@ -1,4 +1,4 @@
-/* empty css                                   */
+import '../../assets/Calculators/SummitApyCalculator/BalanceAPYCalculator.css';import '../../assets/Typography/Typography.css';import '../../assets/themes/victorie.css';import '../../assets/themes/premier.css';import '../../assets/themes/axos.css';/* empty css                                   */
 /* empty css                                      */
 /* empty css                                       */
 /* empty css                                             */

package/dist/Calculators/SummitApyCalculator/index.js

@@ -8,7 +8,7 @@ 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                                   */
+import '../../assets/icons/FollowIcon/FollowIcon.css';import '../../assets/icons/DownloadIcon/DownloadIcon.css';import '../../assets/themes/victorie.css';import '../../assets/themes/premier.css';import '../../assets/themes/axos.css';/* empty css                                   */
 /* empty css                                      */
 /* empty css                                       */
 /* empty css                                                       */
@@ -18,7 +18,7 @@ import { headerCell } from "../../Table/Table.css.js";
 import "../../utils/allowedAxosDomains.js";
 import { getVariant } from "../../utils/getVariant.js";
 import clsx from "clsx";
-import { summit_container, summit_calc_icon, summit_header_container, summit_header_calc, summit_calc_text, summit_description_text, summit_table_container, summit_calculator_wrapper, summit_input_container, summit_input_label, summit_d_label, summit_m_label, summit_calculator_input, summit_calculator_button, focus_row, summit_calc_disclosure } from "./BalanceAPYCalculator.css.js";
+import { summit_container, summit_calc_icon, summit_header_container, summit_header_calc, summit_calc_text, summit_description_text, summit_calculator_wrapper, summit_input_container, summit_input_label, summit_d_label, summit_m_label, summit_calculator_input, summit_calculator_button, focus_row, summit_table_container, summit_calc_disclosure } from "./BalanceAPYCalculator.css.js";
 const SummitApyCalculator = ({
   headline,
   bodyCopy,