@axos-web-dev/shared-components 0.0.85 → 0.0.87

package/dist/SetContainer/SetContainer.js

@@ -61,6 +61,7 @@ import "../FaqAccordion/index.js";
 import "../FooterDisclosure/FooterDisclosure.css.js";
 /* empty css                                                         */
 import "../ImageBillboard/ImageBillboard.css.js";
+import "../Interstitial/Interstitial-variants.css.js";
 import "../LandingPageHeader/LandingPageHeader.css.js";
 import "../Chevron/Chevron.css.js";
 /* empty css                                */

package/dist/Table/Table.css.d.ts

@@ -159,3 +159,4 @@ export declare const table: import('@vanilla-extract/recipes').RuntimeFn<{
 export declare const alternate_color_rows: string;
 export declare const apy_table: string;
 export declare const table_description_text: string;
+export declare const highlight_cell: string;

package/dist/Table/Table.css.js

@@ -17,12 +17,14 @@ var table = createRuntimeFn({ defaultClassName: "_1nivbwew", variantClassNames:
 var alternate_color_rows = "_1nivbwe11";
 var apy_table = "_1nivbwe12";
 var table_description_text = "_1nivbwe13 _1nivbwe3";
+var highlight_cell = "_1nivbwe14";
 export {
   alternate_color_rows,
   apy_table,
   bodyHeader,
   headerCell,
   headerVariants,
+  highlight_cell,
   highlight_first_row,
   highlight_last_row,
   table,

package/dist/Table/Table.interface.d.ts

@@ -1,6 +1,7 @@
 import { CSSProperties, HtmlHTMLAttributes, PropsWithChildren, ReactNode } from 'react';
 
 export interface RowProps extends HtmlHTMLAttributes<HTMLTableRowElement>, PropsWithChildren {
+    className?: string;
 }
 export interface CellProps extends HtmlHTMLAttributes<HTMLTableCellElement>, PropsWithChildren {
     as?: "td" | "th";

package/dist/Table/Table.js

@@ -66,7 +66,7 @@ const Table = ({
   );
 };
 const TableRow = ({ children, ...props }) => {
-  return /* @__PURE__ */ jsx("tr", { ...props, children });
+  return /* @__PURE__ */ jsx("tr", { className: props.className, ...props, children });
 };
 const TableHead = ({ children }) => {
   return /* @__PURE__ */ jsx("thead", { children });

package/dist/Table/index.js

@@ -1,5 +1,5 @@
 import { Table, TableBody, TableCell, TableContainer, TableHead, TableRow } from "./Table.js";
-import { alternate_color_rows, apy_table, bodyHeader, headerCell, headerVariants, highlight_first_row, highlight_last_row, table, tableWrapper, table_container, table_container_text, table_description_text, table_headline, td, th } from "./Table.css.js";
+import { alternate_color_rows, apy_table, bodyHeader, headerCell, headerVariants, highlight_cell, highlight_first_row, highlight_last_row, table, tableWrapper, table_container, table_container_text, table_description_text, table_headline, td, th } from "./Table.css.js";
 export {
   Table,
   TableBody,
@@ -12,6 +12,7 @@ export {
   bodyHeader,
   headerCell,
   headerVariants,
+  highlight_cell,
   highlight_first_row,
   highlight_last_row,
   table,

package/dist/assets/HeroBanner/HeroBanner.css

@@ -24,75 +24,75 @@
   justify-content: space-between;
   align-items: center;
 }
-._1ye8k3f8 {
+._1ye8k3f9 {
   padding: 2rem 0;
 }
-._1ye8k3fa {
+._1ye8k3fb {
   display: flex;
   justify-content: flex-end;
   max-width: 600px;
 }
-._1ye8k3fa img {
+._1ye8k3fb img {
   max-width: 604px;
   max-height: 480px;
   object-fit: cover;
 }
-._1ye8k3fb {
+._1ye8k3fc {
   display: block;
   font: 700 14px / 1.3 var(--main-font-family);
   margin-bottom: 2px;
   letter-spacing: .2px;
 }
-._1ye8k3fc {
+._1ye8k3fd {
   background: var(--_1073cm84);
   background-clip: text;
   -webkit-text-fill-color: transparent;
   text-shadow: 0px 0px #00000000;
 }
-._1ye8k3fd {
+._1ye8k3fe {
   background: var(--_1073cm8b);
   background-clip: text;
   -webkit-text-fill-color: transparent;
   text-shadow: 0px 0px #00000000;
 }
-._1ye8k3fe {
+._1ye8k3ff {
   color: var(--_1073cm8k);
 }
-._1ye8k3ff {
+._1ye8k3fg {
   color: var(--_1073cm8n);
 }
-._1ye8k3fg {
+._1ye8k3fh {
   font: 600 2.5rem / 1.25 var(--header-font-family);
 }
-._1ye8k3fh {
+._1ye8k3fi {
   background: var(--_1073cm84);
   background-clip: text;
   -webkit-text-fill-color: transparent;
   text-shadow: 0px 0px #00000000;
 }
-._1ye8k3fi {
+._1ye8k3fj {
   background: var(--_1073cm8b);
   background-clip: text;
   -webkit-text-fill-color: transparent;
   text-shadow: 0px 0px #00000000;
 }
-._1ye8k3fj {
+._1ye8k3fk {
   color: var(--_1073cm8h);
 }
-._1ye8k3fk {
+._1ye8k3fl {
   color: var(--_1073cm8o);
 }
-._1ye8k3f8 p {
+._1ye8k3f9 p {
   font: 400 18px / 1.44 var(--main-font-family);
   letter-spacing: .2px;
 }
-._1ye8k3fl {
+._1ye8k3fm {
   margin-top: 3.5rem;
   display: flex;
   align-items: center;
   gap: 2rem;
 }
-._1ye8k3fl:empty {
+._1ye8k3fm:empty {
   display: none;
 }
 @media screen and (min-width:1024px) {
@@ -100,34 +100,38 @@
     flex-direction: row-reverse;
   }
   ._1ye8k3f8 {
+    left: 0;
+    right: unset;
+  }
+  ._1ye8k3f9 {
     flex: 1 1;
     max-width: 588px;
   }
-  ._1ye8k3f0 ._1ye8k3f8 {
+  ._1ye8k3f0 ._1ye8k3f9 {
     max-width: 468px;
   }
 }
 @media screen and (max-width:1280px) {
-  ._1ye8k3fl {
+  ._1ye8k3fm {
     margin-top: 2.5rem;
   }
-  ._1ye8k3f0 ._1ye8k3fl {
+  ._1ye8k3f0 ._1ye8k3fm {
     flex-direction: column;
   }
-  ._7etqoq5 ._1ye8k3fl {
+  ._7etqoq5 ._1ye8k3fm {
     flex-direction: row;
     justify-content: center;
     flex-wrap: wrap;
   }
 }
 @media (max-width: 1280px) and (min-width: 1024px) {
-  ._1ye8k3f0 ._1ye8k3f9 {
+  ._1ye8k3f0 ._1ye8k3fa {
     width: calc(100%-28px);
   }
-  ._1ye8k3fa img {
+  ._1ye8k3fb img {
     aspect-ratio: 1 / 1;
   }
-  ._1ye8k3f0 ._1ye8k3fl {
+  ._1ye8k3f0 ._1ye8k3fm {
     align-items: flex-start;
   }
 }
@@ -135,19 +139,19 @@
   ._1ye8k3f6 {
     flex-direction: column;
   }
-  ._1ye8k3f8 {
+  ._1ye8k3f9 {
     text-align: center;
   }
-  ._1ye8k3fl {
+  ._1ye8k3fm {
     flex-direction: column;
   }
 }
 @media (max-width: 1023px) {
-  ._1ye8k3fa {
+  ._1ye8k3fb {
     justify-content: center;
     width: min(375px,100%);
   }
-  ._1ye8k3fa img {
+  ._1ye8k3fb img {
     max-width: 100%;
   }
 }
@@ -160,7 +164,7 @@
     min-height: 740px;
     gap: 1.5rem;
   }
-  ._1ye8k3fa {
+  ._1ye8k3fb {
     min-height: 480px;
     _1ye8k3f0 & {
       max-width: 708px;
@@ -168,38 +172,38 @@
   }
 }
 @media screen and (max-width:603px) {
-  ._1ye8k3f8 {
+  ._1ye8k3f9 {
     max-width: calc(100% - 2rem);
     margin-left: auto;
     margin-right: auto;
   }
 }
 @media (max-width: 603px) {
-  ._1ye8k3f9 {
+  ._1ye8k3fa {
     width: 100%;
     max-width: 100%;
   }
 }
 @media (max-width: 450px) {
-  ._1ye8k3fa {
+  ._1ye8k3fb {
     width: 100%;
   }
 }
 @media screen and (max-width:768px) {
-  ._1ye8k3fg {
+  ._1ye8k3fh {
     font-size: 28px;
     line-height: 1.29;
   }
-  ._1ye8k3f8 p {
+  ._1ye8k3f9 p {
     font-size: 1rem;
     line-height: 1.5;
   }
-  ._1ye8k3fl {
+  ._1ye8k3fm {
     margin-top: 1.7rem;
   }
 }
 @media (max-width:1280px) and (min-width:1024px) {
-  ._1ye8k3fa:not(._1ye8k3f0 ._1ye8k3fa) {
+  ._1ye8k3fb:not(._1ye8k3f0 ._1ye8k3fb) {
     flex: 1 1;
     overflow: hidden;
   }

package/dist/assets/HeroBanner/SelectionBanner.css

@@ -69,6 +69,7 @@
   ._7etqoq5 {
     width: 100vw;
     padding: 2rem 0;
+    min-height: auto;
   }
   ._7etqoq7 {
     width: min(45rem, calc(100% - 4rem));

package/dist/assets/Interstitial/Interstitial-variants.css

@@ -0,0 +1,9 @@
+.ep91dm0 {
+  font: 600 28px / 1.29 var(--header-font-family);
+}
+.ep91dm1 {
+  color: var(--_1073cm83);
+}
+.ep91dm2 {
+  color: var(--_1073cm8a);
+}

package/dist/assets/Interstitial/Interstitial.css.css

@@ -0,0 +1,137 @@
+@keyframes _appear_1euix_1 {
+  0% {
+    opacity: 0;
+    transform: scale(0.9);
+  }
+  to {
+    opacity: 1;
+    transform: scale(1);
+  }
+}
+@keyframes _vanish_1euix_1 {
+  0% {
+    display: block;
+    opacity: 1;
+    transform: scale(1);
+  }
+  to {
+    display: none;
+    opacity: 0;
+    transform: scale(0.9);
+  }
+}
+
+._overlay_1euix_24 {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: rgba(0, 0, 0, 0.4);
+  display: none;
+  align-items: center;
+  justify-content: center;
+}
+
+._overlay_1euix_24.active {
+  display: flex;
+}
+
+._modal_1euix_40 {
+  animation: _vanish_1euix_1 0.45s ease;
+  background: #fff;
+  border-radius: 16px;
+  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+  position: relative;
+  transition: transform 0.45s ease;
+  width: min(calc(100% - 2rem), 800px);
+  overflow: hidden;
+}
+
+._modal_1euix_40.active {
+  animation: _appear_1euix_1 0.45s ease;
+}
+
+._close_button_1euix_55 {
+  position: absolute;
+  background-color: rgba(255, 255, 255, 0.3);
+  border-radius: 8px;
+  border: none;
+  color: #4a5560;
+  cursor: pointer;
+  font-size: 1.9rem;
+  line-height: 1;
+  right: 1.5rem;
+  text-align: center;
+  top: 1.5rem;
+  width: 32px;
+}
+
+._modal_content_1euix_70 {
+  padding: 16px 24px 24px;
+}
+
+._img_area_1euix_74 {
+  background-position: center center;
+  background-size: cover;
+  height: 418px;
+}
+
+body:has(._overlay_1euix_24.active) {
+  overflow-y: hidden;
+}
+
+._body_copy_1euix_84 {
+  margin-top: 8px;
+}
+
+._body_copy_1euix_84 > * {
+  color: #333d46;
+}
+
+._body_copy_1euix_84 > p {
+  text-align: center;
+  font-size: 16px;
+  line-height: 1.5;
+}
+
+._btns_1euix_98 {
+  display: flex;
+  align-items: center;
+  gap: 2rem;
+  padding-top: 16px;
+  margin-top: 16px;
+  width: 100%;
+  justify-content: center;
+}
+
+._btns_1euix_98:empty {
+  display: none;
+}
+
+._modal_content_1euix_70:nth-child(2) h2 {
+  margin-top: 31px;
+}
+
+@media (max-width: 1023px) {
+  ._btns_1euix_98 {
+    flex-direction: column-reverse;
+  }
+}
+
+@media (max-width: 832px) {
+  ._img_area_1euix_74 {
+    height: calc(12.25rem + ((1vw - 3.75px) * 48.5777));
+  }
+}
+
+@media (max-width: 500px) {
+  ._modal_1euix_40 {
+    width: calc(100% - 1rem);
+  }
+  ._overlay_1euix_24.active {
+    align-items: flex-start;
+    overflow-y: scroll;
+    padding-top: 40px;
+  }
+}

package/dist/assets/SetContainer/SetContainer.css

@@ -1,6 +1,3 @@
-._18ygy9m0 {
-  padding: 3rem 0;
-}
 ._18ygy9m1 {
   background: var(--_1073cm81);
 }
@@ -25,6 +22,7 @@
   padding-bottom: 2.5rem;
   text-align: center;
   max-width: 1000px;
+  padding-top: 3rem;
 }
 ._18ygy9m5 .containment {
   width: 100%;
@@ -44,6 +42,7 @@
   padding-top: 2.5rem;
   text-align: center;
   max-width: 1000px;
+  padding-bottom: 2.5rem;
 }
 ._18ygy9ma {
   isolation: isolate;

package/dist/assets/Table/Table.css

@@ -215,7 +215,7 @@ tr:last-child td {
   background: #f4f4f4;
 }
 ._1nivbwe12 tr:nth-child(odd) td {
-  background: #ffffff !important;
+  background: #ffffff;
 }
 ._1nivbwe12 tr th:first-child {
   text-align: left;
@@ -269,6 +269,10 @@ td:has(.flex.middle span.img_fluid) .flex.middle {
 td:has(.flex.middle span.img_fluid) .img_fluid {
   min-width: 24px;
 }
+._1nivbwe14 {
+  background-image: linear-gradient(0deg,#152d54,#27466f) !important;
+  color: var(--_1073cm8g) !important;
+}
 @media screen and (max-width: 768px) {
   ._1nivbwed:first-child {
     box-shadow: 0 15px 20px 0px rgb(0 0 0 / 0.3);

package/dist/assets/globals.css

@@ -166,6 +166,12 @@ h1, h2, h3, h4, h5, h6, es_font {
   line-height: 36px;
   letter-spacing: 0.2px;
 }
+.header_4 {
+  font-weight: 600;
+  font-size: 20px;
+  line-height: 28px;
+  letter-spacing: 0.2px;
+}
 .gradient_text {
   background: linear-gradient(3deg, #051A3F 14.64%, #1E3860 48.42%, #4D85B0 85.36%);
   background-size: 100%;

package/dist/main.d.ts

@@ -32,6 +32,7 @@ export * from './IconBillboard';
 export * from './ImageBillboard';
 export * from './ImageLink';
 export * from './Input';
+export * from './Interstitial';
 export * from './LandingPageHeader';
 export * from './LoadingIndicator';
 export * from './MainHTML';

package/dist/main.js

@@ -56,7 +56,7 @@ import { ScheduleCallPremier } from "./Forms/ScheduleCallPremier.js";
 import { SuccesFormWrapper } from "./Forms/SuccesForm.js";
 import { WCPLSurvey } from "./Forms/WcplSurvey.js";
 import { HeroBanner } from "./HeroBanner/HeroBanner.js";
-import { headline_text, heroSupertag, hero_banner, hero_btns, hero_content, hero_img, hero_text, hero_wrapper, logout, reversed } from "./HeroBanner/HeroBanner.css.js";
+import { headline_text, heroSupertag, hero_banner, hero_btns, hero_content, hero_img, hero_text, hero_wrapper, logout, reversed, reversed_lg_image } from "./HeroBanner/HeroBanner.css.js";
 import { selection_headline_text, selection_section, selection_section_bg, selection_section_content, selection_section_icon, selection_section_icon_img } from "./HeroBanner/SelectionBanner.css.js";
 import { Hyperlink } from "./Hyperlink/index.js";
 import { IconBillboard } from "./IconBillboard/IconBillboard.js";
@@ -78,6 +78,7 @@ import { Input } from "./Input/Input.js";
 import { container, helperText, iconContainer, iconContainerBase, iconInput, input, labelClassName, wrapper } from "./Input/Input.css.js";
 import { InputPhone } from "./Input/InputPhone.js";
 import { InputTextArea } from "./Input/InputTextArea.js";
+import { Interstitial } from "./Interstitial/index.js";
 import { LandingPageHeader } from "./LandingPageHeader/LandingPageHeader.js";
 import { lp_container, lp_hover, lp_theme, svg_fill } from "./LandingPageHeader/LandingPageHeader.css.js";
 import { LoadingIndicator } from "./LoadingIndicator/index.js";
@@ -95,7 +96,7 @@ import { bs_copy, bs_topic, bullet_details, li, line_points, point, step_num } f
 import { StepItemSet } from "./StepItemSet/StepItemSet.js";
 import { bs_add_details, bs_btns, bs_image, bs_section, bs_wrapper, modifier, ol, sec_subtitle, sec_title, steps_wrapper, svg_logo, tablet_col } from "./StepItemSet/StepItemSet.css.js";
 import { Table, TableBody, TableCell, TableContainer, TableHead, TableRow } from "./Table/Table.js";
-import { alternate_color_rows, apy_table, bodyHeader, headerCell, headerVariants, highlight_first_row, highlight_last_row, table, tableWrapper, table_container, table_container_text, table_description_text, table_headline, td, th } from "./Table/Table.css.js";
+import { alternate_color_rows, apy_table, bodyHeader, headerCell, headerVariants, highlight_cell, highlight_first_row, highlight_last_row, table, tableWrapper, table_container, table_container_text, table_description_text, table_headline, td, th } from "./Table/Table.css.js";
 import { TextBlock } from "./TextBlock/TextBlock.js";
 import { textBlockHeader, textBlockList, textBlockParagraph } from "./TextBlock/TextBlock.css.js";
 import { picker_arrow, picker_itemContent, picker_itemProduct, picker_navIcon, picker_navItem } from "./TopicalNavItem/TopicalNavItem.css.js";
@@ -219,6 +220,7 @@ export {
   Input,
   InputPhone,
   InputTextArea,
+  Interstitial,
   LandingPageHeader,
   LoadingIndicator,
   default18 as LockIcon,
@@ -378,6 +380,7 @@ export {
   hero_wrapper,
   hide,
   hide_transcript,
+  highlight_cell,
   highlight_first_row,
   highlight_last_row,
   icon,
@@ -434,6 +437,7 @@ export {
   rate_container,
   rate_pad,
   reversed,
+  reversed_lg_image,
   sec_subtitle,
   sec_title,
   section_body,

package/dist/utils/allowedAxosDomains.js

@@ -9,7 +9,9 @@ const moreDomains = {
   "{IMAGEASSETSURL}": "https://images.axos.com",
   "{ONLINEBANKING}": "https://onlinebanking.uat.axsobank.com",
   "{UFBDIRECT}": "https://www.ufbdirect.com",
-  "{ARMS}": "https://arms.axosadvisor.com"
+  "{ARMS}": "https://arms.axosadvisor.com",
+  "{APPS}": "https://apps.axosbank.com",
+  "{AFP}": "https://afp.axosbank.com"
   // "assets.axos.com": "https://assets.axos.com",
   // "images.axos.com": "https://images.axos.com",
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@axos-web-dev/shared-components",
   "description": "Axos shared components library for web.",
-  "version": "0.0.85",
+  "version": "0.0.87",
   "type": "module",
   "module": "dist/main.js",
   "types": "dist/main.d.ts",