@axos-web-dev/shared-components 0.0.81 → 0.0.83

package/dist/NavigationMenu/AxosBank/SubNavBar.js

@@ -10,21 +10,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 { useState, useEffect } from "react";
-import "../../ApyCalculator/ApyCalculator.css.js";
-import "../../Modal/contextApi/store.js";
-import { findMoreAxosDomains } from "../../utils/allowedAxosDomains.js";
-import "clsx";
-import { useLocation } from "react-use";
-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 "../../AnnualFeeCalculator/AnnualFeeCalculator.css.js";
+import { findMoreAxosDomains } from "../../utils/allowedAxosDomains.js";
+import "../../Modal/contextApi/store.js";
+import "clsx";
+import { useState, useEffect } from "react";
+import "../../Button/Button.css.js";
+import { useLocation } from "react-use";
 import "@hookform/resolvers/zod";
 import "../../Input/Checkbox.js";
 import "../../Input/CurrencyInput.js";
@@ -39,9 +37,12 @@ import "../../Forms/Forms.css.js";
 import "../../Forms/SalesforceFieldsForm.js";
 import "../../LoadingIndicator/LoadingIndicator.css.js";
 import "../../Input/RadioButton.js";
-import "../../MonthlyPaymentCalculator/MonthlyPaymentCalculator.css.js";
 import "iframe-resizer";
 import "../../Calculators/calculator.css.js";
+import "../../Calculators/ApyCalculator/ApyCalculator.css.js";
+import "../../Calculators/MonthlyPaymentCalculator/MonthlyPaymentCalculator.css.js";
+import "../../Calculators/AnnualFeeCalculator/AnnualFeeCalculator.css.js";
+/* empty css                                                                                   */
 /* empty css                                                       */
 import "../../Carousel/index.js";
 /* empty css                                                                       */

package/dist/SetContainer/SetContainer.js

@@ -16,15 +16,13 @@ import "../icons/CheckIcon/CheckIcon.css.js";
 import "../Accordion/Accordion.js";
 import "../Accordion/Accordion.css.js";
 import "../AlertBanner/AlertBanner.css.js";
-import "../ApyCalculator/ApyCalculator.css.js";
-import { header_section } from "../IconBillboard/IconBillboard.css.js";
 import "../Article/Article.css.js";
 import "../ArticlesSet/ArticlesSet.css.js";
 /* empty css                                              */
 /* empty css                                          */
 /* empty css                                          */
+import { header_section } from "../IconBillboard/IconBillboard.css.js";
 /* empty css                                          */
-import "../AnnualFeeCalculator/AnnualFeeCalculator.css.js";
 import "@hookform/resolvers/zod";
 import "../Input/Checkbox.js";
 import "../Input/CurrencyInput.js";
@@ -39,9 +37,12 @@ import "../Forms/Forms.css.js";
 import "../Forms/SalesforceFieldsForm.js";
 import "../LoadingIndicator/LoadingIndicator.css.js";
 import "../Input/RadioButton.js";
-import "../MonthlyPaymentCalculator/MonthlyPaymentCalculator.css.js";
 import "iframe-resizer";
 import "../Calculators/calculator.css.js";
+import "../Calculators/ApyCalculator/ApyCalculator.css.js";
+import "../Calculators/MonthlyPaymentCalculator/MonthlyPaymentCalculator.css.js";
+import "../Calculators/AnnualFeeCalculator/AnnualFeeCalculator.css.js";
+/* empty css                                                                                */
 /* empty css                                                    */
 import "../Carousel/index.js";
 /* empty css                                                                    */

package/dist/assets/{AnnualFeeCalculator → Calculators/AnnualFeeCalculator}/AnnualFeeCalculator.css

@@ -1,36 +1,36 @@
-.tosm7c1 {
+._7zr6kt1 {
   background: var(--_1073cm81);
   color: var(--_1073cm82);
   border: 1px solid #D4D4D4;
 }
-.tosm7c2 {
+._7zr6kt2 {
   background: var(--_1073cm88);
   color: var(--_1073cm89);
 }
-.tosm7c3 {
+._7zr6kt3 {
   background: var(--_1073cm8f);
   color: var(--_1073cm8g);
 }
-.tosm7c4 {
+._7zr6kt4 {
   background: var(--_1073cm8m);
   color: var(--_1073cm8n);
 }
-.tosm7c5 {
+._7zr6kt5 {
   width: 50%;
-  padding: 4rem;
+  padding: 4rem 4rem 0;
 }
-.tosm7c6 {
+._7zr6kt6 {
   padding: 4rem 28px 4rem 28px;
 }
-.tosm7c7 {
+._7zr6kt7 {
   display: flex;
   flex-direction: column;
   align-items: center;
 }
-.tosm7c9 {
+._7zr6kt9 {
   flex-basis: 50%;
 }
-.tosm7ca {
+._7zr6kta {
   color: #1e3860;
   font-family: var(--main-font-family);
   font-size: 34px;
@@ -38,14 +38,14 @@
   letter-spacing: .2px;
   line-height: 1.29;
 }
-.tosm7cb {
+._7zr6ktb {
   width: 100%;
 }
-.tosm7cc {
+._7zr6ktc {
   position: relative;
   padding-right: 1rem;
 }
-.tosm7cc::after {
+._7zr6ktc::after {
   content: "";
   position: absolute;
   background-color: #bdbdbd;
@@ -55,16 +55,16 @@
   top: 0;
   bottom: 0;
 }
-.tosm7cd {
+._7zr6ktd {
   border-bottom: 1px solid #bdbdbd;
   padding: 1.5rem 0;
 }
-.tosm7ce {
+._7zr6kte {
   margin: auto;
   min-width: 100%;
   padding: 77px 0 60px;
 }
-.tosm7cf {
+._7zr6ktf {
   width: 100%;
   -webkit-appearance: none;
   height: 12px;
@@ -75,7 +75,7 @@
   transition: opacity .2s, background .2s;
   border-radius: 1rem;
 }
-.tosm7cf::-webkit-slider-thumb {
+._7zr6ktf::-webkit-slider-thumb {
   -webkit-appearance: none;
   appearance: none;
   width: 2rem;
@@ -87,7 +87,7 @@
   -webkit-transition: all .35s ease;
   transition: all .35s ease;
 }
-.tosm7cf::-moz-range-thumb {
+._7zr6ktf::-moz-range-thumb {
   width: 2rem;
   height: 2rem;
   border: 1px solid #2670af;
@@ -97,29 +97,29 @@
   -moz-transition: all .35s ease;
   transition: all .35s ease;
 }
-.tosm7cf::-webkit-slider-thumb:hover {
+._7zr6ktf::-webkit-slider-thumb:hover {
   -webkit-transform: scale(1.2);
   transform: scale(1.2);
 }
-.tosm7cf::-moz-range-thumb:hover {
+._7zr6ktf::-moz-range-thumb:hover {
   transform: scale(1.2);
 }
 @media screen and (max-width:1023px) {
-  .tosm7c5 {
+  ._7zr6kt5 {
     width: 100%;
   }
-  .tosm7c8 {
+  ._7zr6kt8 {
     flex-direction: column;
   }
-  .tosm7cg {
+  ._7zr6ktg {
     padding-top: 0!important;
   }
-  .tosm7ch {
+  ._7zr6kth {
     padding-bottom: 0!important;
   }
 }
 @media screen and (max-width:600px) {
-  .tosm7c5 {
+  ._7zr6kt5 {
     padding: 2rem;
   }
 }

package/dist/assets/{ApyCalculator → Calculators/ApyCalculator}/ApyCalculator.css

@@ -1,51 +1,51 @@
-._74vxga1 {
+._1vox1xj1 {
   background: var(--_1073cm81);
   color: var(--_1073cm82);
 }
-._74vxga2 {
+._1vox1xj2 {
   background: var(--_1073cm88);
   color: var(--_1073cm89);
 }
-._74vxga3 {
+._1vox1xj3 {
   background: var(--_1073cm8f);
   color: var(--_1073cm8g);
 }
-._74vxga4 {
+._1vox1xj4 {
   background: var(--_1073cm8m);
   color: var(--_1073cm8n);
 }
-._74vxga5 {
+._1vox1xj5 {
   padding: 2.5rem 0;
 }
-._74vxga6 {
+._1vox1xj6 {
   width: 100%;
 }
-._74vxga7 {
+._1vox1xj7 {
   margin-bottom: 2.5rem;
   max-width: 49.5rem;
   text-align: center;
   margin-inline: auto;
 }
-._74vxga9 {
+._1vox1xj9 {
   color: red;
   font-size: larger;
   list-style: none;
 }
-._74vxgaa {
+._1vox1xja {
   max-width: 792px;
   margin: 0 auto;
 }
-._74vxgab {
+._1vox1xjb {
   margin-top: 1rem;
 }
-._74vxgab label {
+._1vox1xjb label {
   padding-left: 3px;
   font-size: 18px;
   font-weight: 600;
   margin-bottom: 5px;
   display: inline-block;
 }
-._74vxgab input, ._74vxgab select {
+._1vox1xjb input, ._1vox1xjb select {
   border-radius: 1rem;
   outline: 0;
   padding: 1rem 2rem;
@@ -53,101 +53,102 @@
   letter-spacing: .3px;
   color: #363636;
   -webkit-appearance: none;
+  height: 59px;
 }
-._74vxgab .input_label {
+._1vox1xjb .input_label {
   color: inherit;
 }
-._74vxgac {
+._1vox1xjc {
   position: relative;
 }
-._74vxgad {
+._1vox1xjd {
   position: absolute;
   color: #323339;
   font-size: 18px;
   font-weight: 500!important;
   margin-bottom: 0;
 }
-._74vxgae {
+._1vox1xje {
   left: 21px;
   top: 46px;
 }
-._74vxgaf {
+._1vox1xjf {
   top: 47px;
   right: 10px;
 }
-._74vxgag {
+._1vox1xjg {
   padding-left: 2rem;
 }
-._74vxgai {
+._1vox1xji {
   width: 100%;
 }
-._74vxgaj > p {
+._1vox1xjj > p {
   font-size: 14px;
   line-height: 1.3;
   margin-bottom: 10px;
   letter-spacing: .2px;
 }
-._74vxgak {
+._1vox1xjk {
   display: flex!important;
   flex-direction: column;
   align-items: center;
 }
-._74vxgal {
+._1vox1xjl {
   padding: 2rem;
   width: 100%;
 }
-._74vxgam {
+._1vox1xjm {
   margin-bottom: 1rem;
 }
-._1073cm80 ._74vxgao {
+._1073cm80 ._1vox1xjo {
   -webkit-background-clip: text;
   background-image: var(--_1073cm84);
   -webkit-text-fill-color: transparent;
   text-shadow: 0px 0px #00000000;
 }
-._1es6o1h0 ._74vxgao {
+._1es6o1h0 ._1vox1xjo {
   color: var(--_1073cm83);
 }
-._1073cm80 ._74vxgap {
+._1073cm80 ._1vox1xjp {
   -webkit-background-clip: text;
   background-image: var(--_1073cm8b);
   -webkit-text-fill-color: transparent;
   text-shadow: 0px 0px #00000000;
 }
-._1es6o1h0 ._74vxgap {
+._1es6o1h0 ._1vox1xjp {
   color: var(--_1073cm8a);
 }
-._74vxgaq {
+._1vox1xjq {
   color: var(--_1073cm8h);
 }
-._74vxgar {
+._1vox1xjr {
   color: var(--_1073cm8o);
 }
-._74vxgas {
+._1vox1xjs {
   margin-top: 0.5rem;
 }
-._74vxgat {
+._1vox1xjt {
   padding-inline-start: 0;
 }
 @media screen and (max-width:1124px) {
-  ._74vxga5 {
+  ._1vox1xj5 {
     flex-wrap: wrap;
     justify-content: center;
   }
-  ._74vxgak {
+  ._1vox1xjk {
     margin-top: 2rem;
   }
 }
 @media screen and (min-width:1125px) {
-  ._74vxga6 {
+  ._1vox1xj6 {
     margin-right: 2rem;
   }
 }
 @media screen and (max-width:1023px) {
-  ._74vxgab input, ._74vxgab select {
+  ._1vox1xjb input, ._1vox1xjb select {
     font-size: 1rem;
   }
-  ._74vxgaj {
+  ._1vox1xjj {
     margin-top: 1rem;
   }
 }

package/dist/assets/Calculators/MarginTradingCalculator/MarginTradingCalculator.css

@@ -0,0 +1,107 @@
+._1mgfcbj0 {
+  width: 100%;
+}
+._1mgfcbj1 {
+  width: 50%;
+}
+._1mgfcbj2 {
+  gap: 24px;
+}
+._1mgfcbj3 {
+  flex-basis: 50%;
+}
+._1mgfcbj4 {
+  font-size: 36px;
+}
+._1mgfcbj5 {
+  background-image: linear-gradient(185deg,#1e3860 14.64%,#13818b 85.36%);
+}
+._1mgfcbj6 {
+  border-bottom: 4px solid #d4d4d4;
+}
+._1mgfcbj7 {
+  margin: 1rem 0;
+}
+._1mgfcbj8 {
+  width: 100%;
+  border-spacing: 0;
+}
+._1mgfcbj9 {
+  padding: 10px;
+  border: 1px solid #d4d4d4!important;
+  height: 50px;
+}
+._1mgfcbja {
+  border-top-left-radius: 1rem;
+  background-color: #ace1fc;
+}
+._1mgfcbjb {
+  border-top-right-radius: 1rem;
+}
+._1mgfcbjc {
+  border-bottom-left-radius: 1rem;
+}
+._1mgfcbjd {
+  border-bottom-right-radius: 1rem;
+}
+._1mgfcbje {
+  border-bottom: 0!important;
+}
+._1mgfcbjf {
+  background-color: #ace1fc;
+}
+._1mgfcbjg {
+  font-weight: 600;
+}
+._1mgfcbjh {
+  font-size: 22px;
+  font-weight: 600;
+}
+._1mgfcbji {
+  height: 50px;
+}
+._1mgfcbjj {
+  width: 25%;
+}
+._1mgfcbjp {
+  padding: 2.5rem 0;
+}
+@media screen and (max-width: 1023px) {
+  ._1mgfcbjk {
+    flex-direction: column;
+  }
+  ._1mgfcbjl {
+    flex-direction: row;
+    width: 100%;
+    margin-top: 32px;
+    margin-left: 0;
+  }
+}
+@media screen and (max-width: 768px) {
+  ._1mgfcbjl {
+    flex-direction: column;
+  }
+}
+@media screen and (max-width: 603px) {
+  ._1mgfcbjm {
+    font-size: 32px;
+  }
+}
+@media screen and (max-width: 500px) {
+  ._1mgfcbjm {
+    font-size: 24px;
+  }
+}
+@media screen and (max-width: 400px) {
+  ._1mgfcbjm {
+    font-size: 20px;
+  }
+  ._1mgfcbjo {
+    font-size: 14px;
+  }
+}
+@media screen and (max-width: 502px) {
+  ._1mgfcbjn {
+    font-size: 12px;
+  }
+}

package/dist/assets/{MonthlyPaymentCalculator → Calculators/MonthlyPaymentCalculator}/MonthlyPaymentCalculator.css

@@ -1,29 +1,29 @@
-._17fwn0a1 {
+._10pitvc1 {
   background: var(--_1073cm81);
   color: var(--_1073cm82);
 }
-._17fwn0a2 {
+._10pitvc2 {
   background: var(--_1073cm88);
   color: var(--_1073cm89);
 }
-._17fwn0a3 {
+._10pitvc3 {
   background: var(--_1073cm8f);
   color: var(--_1073cm8g);
 }
-._17fwn0a4 {
+._10pitvc4 {
   background: var(--_1073cm8m);
   color: var(--_1073cm8n);
 }
-._17fwn0a5 {
+._10pitvc5 {
   width: 33%;
   padding: 0 1rem;
 }
-._17fwn0a6 {
+._10pitvc6 {
   height: 50px;
   border-radius: 8px;
   margin-top: .5rem;
 }
-._17fwn0a7 {
+._10pitvc7 {
   background: var(--_1073cm84);
   background-clip: text;
   -webkit-text-fill-color: transparent;
@@ -31,13 +31,13 @@
   font-size: 2.5rem;
   font-weight: 700;
 }
-._17fwn0a8 {
+._10pitvc8 {
   padding: 2rem;
 }
-._17fwn0a9 {
+._10pitvc9 {
   align-items: flex-start;
 }
-._17fwn0a5 input {
+._10pitvc5 input {
   width: 100%;
 }
 select {
@@ -47,20 +47,24 @@ select {
   background: url(https://images.axos.com/o9ov1v03uwqk/4ayjjdIkEzQsfmhKbPeNaE/636b57923fbdac891d48f78ca06ffeb6/image_1_-_2024-06-27T142052.191.png) no-repeat 95%;
   background-color: #fff;
 }
-._17fwn0aa {
+._10pitvca {
   font-weight: 700;
   font-size: 24px;
   color: #666;
 }
-._17fwn0ab {
+._10pitvcb {
   color: #d0021b;
 }
+._10pitvcc {
+  font-size: 34px!important;
+  line-height: 1.25;
+}
 @media screen and (max-width:1023px) {
-  ._17fwn0a5 {
+  ._10pitvc5 {
     width: 100%;
     margin-bottom: 1rem;
   }
-  ._17fwn0a9 {
+  ._10pitvc9 {
     align-items: center;
     flex-direction: column;
   }

package/dist/main.d.ts

@@ -1,7 +1,6 @@
 export * from './ATMLocator';
 export * from './Accordion';
 export * from './AlertBanner';
-export * from './ApyCalculator';
 export * from './Article';
 export * from './ArticlesSet';
 export * from './Avatar';
@@ -10,6 +9,10 @@ export * from './AwardsItem';
 export * from './BulletItem';
 export * from './Button';
 export * from './Calculators';
+export * from './Calculators/AnnualFeeCalculator';
+export * from './Calculators/ApyCalculator';
+export * from './Calculators/MarginTradingCalculator';
+export * from './Calculators/MonthlyPaymentCalculator';
 export * from './CallToActionBar';
 export * from './Carousel';
 export * from './Chevron';

package/dist/main.js

@@ -3,7 +3,6 @@ import { ATMLocator } from "./ATMLocator/ATMLocator.js";
 import { Accordion, AccordionCtx, AccordionDetails, AccordionHeader } from "./Accordion/Accordion.js";
 import { accordion, bodyAccordion, headerAccordion, headerContent, hide, icon, paragraph } from "./Accordion/Accordion.css.js";
 import { AlertBanner } from "./AlertBanner/index.js";
-import { ApyCalculator } from "./ApyCalculator/index.js";
 import { Article } from "./Article/Article.js";
 import { ant_article, ant_card_body, ant_card_cta, ant_card_title, ant_content, ant_eyebrow, ant_img } from "./Article/Article.css.js";
 import { ArticlesSet } from "./ArticlesSet/ArticlesSet.js";
@@ -19,6 +18,10 @@ import { button } from "./Button/Button.css.js";
 import { GoBackButton } from "./Button/GoBackButton.js";
 import { Calculator } from "./Calculators/Calculator.js";
 import { calculator_description, calculator_headline } from "./Calculators/calculator.css.js";
+import { AnnualFeeCalculator } from "./Calculators/AnnualFeeCalculator/index.js";
+import { ApyCalculator } from "./Calculators/ApyCalculator/index.js";
+import { MarginTradingCalculator } from "./Calculators/MarginTradingCalculator/index.js";
+import { MonthlyPaymentCalculator } from "./Calculators/MonthlyPaymentCalculator/index.js";
 import { CallToActionBar } from "./CallToActionBar/index.js";
 import { Carousel, CarouselSlide } from "./Carousel/index.js";
 import { Chevron } from "./Chevron/index.js";
@@ -150,6 +153,7 @@ export {
   AccordionItemContent,
   AccordionItemSummary,
   AlertBanner,
+  AnnualFeeCalculator,
   ApplicationStart,
   ApyCalculator,
   default6 as ArrowIcon,
@@ -217,8 +221,10 @@ export {
   LoadingIndicator,
   default18 as LockIcon,
   MainHTML,
+  MarginTradingCalculator,
   default19 as MemberFdicLogo,
   Modal,
+  MonthlyPaymentCalculator,
   default3 as NavBarAAS,
   default5 as NavBarAFS,
   default2 as NavBarAXA,