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

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

@@ -1,21 +1,21 @@
 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})`;
             border: "1px solid #D4D4D4";
         };
         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})`;
         };
     };
 }>;
@@ -27,16 +27,16 @@ export declare const fb50: string;
 export declare const stat: 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/AnnualFeeCalculator/AnnualFeeCalculator.css.js

@@ -1,4 +1,4 @@
-/* empty css                                   */
+import '../../assets/Calculators/AnnualFeeCalculator/AnnualFeeCalculator.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/ApyCalculator/ApyCalculator.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})`;
         };
     };
 }>;
@@ -42,12 +42,12 @@ export declare const header_theme: import('@vanilla-extract/recipes').RuntimeFn<
             selectors: {
                 [x: string]: {
                     WebkitBackgroundClip: "text";
-                    backgroundImage: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    backgroundImage: `var(--${string})`;
                     WebkitTextFillColor: "transparent";
                     textShadow: "0px 0px #00000000";
                     color?: undefined;
                 } | {
-                    color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    color: `var(--${string})`;
                     WebkitBackgroundClip?: undefined;
                     backgroundImage?: undefined;
                     WebkitTextFillColor?: undefined;
@@ -59,12 +59,12 @@ export declare const header_theme: import('@vanilla-extract/recipes').RuntimeFn<
             selectors: {
                 [x: string]: {
                     WebkitBackgroundClip: "text";
-                    backgroundImage: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    backgroundImage: `var(--${string})`;
                     WebkitTextFillColor: "transparent";
                     textShadow: "0px 0px #00000000";
                     color?: undefined;
                 } | {
-                    color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    color: `var(--${string})`;
                     WebkitBackgroundClip?: undefined;
                     backgroundImage?: undefined;
                     WebkitTextFillColor?: undefined;
@@ -73,10 +73,10 @@ export declare const header_theme: import('@vanilla-extract/recipes').RuntimeFn<
             };
         };
         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/ApyCalculator/ApyCalculator.css.js

@@ -1,4 +1,4 @@
-/* empty css                                   */
+import '../../assets/Calculators/ApyCalculator/ApyCalculator.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/AxosOneCalculator/BalanceAPYCalculator.css.d.ts

@@ -14,32 +14,33 @@ export declare const ax1_calc_text: string;
 export declare const ax1_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 ax1_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})`;
         };
     };
 }>;
+export declare const call_to_action_row: string;

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

@@ -1,4 +1,4 @@
-/* empty css                                   */
+import '../../assets/Calculators/AxosOneCalculator/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                                             */
@@ -19,6 +19,7 @@ var ax1_header_calc = "_11b2y8zb";
 var ax1_calc_text = "_11b2y8zc";
 var ax1_description_text = createRuntimeFn({ defaultClassName: "_11b2y8zd", variantClassNames: { variant: { primary: "_11b2y8ze", secondary: "_11b2y8zf", tertiary: "_11b2y8zg", quaternary: "_11b2y8zh" } }, defaultVariants: {}, compoundVariants: [] });
 var ax1_calc_disclosure = createRuntimeFn({ defaultClassName: "_11b2y8zi", variantClassNames: { variant: { primary: "_11b2y8zj", secondary: "_11b2y8zk", tertiary: "_11b2y8zl", quaternary: "_11b2y8zm" } }, defaultVariants: {}, compoundVariants: [] });
+var call_to_action_row = "_11b2y8zn";
 export {
   ax1_calc_disclosure,
   ax1_calc_icon,
@@ -34,5 +35,6 @@ export {
   ax1_input_container,
   ax1_input_label,
   ax1_m_label,
-  ax1_table_container
+  ax1_table_container,
+  call_to_action_row
 };

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

@@ -1,4 +1,5 @@
 import { default as React, FC } from 'react';
+import { ChevronProps } from '../../Chevron/Chevron.interface';
 
 export interface AxosOneCalculatorProps {
     headline?: React.ReactNode | string;
@@ -6,5 +7,7 @@ export interface AxosOneCalculatorProps {
     bodyCopy?: React.ReactNode | string;
     disclosure: React.ReactNode | string;
     variant: string;
+    initialBalance?: number;
+    callToActionRow?: ChevronProps[];
 }
 export declare const AxosOneCalculator: FC<AxosOneCalculatorProps>;

package/dist/Calculators/AxosOneCalculator/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,25 +18,36 @@ import { headerCell } from "../../Table/Table.css.js";
 import "../../utils/allowedAxosDomains.js";
 import { getVariant } from "../../utils/getVariant.js";
 import clsx from "clsx";
-import { ax1_container, ax1_calc_icon, ax1_header_container, ax1_header_calc, ax1_calc_text, ax1_description_text, ax1_table_container, ax1_calculator_wrapper, ax1_input_container, ax1_input_label, ax1_calculator_input, ax1_calculator_button, ax1_d_label, ax1_m_label, ax1_calc_disclosure } from "./BalanceAPYCalculator.css.js";
+import { ax1_calc_icon, ax1_header_container, ax1_header_calc, ax1_calc_text, ax1_description_text, ax1_calculator_wrapper, ax1_input_container, ax1_input_label, ax1_calculator_input, ax1_calculator_button, ax1_d_label, ax1_m_label, ax1_table_container, call_to_action_row, ax1_calc_disclosure, ax1_container } from "./BalanceAPYCalculator.css.js";
 const AxosOneCalculator = ({
   headline,
   bodyCopy,
   disclosure,
   icon,
-  variant
+  variant,
+  initialBalance,
+  callToActionRow
 }) => {
   const calc_variant = getVariant(variant);
   const AXOS_ONE_APY = +process.env.NEXT_PUBLIC_AXOS_ONE_APY;
-  const [balance, setBalance] = useState(1e4);
+  const startingBalance = Number.isFinite(Number(initialBalance)) && Number(initialBalance) >= 0 ? Number(initialBalance) : 1e4;
+  const [balance, setBalance] = useState(startingBalance);
   const [axbAPY, _setAxbAPY] = useState(AXOS_ONE_APY);
-  const [axbEarning, setAxbEarning] = useState(AXOS_ONE_APY * 100);
+  const [axbEarning, setAxbEarning] = useState(
+    AXOS_ONE_APY / 100 * startingBalance
+  );
   const [chaseAPY, _setChaseAPY] = useState(0.01);
-  const [chaseEarning, setChaseEarning] = useState(1);
+  const [chaseEarning, setChaseEarning] = useState(
+    0.01 / 100 * startingBalance
+  );
   const [bofaAPY, _setBofaAPY] = useState(0.01);
-  const [bofaEarning, setBofaEarning] = useState(1);
+  const [bofaEarning, setBofaEarning] = useState(
+    0.01 / 100 * startingBalance
+  );
   const [fargoAPY, _setFargoAPY] = useState(0.05);
-  const [fargoEarning, setFargoEarning] = useState(5);
+  const [fargoEarning, setFargoEarning] = useState(
+    0.05 / 100 * startingBalance
+  );
   const removeNonNumeric = (value) => {
     if (value === "") {
       value = "0";
@@ -59,7 +70,19 @@ const AxosOneCalculator = ({
       setBalance(0);
     }
   };
-  return /* @__PURE__ */ jsx("section", { className: clsx(ax1_container), children: /* @__PURE__ */ jsxs("div", { className: clsx("containment"), children: [
+  const formatUSD = (value) => {
+    if (Number.isInteger(value)) {
+      return value.toLocaleString(void 0, {
+        minimumFractionDigits: 0,
+        maximumFractionDigits: 0
+      });
+    }
+    return value.toLocaleString(void 0, {
+      minimumFractionDigits: 2,
+      maximumFractionDigits: 2
+    });
+  };
+  return /* @__PURE__ */ jsx("section", { className: clsx(ax1_container), id: "axoapycalc", children: /* @__PURE__ */ jsxs("div", { className: clsx("containment"), children: [
     icon && /* @__PURE__ */ jsx("div", { className: clsx("text_center", ax1_calc_icon), children: ["primary", "secondary"].includes(variant) ? /* @__PURE__ */ jsx(SvgComponent, {}) : /* @__PURE__ */ jsx(SvgAxosX, {}) }),
     (headline || bodyCopy) && /* @__PURE__ */ jsxs("div", { className: `${ax1_header_container} text_center`, children: [
       headline && /* @__PURE__ */ jsx("h2", { className: clsx("header_2", ax1_header_calc), children: headline }),
@@ -134,9 +157,7 @@ const AxosOneCalculator = ({
                 ] }) }),
                 /* @__PURE__ */ jsx(TableCell, { variant: "primary", children: /* @__PURE__ */ jsxs("b", { children: [
                   "$",
-                  axbEarning.toLocaleString(void 0, {
-                    maximumFractionDigits: 2
-                  })
+                  formatUSD(axbEarning)
                 ] }) })
               ] }),
               /* @__PURE__ */ jsxs(TableRow, { children: [
@@ -150,9 +171,7 @@ const AxosOneCalculator = ({
                 ] }),
                 /* @__PURE__ */ jsxs(TableCell, { variant: "primary", children: [
                   "$",
-                  fargoEarning.toLocaleString(void 0, {
-                    maximumFractionDigits: 2
-                  })
+                  formatUSD(fargoEarning)
                 ] })
               ] }),
               /* @__PURE__ */ jsxs(TableRow, { children: [
@@ -166,9 +185,7 @@ const AxosOneCalculator = ({
                 ] }),
                 /* @__PURE__ */ jsxs(TableCell, { variant: "primary", children: [
                   "$",
-                  bofaEarning.toLocaleString(void 0, {
-                    maximumFractionDigits: 2
-                  })
+                  formatUSD(bofaEarning)
                 ] })
               ] }),
               /* @__PURE__ */ jsxs(TableRow, { children: [
@@ -182,9 +199,7 @@ const AxosOneCalculator = ({
                 ] }),
                 /* @__PURE__ */ jsxs(TableCell, { variant: "primary", children: [
                   "$",
-                  chaseEarning.toLocaleString(void 0, {
-                    maximumFractionDigits: 2
-                  })
+                  formatUSD(chaseEarning)
                 ] })
               ] })
             ] })
@@ -192,6 +207,19 @@ const AxosOneCalculator = ({
         }
       )
     ] }),
+    Array.isArray(callToActionRow) && callToActionRow.length > 0 && /* @__PURE__ */ jsx("div", { className: `${call_to_action_row}`, children: callToActionRow?.map(
+      ({ id, variant: variant2, displayText, targetUrl }) => /* @__PURE__ */ jsx(
+        Button,
+        {
+          targetUrl,
+          color: getVariant(variant2),
+          size: "medium",
+          rounded: "medium",
+          children: displayText
+        },
+        id
+      )
+    ) }),
     disclosure && /* @__PURE__ */ jsx("div", { className: ax1_calc_disclosure({ variant: calc_variant }), children: disclosure })
   ] }) });
 };

package/dist/Calculators/BalanceAPYCalculator/BalanceAPYCalculator.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})`;
         };
     };
 }>;
@@ -36,12 +36,12 @@ export declare const header_calc: import('@vanilla-extract/recipes').RuntimeFn<{
             readonly selectors: {
                 [x: string]: {
                     WebkitBackgroundClip: string;
-                    backgroundImage: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    backgroundImage: `var(--${string})`;
                     WebkitTextFillColor: string;
                     textShadow: string;
                     color?: undefined;
                 } | {
-                    color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    color: `var(--${string})`;
                     WebkitBackgroundClip?: undefined;
                     backgroundImage?: undefined;
                     WebkitTextFillColor?: undefined;
@@ -53,12 +53,12 @@ export declare const header_calc: import('@vanilla-extract/recipes').RuntimeFn<{
             selectors: {
                 [x: string]: {
                     WebkitBackgroundClip: "text";
-                    backgroundImage: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    backgroundImage: `var(--${string})`;
                     WebkitTextFillColor: "transparent";
                     textShadow: "0px 0px #00000000";
                     color?: undefined;
                 } | {
-                    color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    color: `var(--${string})`;
                     WebkitBackgroundClip?: undefined;
                     backgroundImage?: undefined;
                     WebkitTextFillColor?: undefined;
@@ -67,10 +67,10 @@ export declare const header_calc: import('@vanilla-extract/recipes').RuntimeFn<{
             };
         };
         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})`;
         };
     };
 }>;
@@ -78,32 +78,32 @@ export declare const calc_text: string;
 export declare const 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 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/BalanceAPYCalculator/BalanceAPYCalculator.css.js

@@ -1,4 +1,4 @@
-/* empty css                                   */
+import '../../assets/Calculators/BalanceAPYCalculator/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/BalanceAPYCalculator/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 { container, calc_icon, header_container, header_calc, calc_text, description_text, table_container, calculator_wrapper, input_container, input_label, d_label, m_label, calculator_input, calculator_button, max_balance, error_message, calc_disclosure } from "./BalanceAPYCalculator.css.js";
+import { calc_icon, header_container, header_calc, calc_text, description_text, calculator_wrapper, input_container, input_label, d_label, m_label, calculator_input, calculator_button, max_balance, error_message, table_container, calc_disclosure, container } from "./BalanceAPYCalculator.css.js";
 const BalanceAPYCalculator = ({
   headline,
   bodyCopy,

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

@@ -1,20 +1,20 @@
 export declare const calc_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})`;
         };
     };
 }>;
@@ -26,16 +26,16 @@ export declare const errorTag: string;
 export declare const form_wrapper: 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})`;
         };
     };
 }>;
@@ -58,12 +58,12 @@ export declare const theme_header: import('@vanilla-extract/recipes').RuntimeFn<
             selectors: {
                 [x: string]: {
                     WebkitBackgroundClip: "text";
-                    backgroundImage: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    backgroundImage: `var(--${string})`;
                     WebkitTextFillColor: "transparent";
                     textShadow: "0px 0px #00000000";
                     color?: undefined;
                 } | {
-                    color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    color: `var(--${string})`;
                     WebkitBackgroundClip?: undefined;
                     backgroundImage?: undefined;
                     WebkitTextFillColor?: undefined;
@@ -75,12 +75,12 @@ export declare const theme_header: import('@vanilla-extract/recipes').RuntimeFn<
             selectors: {
                 [x: string]: {
                     WebkitBackgroundClip: "text";
-                    backgroundImage: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    backgroundImage: `var(--${string})`;
                     WebkitTextFillColor: "transparent";
                     textShadow: "0px 0px #00000000";
                     color?: undefined;
                 } | {
-                    color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    color: `var(--${string})`;
                     WebkitBackgroundClip?: undefined;
                     backgroundImage?: undefined;
                     WebkitTextFillColor?: undefined;
@@ -89,10 +89,10 @@ export declare const theme_header: import('@vanilla-extract/recipes').RuntimeFn<
             };
         };
         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/BuyDownCalculator/BuyDownCalculator.css.js

@@ -1,4 +1,4 @@
-/* empty css                                   */
+import '../../assets/Calculators/BuyDownCalculator/BuyDownCalculator.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/BuyDownCalculator/index.js

@@ -23,7 +23,7 @@ import { getVariant } from "../../utils/getVariant.js";
 import clsx from "clsx";
 import { useForm, FormProvider } from "react-hook-form";
 import { z } from "zod";
-import { calc_container, calculator_section, section_header, theme_header, mt_8, buydown_calculator_form, form_wrapper, row_form, limit_one, calculate_row, form_disclosure } from "./BuyDownCalculator.css.js";
+import { calc_container, calculator_section, section_header, theme_header, mt_8, buydown_calculator_form, row_form, limit_one, calculate_row, form_wrapper, form_disclosure } from "./BuyDownCalculator.css.js";
 const BuyDownCalculator = ({
   header,
   body,
@@ -344,7 +344,7 @@ const BuyDownCalculator = ({
   };
   const calculatePMT = (annualRate, totalPeriods, financedAmount2) => {
     const monthlyRate = annualRate / 100 / 12;
-    const payment = financedAmount2 * monthlyRate / (1 - Math.pow(1 + monthlyRate, -totalPeriods));
+    const payment = financedAmount2 * monthlyRate / (1 - Math.pow(1 + monthlyRate, -240));
     return payment;
   };
   const totalInterestByYear = (annualRate, totalPeriods, financedAmount2, years) => {

package/dist/Calculators/Calculator.d.ts

@@ -1,5 +1,6 @@
 import { IconBillboardProps } from '../IconBillboard/IconBillboard.interface';
 import { default as React } from 'react';
+import { ChevronProps } from '../Chevron/Chevron.interface';
 
 export interface CalculatorProps {
     id?: string;
@@ -11,5 +12,7 @@ export interface CalculatorProps {
     bodyCopy?: React.ReactNode;
     disclosure?: React.ReactNode;
     marketingTiles?: IconBillboardProps[];
+    callToActionRow?: ChevronProps[];
+    initialBalance?: number;
 }
 export declare const Calculator: (props: CalculatorProps) => import("react/jsx-runtime").JSX.Element;