@axos-web-dev/shared-components 2.0.0-dev.27-evo.1 → 2.0.0-dev.28

package/README.md

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

package/dist/Avatar/Avatar.module.js

@@ -1,10 +1,10 @@
-import '../assets/Avatar/Avatar.css';const avatar_sec = "_avatar_sec_q4a8z_1";
-const container = "_container_q4a8z_9";
-const image = "_image_q4a8z_27";
-const text = "_text_q4a8z_45";
-const name = "_name_q4a8z_57";
-const title = "_title_q4a8z_73";
-const description = "_description_q4a8z_87";
+import '../assets/Avatar/Avatar.css';const avatar_sec = "_avatar_sec_1clr6_1";
+const container = "_container_1clr6_5";
+const image = "_image_1clr6_14";
+const text = "_text_1clr6_23";
+const name = "_name_1clr6_29";
+const title = "_title_1clr6_37";
+const description = "_description_1clr6_44";
 const css = {
   avatar_sec,
   container,

package/dist/Blockquote/Blockquote.module.js

@@ -1,6 +1,6 @@
-import '../assets/Blockquote/Blockquote.css';const quote_spacer = "_quote_spacer_lqs2u_1";
-const author = "_author_lqs2u_13";
-const quote = "_quote_lqs2u_1";
+import '../assets/Blockquote/Blockquote.css';const quote_spacer = "_quote_spacer_ovx4r_1";
+const author = "_author_ovx4r_7";
+const quote = "_quote_ovx4r_1";
 const css = {
   quote_spacer,
   author,

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

@@ -92,5 +92,6 @@ export declare const definitions_column: string;
 export declare const definitions_item: string;
 export declare const definitions_term: string;
 export declare const definitions_text: string;
+export declare const calc_btn: string;
 export declare const marketingTile: string;
 export declare const bodyContent: string;

package/dist/Calculators/ApyCalculator/ApyCalculator.css.js

@@ -50,12 +50,14 @@ var definitions_column = "_1vox1xj1i";
 var definitions_item = "_1vox1xj1j";
 var definitions_term = "_1vox1xj1k";
 var definitions_text = "_1vox1xj1l";
-var marketingTile = "_1vox1xj1m";
-var bodyContent = "_1vox1xj1n";
+var calc_btn = "_1vox1xj1m";
+var marketingTile = "_1vox1xj1n";
+var bodyContent = "_1vox1xj1o";
 export {
   apy_calculator,
   apy_calculator_form,
   bodyContent,
+  calc_btn,
   calculator_section,
   chevron_icon,
   container,

package/dist/Calculators/ApyCalculator/index.js

@@ -3,10 +3,11 @@ import { jsxs, jsx, Fragment } from "react/jsx-runtime";
 import { useGlobalContext } from "../../Modal/contextApi/store.js";
 import { getVariant } from "../../utils/getVariant.js";
 import Image from "next/image.js";
-import { Field, Label, Input, Description, Listbox, ListboxButton, ListboxOptions, ListboxOption, Disclosure, DisclosureButton, DisclosurePanel } from "@headlessui/react";
+import { button } from "../../Button/Button.css.js";
+import { Field, Label, Input, Description, Listbox, ListboxButton, ListboxOptions, ListboxOption, Button, Disclosure, DisclosureButton, DisclosurePanel } from "@headlessui/react";
 import { AnimatePresence, motion } from "framer-motion";
 import { useState, useCallback, useEffect, useRef } from "react";
-import { apy_calculator, section_header, header_theme, mt_8, calculator_section, apy_calculator_form, fieldset, field_row, relative, field_label, field_row_input, field_row_input_error, field_error, label_symbol, percent, listbox_button, chevron_icon, listbox_options, listbox_option, optional_badge, form_disclosure, results_wrapper, result_card, result_section, result_image, result_value, scrambling, result_value_label, result_item, result_item_label, result_item_value, definitions_accordion, definitions_button, definitions_h2, definitions_columns, definitions_panel, definitions_column, definitions_item, definitions_term, definitions_text, container } from "./ApyCalculator.css.js";
+import { apy_calculator, section_header, header_theme, mt_8, calculator_section, apy_calculator_form, fieldset, field_row, relative, field_label, field_row_input, field_row_input_error, field_error, label_symbol, percent, listbox_button, chevron_icon, listbox_options, listbox_option, optional_badge, form_disclosure, calc_btn, results_wrapper, result_card, result_section, result_image, result_value, scrambling, result_value_label, result_item, result_item_label, result_item_value, definitions_accordion, definitions_button, definitions_h2, definitions_columns, definitions_panel, definitions_column, definitions_item, definitions_term, definitions_text, container } from "./ApyCalculator.css.js";
 const COMPOUNDING_OPTIONS = [
   { value: 360, label: "Daily" },
   { value: 12, label: "Monthly" },
@@ -49,10 +50,19 @@ const CALCULATOR_DEFINITIONS = [
   }
 ];
 const SCRAMBLE_CHARS = "0123456789";
-const DEFINITIONS_ITEM_TRANSITION = {
-  duration: 0.35,
-  ease: [0.22, 1, 0.36, 1]
-};
+const STACKED_LAYOUT_MEDIA = "(max-width: 930px)";
+const INTEREST_EARNED_ID = "interestEarned";
+function useStackedLayout() {
+  const [isStacked, setIsStacked] = useState(false);
+  useEffect(() => {
+    const media = window.matchMedia(STACKED_LAYOUT_MEDIA);
+    const onChange = () => setIsStacked(media.matches);
+    onChange();
+    media.addEventListener("change", onChange);
+    return () => media.removeEventListener("change", onChange);
+  }, []);
+  return isStacked;
+}
 function scrambleCurrency(target, progress) {
   const formatted = target.toLocaleString("en-US", {
     style: "currency",
@@ -119,9 +129,10 @@ const ApyCalculator = ({
   variant
 }) => {
   const { domains } = useGlobalContext();
+  const isStackedLayout = useStackedLayout();
   const calculator_variant = getVariant(variant);
   const [compoundingOption, setCompoundingOption] = useState(
-    COMPOUNDING_OPTIONS[0]
+    COMPOUNDING_OPTIONS[1]
   );
   const compounding = compoundingOption.value;
   const getAPR = useCallback(
@@ -184,6 +195,12 @@ const ApyCalculator = ({
   const midPoint = Math.ceil(CALCULATOR_DEFINITIONS.length / 2);
   const leftDefinitions = CALCULATOR_DEFINITIONS.slice(0, midPoint);
   const rightDefinitions = CALCULATOR_DEFINITIONS.slice(midPoint);
+  const scrollToInterestEarned = useCallback(() => {
+    document.getElementById(INTEREST_EARNED_ID)?.scrollIntoView({
+      behavior: "smooth",
+      block: "start"
+    });
+  }, []);
   const calculate = useCallback(() => {
     const newErrors = {};
     if (!initialDeposit || initialDeposit <= 0 || Number.isNaN(initialDeposit)) {
@@ -199,7 +216,7 @@ const ApyCalculator = ({
       newErrors.APY = "Please enter a valid APY greater than 0.";
     }
     setFieldErrors(newErrors);
-    if (Object.keys(newErrors).length > 0) return;
+    if (Object.keys(newErrors).length > 0) return false;
     const APR = getAPR(APY);
     const interestRate = 0.01 * APR;
     let total;
@@ -225,10 +242,18 @@ const ApyCalculator = ({
     setEndingBalanceRaw(total);
     setTotalDepositsRaw(deposits);
     setInterestEarnedRaw(interest > 0 ? interest : 0);
+    return true;
   }, [initialDeposit, APY, months, monthlyDeposits, compounding, getAPR]);
+  const handleCalculateClick = useCallback(() => {
+    const didCalculate = calculate();
+    if (!didCalculate || !isStackedLayout) return;
+    requestAnimationFrame(() => {
+      scrollToInterestEarned();
+    });
+  }, [calculate, isStackedLayout, scrollToInterestEarned]);
   useEffect(() => {
     calculate();
-  }, [calculate]);
+  }, []);
   return /* @__PURE__ */ jsxs(
     "section",
     {
@@ -437,12 +462,22 @@ const ApyCalculator = ({
                     }
                   )
                 ] }),
-                disclosure && /* @__PURE__ */ jsx("div", { className: `${form_disclosure} push_up_24`, children: disclosure })
+                disclosure && /* @__PURE__ */ jsx("div", { className: `${form_disclosure} push_up_24`, children: disclosure }),
+                /* @__PURE__ */ jsx("div", { className: "flex center push_up", children: /* @__PURE__ */ jsx(
+                  Button,
+                  {
+                    type: "button",
+                    onClick: handleCalculateClick,
+                    className: `${button({ color: "primary", size: "large", rounded: "medium" })} ${calc_btn}`,
+                    children: "Calculate"
+                  }
+                ) })
               ] }) }) }),
               /* @__PURE__ */ jsx("div", { className: results_wrapper, children: /* @__PURE__ */ jsxs("div", { className: result_card, children: [
                 /* @__PURE__ */ jsxs(
                   "div",
                   {
+                    id: INTEREST_EARNED_ID,
                     className: result_section,
                     "aria-live": "polite",
                     "aria-atomic": "true",
@@ -544,17 +579,10 @@ const ApyCalculator = ({
                     {
                       className: `${definitions_columns} ${definitions_panel}`,
                       children: [
-                        /* @__PURE__ */ jsx("div", { className: definitions_column, children: leftDefinitions.map((definition, index) => /* @__PURE__ */ jsxs(
-                          motion.div,
+                        /* @__PURE__ */ jsx("div", { className: definitions_column, children: leftDefinitions.map((definition) => /* @__PURE__ */ jsxs(
+                          "div",
                           {
                             className: definitions_item,
-                            initial: { opacity: 0, y: 8 },
-                            animate: { opacity: 1, y: 0 },
-                            exit: { opacity: 0, y: 6 },
-                            transition: {
-                              ...DEFINITIONS_ITEM_TRANSITION,
-                              delay: index * 0.045
-                            },
                             children: [
                               /* @__PURE__ */ jsx("h3", { className: definitions_term, children: definition.term }),
                               /* @__PURE__ */ jsx("p", { className: definitions_text, children: definition.description })
@@ -562,17 +590,10 @@ const ApyCalculator = ({
                           },
                           definition.term
                         )) }),
-                        /* @__PURE__ */ jsx("div", { className: definitions_column, children: rightDefinitions.map((definition, index) => /* @__PURE__ */ jsxs(
-                          motion.div,
+                        /* @__PURE__ */ jsx("div", { className: definitions_column, children: rightDefinitions.map((definition) => /* @__PURE__ */ jsxs(
+                          "div",
                           {
                             className: definitions_item,
-                            initial: { opacity: 0, y: 8 },
-                            animate: { opacity: 1, y: 0 },
-                            exit: { opacity: 0, y: 6 },
-                            transition: {
-                              ...DEFINITIONS_ITEM_TRANSITION,
-                              delay: (leftDefinitions.length + index) * 0.045
-                            },
                             children: [
                               /* @__PURE__ */ jsx("h3", { className: definitions_term, children: definition.term }),
                               /* @__PURE__ */ jsx("p", { className: definitions_text, children: definition.description })

package/dist/Carousel/index.js

@@ -26,6 +26,7 @@ import "../Calculators/calculator.css.js";
 import "../Calculators/AnnualFeeCalculator/AnnualFeeCalculator.css.js";
 import "../Modal/contextApi/store.js";
 import "next/image.js";
+import "../Button/Button.css.js";
 import "../Calculators/ApyCalculator/ApyCalculator.css.js";
 import "../Table/Table.css.js";
 import "../Calculators/AxosOneCalculator/BalanceAPYCalculator.css.js";
@@ -61,7 +62,6 @@ import "../Hyperlink/Hyperlink.css.js";
 /* empty css                                                      */
 import "iframe-resizer";
 /* empty css                                                                                */
-import "../Button/Button.css.js";
 import "../Calculators/MonthlyPaymentCalculator/MonthlyPaymentCalculator.css.js";
 import "../Calculators/MonthlyPaymentLVFCalculator/MonthlyPaymentCalculator.css.js";
 import "../Calculators/SummitApyCalculator/BalanceAPYCalculator.css.js";

package/dist/FdicCallout/FdicCallout.module.js

@@ -1,5 +1,5 @@
-import '../assets/FdicCallout/FdicCallout.css';const fdic_callout = "_fdic_callout_eqzgp_1";
-const inner_container = "_inner_container_eqzgp_11";
+import '../assets/FdicCallout/FdicCallout.css';const fdic_callout = "_fdic_callout_1f6md_1";
+const inner_container = "_inner_container_1f6md_6";
 const css = {
   fdic_callout,
   inner_container

package/dist/Forms/ApplyNow.js

@@ -29,6 +29,7 @@ import "../Calculators/calculator.css.js";
 import "../Calculators/AnnualFeeCalculator/AnnualFeeCalculator.css.js";
 import "../Modal/contextApi/store.js";
 import "next/image.js";
+import "../Button/Button.css.js";
 import "../Calculators/ApyCalculator/ApyCalculator.css.js";
 import "../Table/Table.css.js";
 import "../Calculators/AxosOneCalculator/BalanceAPYCalculator.css.js";
@@ -62,7 +63,6 @@ import "../Hyperlink/Hyperlink.css.js";
 /* empty css                                               */
 import "iframe-resizer";
 /* empty css                                                                                */
-import "../Button/Button.css.js";
 import "../Calculators/MonthlyPaymentCalculator/MonthlyPaymentCalculator.css.js";
 import "../Calculators/MonthlyPaymentLVFCalculator/MonthlyPaymentCalculator.css.js";
 import "../Calculators/SummitApyCalculator/BalanceAPYCalculator.css.js";

package/dist/Forms/MortgageRate/MortgageRateForm.js

@@ -29,6 +29,7 @@ import "../../Calculators/calculator.css.js";
 import "../../Calculators/AnnualFeeCalculator/AnnualFeeCalculator.css.js";
 import "../../Modal/contextApi/store.js";
 import "next/image.js";
+import { button } from "../../Button/Button.css.js";
 import "../../Calculators/ApyCalculator/ApyCalculator.css.js";
 import "../../Table/Table.css.js";
 import "../../Calculators/AxosOneCalculator/BalanceAPYCalculator.css.js";
@@ -64,7 +65,6 @@ import "../../Hyperlink/Hyperlink.css.js";
 /* empty css                                                */
 import "iframe-resizer";
 /* empty css                                                                                   */
-import { button } from "../../Button/Button.css.js";
 import "../../Calculators/MonthlyPaymentCalculator/MonthlyPaymentCalculator.css.js";
 import "../../Calculators/MonthlyPaymentLVFCalculator/MonthlyPaymentCalculator.css.js";
 import "../../Calculators/SummitApyCalculator/BalanceAPYCalculator.css.js";

package/dist/Forms/MortgageRate/MortgageRateWatch.js

@@ -41,6 +41,7 @@ import "../../Calculators/calculator.css.js";
 import "../../Calculators/AnnualFeeCalculator/AnnualFeeCalculator.css.js";
 import "../../Modal/contextApi/store.js";
 import "next/image.js";
+import { button } from "../../Button/Button.css.js";
 import "../../Calculators/ApyCalculator/ApyCalculator.css.js";
 import "../../Table/Table.css.js";
 import "../../Calculators/AxosOneCalculator/BalanceAPYCalculator.css.js";
@@ -59,7 +60,6 @@ import "../../Hyperlink/Hyperlink.css.js";
 import { SuccesFormWrapper } from "../SuccesForm.js";
 import "iframe-resizer";
 /* empty css                                                                                   */
-import { button } from "../../Button/Button.css.js";
 import "../../Calculators/MonthlyPaymentCalculator/MonthlyPaymentCalculator.css.js";
 import "../../Calculators/MonthlyPaymentLVFCalculator/MonthlyPaymentCalculator.css.js";
 import "../../Calculators/SummitApyCalculator/BalanceAPYCalculator.css.js";

package/dist/Forms/SuccesForm.js

@@ -23,6 +23,7 @@ import "../Calculators/calculator.css.js";
 import "../Calculators/AnnualFeeCalculator/AnnualFeeCalculator.css.js";
 import "../Modal/contextApi/store.js";
 import "next/image.js";
+import "../Button/Button.css.js";
 import "../Calculators/ApyCalculator/ApyCalculator.css.js";
 import "../Table/Table.css.js";
 import "../Calculators/AxosOneCalculator/BalanceAPYCalculator.css.js";
@@ -45,7 +46,6 @@ import "iframe-resizer";
 /* empty css                                                                                */
 import "../Chevron/Chevron.css.js";
 /* empty css                                */
-import "../Button/Button.css.js";
 import "../Calculators/MonthlyPaymentCalculator/MonthlyPaymentCalculator.css.js";
 import "../Calculators/MonthlyPaymentLVFCalculator/MonthlyPaymentCalculator.css.js";
 import "../Calculators/SummitApyCalculator/BalanceAPYCalculator.css.js";

package/dist/ImageLink/ImageLink.js

@@ -22,6 +22,7 @@ import "../Calculators/calculator.css.js";
 import "../Calculators/AnnualFeeCalculator/AnnualFeeCalculator.css.js";
 import "../Modal/contextApi/store.js";
 import "next/image.js";
+import "../Button/Button.css.js";
 import "../Calculators/ApyCalculator/ApyCalculator.css.js";
 import "../Table/Table.css.js";
 import "../Calculators/AxosOneCalculator/BalanceAPYCalculator.css.js";
@@ -56,7 +57,6 @@ import "../Inputs/Input.css.js";
 /* empty css                                                      */
 import "iframe-resizer";
 /* empty css                                                                                */
-import "../Button/Button.css.js";
 import "../Calculators/MonthlyPaymentCalculator/MonthlyPaymentCalculator.css.js";
 import "../Calculators/MonthlyPaymentLVFCalculator/MonthlyPaymentCalculator.css.js";
 import "../Calculators/SummitApyCalculator/BalanceAPYCalculator.css.js";

package/dist/Insight/Featured/CategorySelector.js

@@ -26,6 +26,7 @@ import "../../Calculators/calculator.css.js";
 import "../../Calculators/AnnualFeeCalculator/AnnualFeeCalculator.css.js";
 import "../../Modal/contextApi/store.js";
 import "next/image.js";
+import "../../Button/Button.css.js";
 import "../../Calculators/ApyCalculator/ApyCalculator.css.js";
 import "../../Table/Table.css.js";
 import "../../Calculators/AxosOneCalculator/BalanceAPYCalculator.css.js";
@@ -58,7 +59,6 @@ import "../../Hyperlink/Hyperlink.css.js";
 /* empty css                                                         */
 import "iframe-resizer";
 /* empty css                                                                                   */
-import "../../Button/Button.css.js";
 import "../../Calculators/MonthlyPaymentCalculator/MonthlyPaymentCalculator.css.js";
 import "../../Calculators/MonthlyPaymentLVFCalculator/MonthlyPaymentCalculator.css.js";
 import "../../Calculators/SummitApyCalculator/BalanceAPYCalculator.css.js";

package/dist/Insight/Featured/Featured.js

@@ -23,6 +23,7 @@ import "../../Calculators/calculator.css.js";
 import "../../Calculators/AnnualFeeCalculator/AnnualFeeCalculator.css.js";
 import "../../Modal/contextApi/store.js";
 import Image from "next/image.js";
+import "../../Button/Button.css.js";
 import "../../Calculators/ApyCalculator/ApyCalculator.css.js";
 import "../../Table/Table.css.js";
 import "../../Calculators/AxosOneCalculator/BalanceAPYCalculator.css.js";
@@ -58,7 +59,6 @@ import "../../Hyperlink/Hyperlink.css.js";
 /* empty css                                                         */
 import "iframe-resizer";
 /* empty css                                                                                   */
-import "../../Button/Button.css.js";
 import "../../Calculators/MonthlyPaymentCalculator/MonthlyPaymentCalculator.css.js";
 import "../../Calculators/MonthlyPaymentLVFCalculator/MonthlyPaymentCalculator.css.js";
 import "../../Calculators/SummitApyCalculator/BalanceAPYCalculator.css.js";

package/dist/Insight/Featured/Header.js

@@ -21,6 +21,7 @@ import "../../Calculators/calculator.css.js";
 import "../../Calculators/AnnualFeeCalculator/AnnualFeeCalculator.css.js";
 import "../../Modal/contextApi/store.js";
 import "next/image.js";
+import "../../Button/Button.css.js";
 import "../../Calculators/ApyCalculator/ApyCalculator.css.js";
 import "../../Table/Table.css.js";
 import "../../Calculators/AxosOneCalculator/BalanceAPYCalculator.css.js";
@@ -56,7 +57,6 @@ import "../../Hyperlink/Hyperlink.css.js";
 /* empty css                                                         */
 import "iframe-resizer";
 /* empty css                                                                                   */
-import "../../Button/Button.css.js";
 import "../../Calculators/MonthlyPaymentCalculator/MonthlyPaymentCalculator.css.js";
 import "../../Calculators/MonthlyPaymentLVFCalculator/MonthlyPaymentCalculator.css.js";
 import "../../Calculators/SummitApyCalculator/BalanceAPYCalculator.css.js";

package/dist/Interstitial/Interstitial.module.js

@@ -1,13 +1,13 @@
-import '../assets/Interstitial/Interstitial.css';const overlay = "_overlay_1ep5z_47";
-const modal = "_modal_1ep5z_79";
-const vanish = "_vanish_1ep5z_1";
-const appear = "_appear_1ep5z_1";
-const close_button = "_close_button_1ep5z_109";
-const modal_content = "_modal_content_1ep5z_139";
-const img_area = "_img_area_1ep5z_147";
-const body_copy = "_body_copy_1ep5z_167";
-const btns = "_btns_1ep5z_195";
-const white_modal = "_white_modal_1ep5z_277";
+import '../assets/Interstitial/Interstitial.css';const overlay = "_overlay_e4cra_24";
+const modal = "_modal_e4cra_40";
+const vanish = "_vanish_e4cra_1";
+const appear = "_appear_e4cra_1";
+const close_button = "_close_button_e4cra_55";
+const modal_content = "_modal_content_e4cra_70";
+const img_area = "_img_area_e4cra_74";
+const body_copy = "_body_copy_e4cra_84";
+const btns = "_btns_e4cra_98";
+const white_modal = "_white_modal_e4cra_139";
 const css = {
   overlay,
   modal,