@axos-web-dev/shared-components 1.0.95-dev.1 → 1.0.95-feature-brand.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (151) hide show
  1. package/dist/Article/Article.css.d.ts +8 -36
  2. package/dist/AwardsBanner/AwardsBanner.css.js +4 -1
  3. package/dist/AwardsItem/AwardsItem.css.js +1 -2
  4. package/dist/Blockquote/Blockquote.module.js +3 -3
  5. package/dist/Button/Button.css.d.ts +3 -3
  6. package/dist/Calculators/calculator.css.d.ts +2 -8
  7. package/dist/CallToActionBar/index.js +1 -1
  8. package/dist/Carousel/Carousel.css.d.ts +8 -19
  9. package/dist/Carousel/index.js +8 -8
  10. package/dist/Chevron/Chevron.css.d.ts +2 -2
  11. package/dist/CollectInformationAlert/index.js +1 -1
  12. package/dist/Comparison/Comparison.js +5 -5
  13. package/dist/FooterSiteMap/AxosBank/FooterSiteMap.js +3 -3
  14. package/dist/Forms/Forms.css.d.ts +2 -30
  15. package/dist/HeroBanner/HeroBanner.css.d.ts +5 -17
  16. package/dist/HeroBanner/HeroBanner.js +1 -12
  17. package/dist/HeroBanner/SelectionBanner.css.d.ts +1 -19
  18. package/dist/HeroBanner/SelectionBanner.css.js +6 -6
  19. package/dist/IconBillboard/IconBillboard.css.d.ts +6 -40
  20. package/dist/IconBillboard/IconBillboard.d.ts +1 -2
  21. package/dist/IconBillboard/IconBillboard.js +27 -109
  22. package/dist/IconBillboard/index.js +1 -2
  23. package/dist/IconBillboard/sections/CallToActionSection.d.ts +12 -0
  24. package/dist/IconBillboard/sections/CallToActionSection.js +99 -0
  25. package/dist/IconBillboard/sections/HeaderSection.d.ts +11 -0
  26. package/dist/IconBillboard/sections/HeaderSection.js +23 -0
  27. package/dist/IconBillboard/sections/IconSection.d.ts +7 -0
  28. package/dist/IconBillboard/sections/IconSection.js +18 -0
  29. package/dist/IconBillboard/sections/ItemsSection.d.ts +11 -0
  30. package/dist/IconBillboard/sections/ItemsSection.js +11 -0
  31. package/dist/IconBillboard/sections/LayoutSection.d.ts +8 -0
  32. package/dist/IconBillboard/sections/LayoutSection.js +6 -0
  33. package/dist/ImageBillboard/ImageBillboard.css.d.ts +5 -61
  34. package/dist/ImageBillboard/ImageBillboardSet.js +1 -1
  35. package/dist/ImageLink/ImageLinkSet.js +2 -2
  36. package/dist/Insight/Featured/Featured.js +8 -8
  37. package/dist/Insight/Featured/Header.js +7 -7
  38. package/dist/LoadingIndicator/LoadingIndicator.css.d.ts +4 -4
  39. package/dist/Modal/Modal.css.d.ts +1 -0
  40. package/dist/Modal/Modal.css.js +5 -3
  41. package/dist/Modal/Modal.js +3 -3
  42. package/dist/NavigationMenu/AxosBank/MobileMenu/MobileMenu.js +2 -2
  43. package/dist/NavigationMenu/AxosBank/MobileMenu/MobileMenu.module.js +16 -16
  44. package/dist/NavigationMenu/AxosBank/NavBar.css.js +2 -1
  45. package/dist/NavigationMenu/AxosBank/NavBar.module.js +41 -41
  46. package/dist/NavigationMenu/AxosBank/SubNavBar.js +227 -220
  47. package/dist/NavigationMenu/AxosBank/SubNavbar.css.d.ts +2 -0
  48. package/dist/NavigationMenu/AxosBank/SubNavbar.css.js +4 -0
  49. package/dist/PageNavItem/PageNavItem.css.d.ts +4 -14
  50. package/dist/Pagination/Pagination.js +6 -6
  51. package/dist/StepItem/StepItem.css.d.ts +8 -36
  52. package/dist/StepItemSet/StepItemSet.css.d.ts +4 -32
  53. package/dist/StepItemSet/StepItemSet.d.ts +1 -1
  54. package/dist/StepItemSet/StepItemSet.js +18 -82
  55. package/dist/StepItemSet/index.d.ts +5 -0
  56. package/dist/StepItemSet/index.js +10 -0
  57. package/dist/StepItemSet/sections/AdditionalDetailsSection.d.ts +7 -0
  58. package/dist/StepItemSet/sections/AdditionalDetailsSection.js +11 -0
  59. package/dist/StepItemSet/sections/CallToActionSection.d.ts +8 -0
  60. package/dist/StepItemSet/sections/CallToActionSection.js +39 -0
  61. package/dist/StepItemSet/sections/HeaderSection.d.ts +10 -0
  62. package/dist/StepItemSet/sections/HeaderSection.js +45 -0
  63. package/dist/StepItemSet/sections/ImageSection.d.ts +8 -0
  64. package/dist/StepItemSet/sections/ImageSection.js +10 -0
  65. package/dist/StepItemSet/sections/StepsList.d.ts +10 -0
  66. package/dist/StepItemSet/sections/StepsList.js +21 -0
  67. package/dist/Table/Table.css.d.ts +3 -2
  68. package/dist/Table/Table.js +1 -1
  69. package/dist/assets/Accordion/Accordion.css +1 -1
  70. package/dist/assets/Article/Article.css +47 -59
  71. package/dist/assets/ArticlesSet/ArticlesSet.css +12 -12
  72. package/dist/assets/Auth/SignIn.css +12 -12
  73. package/dist/assets/AwardsBanner/AwardsBanner.css +1 -1
  74. package/dist/assets/AwardsItem/AwardsItem.css +3 -4
  75. package/dist/assets/Blockquote/Blockquote.css.css +68 -68
  76. package/dist/assets/Button/Button.css +21 -21
  77. package/dist/assets/Calculators/AnnualFeeCalculator/AnnualFeeCalculator.css +8 -8
  78. package/dist/assets/Calculators/ApyCalculator/ApyCalculator.css +10 -10
  79. package/dist/assets/Calculators/AxosOneCalculator/BalanceAPYCalculator.css +9 -9
  80. package/dist/assets/Calculators/BalanceAPYCalculator/BalanceAPYCalculator.css +19 -19
  81. package/dist/assets/Calculators/BuyDownCalculator/BuyDownCalculator.css +14 -14
  82. package/dist/assets/Calculators/MonthlyPaymentCalculator/MonthlyPaymentCalculator.css +9 -9
  83. package/dist/assets/Calculators/MonthlyPaymentLVFCalculator/MonthlyPaymentCalculator.css +9 -9
  84. package/dist/assets/Calculators/SummitApyCalculator/BalanceAPYCalculator.css +9 -9
  85. package/dist/assets/Calculators/calculator.css +9 -15
  86. package/dist/assets/CallToActionBar/CallToActionBar.css +1 -4
  87. package/dist/assets/Carousel/Carousel.css +27 -41
  88. package/dist/assets/Chevron/Chevron.css +6 -6
  89. package/dist/assets/CollectInformationAlert/CollectInformationAlert.css +4 -3
  90. package/dist/assets/Comparison/Comparison.css +3 -3
  91. package/dist/assets/ContentBanner/ContentBanner.css +8 -8
  92. package/dist/assets/DownloadTile/DownloadTile.css +3 -3
  93. package/dist/assets/ExecutiveBio/ExecutiveBio.css +23 -23
  94. package/dist/assets/FaqAccordion/FaqAccordion.css +4 -4
  95. package/dist/assets/FooterDisclosure/FooterDisclosure.css +1 -1
  96. package/dist/assets/FooterSiteMap/AxosBank/FooterSiteMap.css +3 -3
  97. package/dist/assets/Forms/Forms.css +38 -56
  98. package/dist/assets/Forms/QuickPricer/UserInformation.css +1 -1
  99. package/dist/assets/HeroBanner/HeroBanner.css +81 -76
  100. package/dist/assets/HeroBanner/LargeBanner.css +13 -13
  101. package/dist/assets/HeroBanner/SelectionBanner.css +15 -29
  102. package/dist/assets/IconBillboard/IconBillboard.css +25 -48
  103. package/dist/assets/ImageBillboard/ImageBillboard.css +29 -62
  104. package/dist/assets/Input/Input.css +6 -6
  105. package/dist/assets/Inputs/Input.css +4 -4
  106. package/dist/assets/Insight/Featured/CategorySelector.css +1 -1
  107. package/dist/assets/Interstitial/Interstitial-variants.css +3 -3
  108. package/dist/assets/LandingPageHeader/LandingPageHeader.css +1 -1
  109. package/dist/assets/LoadingIndicator/LoadingIndicator.css +5 -5
  110. package/dist/assets/Modal/Modal.css +17 -28
  111. package/dist/assets/NavigationMenu/AxosALTS/NavBar.css +1 -1
  112. package/dist/assets/NavigationMenu/AxosAdvisor/NavBar.css +2 -2
  113. package/dist/assets/NavigationMenu/AxosAdvisor/SubNavbar.css +4 -4
  114. package/dist/assets/NavigationMenu/AxosAdvisorServices/NavBar.css +2 -2
  115. package/dist/assets/NavigationMenu/AxosAdvisorServices/SubNavbar.css +4 -4
  116. package/dist/assets/NavigationMenu/AxosBank/MobileMenu/MobileMenu.css.css +191 -191
  117. package/dist/assets/NavigationMenu/AxosBank/NavBar.css +19 -9
  118. package/dist/assets/NavigationMenu/AxosBank/NavBar.css.css +446 -473
  119. package/dist/assets/NavigationMenu/AxosBank/SubNavbar.css +35 -1
  120. package/dist/assets/PageNavItem/PageNavItem.css +16 -24
  121. package/dist/assets/Pagination/Pagination.css +1 -1
  122. package/dist/assets/SetContainer/SetContainer.css +4 -4
  123. package/dist/assets/StepItem/StepItem.css +26 -42
  124. package/dist/assets/StepItemSet/StepItemSet.css +13 -26
  125. package/dist/assets/Tab/Tab.css +12 -12
  126. package/dist/assets/Table/Table.css +48 -56
  127. package/dist/assets/TextBlock/TextBlock.css +1 -1
  128. package/dist/assets/TopicalNavItem/TopicalNavItem.css +2 -2
  129. package/dist/assets/TopicalNavSet/TopicalNavSet.css +1 -1
  130. package/dist/assets/VideoTile/VideoTile.css +1 -1
  131. package/dist/assets/globals.css +5 -6
  132. package/dist/assets/icons/ArrowIcon/ArrowIcon.css +3 -3
  133. package/dist/assets/icons/DownloadIcon/DownloadIcon.css +1 -1
  134. package/dist/assets/icons/FollowIcon/FollowIcon.css +1 -1
  135. package/dist/assets/themes/axos.css +30 -30
  136. package/dist/assets/themes/premier.css +31 -31
  137. package/dist/assets/themes/victorie.css +23 -23
  138. package/dist/icons/CheckCircle.js +1 -1
  139. package/dist/icons/CheckCircleLight.js +1 -1
  140. package/dist/icons/CheckIcon/index.js +1 -1
  141. package/dist/icons/QuoteIconGrey.js +2 -2
  142. package/dist/main.js +11 -2
  143. package/dist/themes/axos.css.d.ts +12 -12
  144. package/dist/themes/axos.css.js +1 -1
  145. package/package.json +1 -1
  146. package/dist/NavigationMenu/NavDataJson.d.ts +0 -2
  147. package/dist/NavigationMenu/NavDataJson.js +0 -308
  148. package/dist/NavigationMenu/Navbar.d.ts +0 -5
  149. package/dist/NavigationMenu/Navbar.js +0 -329
  150. package/dist/NavigationMenu/SignInNavButton.d.ts +0 -1
  151. package/dist/NavigationMenu/SignInNavButton.js +0 -362
@@ -1,5 +1,5 @@
1
1
  import { ChevronProps } from '../Chevron/Chevron.interface';
2
- import { PropsWithChildren, ReactNode } from 'react';
2
+ import { ReactNode } from 'react';
3
3
  import { ImageInterface } from '.';
4
4
  import { ContainerVariants, LayoutVariants } from './IconBillboard.css';
5
5
 
@@ -15,5 +15,4 @@ export interface FocusProps {
15
15
  set?: boolean;
16
16
  id?: string;
17
17
  }
18
- export declare const Icon: ({ children }: PropsWithChildren) => import("react/jsx-runtime").JSX.Element;
19
18
  export declare const IconBillboard: (props: FocusProps & ContainerVariants & LayoutVariants) => import("react/jsx-runtime").JSX.Element;
@@ -1,15 +1,14 @@
1
1
  "use client";
2
- import { jsx, jsxs } from "react/jsx-runtime";
2
+ import { jsxs, jsx } from "react/jsx-runtime";
3
3
  import clsx from "clsx";
4
- import { useRef, useState, useEffect, createElement } from "react";
5
- import { BulletItem } from "../BulletItem/BulletItem.js";
6
- import { Chevron } from "../Chevron/index.js";
4
+ import { useRef, useState, useEffect } from "react";
7
5
  import { getVariant } from "../utils/getVariant.js";
8
- import { Button } from "../Button/Button.js";
9
- import "../Button/Button.css.js";
10
- import "react-use";
11
- import { billboard_icon, layout, headerIconBillboard, title, list, content, buttons, containerIconBillboard, link_wrapper } from "./IconBillboard.css.js";
12
- const Icon = ({ children }) => /* @__PURE__ */ jsx("div", { className: billboard_icon, role: "presentation", children });
6
+ import { content, containerIconBillboard, link_wrapper } from "./IconBillboard.css.js";
7
+ import { LayoutSection } from "./sections/LayoutSection.js";
8
+ import { IconSection } from "./sections/IconSection.js";
9
+ import { HeaderSection } from "./sections/HeaderSection.js";
10
+ import { ItemsSection } from "./sections/ItemsSection.js";
11
+ import { useFullClick, CallToActionSection } from "./sections/CallToActionSection.js";
13
12
  const IconBillboard = (props) => {
14
13
  const {
15
14
  callToActionRow,
@@ -36,123 +35,42 @@ const IconBillboard = (props) => {
36
35
  }
37
36
  }
38
37
  }, []);
39
- let chevronCount = 0;
40
- let buttonCount = 0;
41
- let chevronUrl;
42
- let chevronText;
43
- if (callToActionRow && callToActionRow.length > 0) {
44
- callToActionRow.forEach((cta) => {
45
- if (cta.type === "Button") {
46
- buttonCount++;
47
- } else {
48
- chevronCount++;
49
- chevronUrl = cta.targetUrl;
50
- chevronText = cta.displayText;
51
- }
52
- });
53
- }
54
- const isClickable = chevronCount === 1 && buttonCount === 0 && typeof chevronUrl === "string" && chevronUrl.length > 0;
55
- const handleClick = (e) => {
56
- if (!isClickable) return;
57
- const linkEl = e.currentTarget.querySelector("a");
58
- if (linkEl && linkEl instanceof HTMLAnchorElement) {
59
- window.location.href = linkEl.href;
60
- }
61
- };
38
+ const { isClickable, handleClick, chevronText } = useFullClick(callToActionRow);
62
39
  return /* @__PURE__ */ jsxs(
63
40
  "div",
64
41
  {
42
+ id,
43
+ onClick: handleClick,
44
+ role: isClickable ? "link" : void 0,
45
+ title: isClickable ? chevronText : void 0,
65
46
  className: clsx(
66
47
  containerIconBillboard({ variant }),
67
48
  `${set ? "" : "containment"}`,
68
49
  "billboard rounded flex_col gap_24 is_icon",
69
50
  isClickable && link_wrapper
70
51
  ),
71
- id,
72
- onClick: handleClick,
73
- role: isClickable ? "link" : void 0,
74
- title: isClickable ? chevronText : void 0,
75
52
  children: [
76
- /* @__PURE__ */ jsxs("div", { className: `flex_col middle ${layout({ side })}`, children: [
77
- icon && /* @__PURE__ */ jsx(Icon, { children: /* @__PURE__ */ jsx(
78
- "img",
79
- {
80
- src: icon?.src,
81
- alt: icon?.alt ?? "",
82
- className: "img_fluid",
83
- height: icon?.height,
84
- width: icon?.width
85
- }
86
- ) }),
87
- /* @__PURE__ */ jsxs("div", { className: clsx(content), children: [
88
- /* @__PURE__ */ jsxs("div", { className: headerIconBillboard, children: [
89
- headline && createElement(
53
+ /* @__PURE__ */ jsxs(LayoutSection, { side, children: [
54
+ /* @__PURE__ */ jsx(IconSection, { icon }),
55
+ /* @__PURE__ */ jsxs("div", { className: content, children: [
56
+ /* @__PURE__ */ jsx(
57
+ HeaderSection,
58
+ {
59
+ headline,
90
60
  headingLevel,
91
- {
92
- ref: headingRef,
93
- className: `${title({ variant })}`
94
- },
95
- headline
96
- ),
97
- body && /* @__PURE__ */ jsx("div", { children: body })
98
- ] }),
99
- items && items?.length > 0 && /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx("ul", { className: clsx(list, "list_unstyled"), children: items?.map((item) => /* @__PURE__ */ jsx(BulletItem, { id: item.id, variant, children: item.content }, item.id)) }) })
61
+ headingRef,
62
+ body,
63
+ variant
64
+ }
65
+ ),
66
+ /* @__PURE__ */ jsx(ItemsSection, { items, variant })
100
67
  ] })
101
68
  ] }),
102
- callToActionRow && /* @__PURE__ */ jsx("div", { className: buttons, children: callToActionRow.map(
103
- ({
104
- id: id2,
105
- variant: variant2,
106
- displayText,
107
- targetUrl,
108
- type,
109
- marketingIntersitial,
110
- newTab,
111
- ...rest
112
- }) => type === "Button" ? rest.as == "button" ? /* @__PURE__ */ jsx(
113
- Button,
114
- {
115
- targetUrl,
116
- color: getVariant(variant2),
117
- size: "medium",
118
- rounded: "medium",
119
- marketingIntersitial,
120
- newTab,
121
- as: "button",
122
- type: "button",
123
- action: rest?.onClick,
124
- children: displayText
125
- },
126
- id2
127
- ) : /* @__PURE__ */ jsx(
128
- Button,
129
- {
130
- targetUrl,
131
- color: getVariant(variant2),
132
- size: "medium",
133
- rounded: "medium",
134
- marketingIntersitial,
135
- newTab,
136
- children: displayText
137
- },
138
- id2
139
- ) : /* @__PURE__ */ jsx(
140
- Chevron,
141
- {
142
- targetUrl,
143
- variant: getVariant(variant2),
144
- marketingIntersitial,
145
- newTab,
146
- children: displayText
147
- },
148
- id2
149
- )
150
- ) })
69
+ /* @__PURE__ */ jsx(CallToActionSection, { callToActionRow })
151
70
  ]
152
71
  }
153
72
  );
154
73
  };
155
74
  export {
156
- Icon,
157
75
  IconBillboard
158
76
  };
@@ -1,8 +1,7 @@
1
- import { Icon, IconBillboard } from "./IconBillboard.js";
1
+ import { IconBillboard } from "./IconBillboard.js";
2
2
  import { billboard_icon, buttons, containerIconBillboard, content, headerIconBillboard, header_section, layout, link_wrapper, list, listItem, section_body, section_container, section_text, title } from "./IconBillboard.css.js";
3
3
  import { IconBillboardSet } from "./IconBillboardSet.js";
4
4
  export {
5
- Icon,
6
5
  IconBillboard,
7
6
  IconBillboardSet,
8
7
  billboard_icon,
@@ -0,0 +1,12 @@
1
+ import { ChevronProps } from '../../Chevron/Chevron.interface';
2
+
3
+ interface CallToActionSectionProps {
4
+ callToActionRow?: ChevronProps[];
5
+ }
6
+ export declare const useFullClick: (callToActionRow?: ChevronProps[]) => {
7
+ isClickable: boolean;
8
+ handleClick: (e: React.MouseEvent<HTMLDivElement>) => void;
9
+ chevronText: string | undefined;
10
+ };
11
+ export declare const CallToActionSection: ({ callToActionRow }: CallToActionSectionProps) => import("react/jsx-runtime").JSX.Element | null;
12
+ export {};
@@ -0,0 +1,99 @@
1
+ "use client";
2
+ import { jsx } from "react/jsx-runtime";
3
+ import { Button } from "../../Button/Button.js";
4
+ import "../../Button/Button.css.js";
5
+ import { useMemo } from "react";
6
+ import "react-use";
7
+ import { buttons } from "../IconBillboard.css.js";
8
+ import { Chevron } from "../../Chevron/index.js";
9
+ import { getVariant } from "../../utils/getVariant.js";
10
+ const useFullClick = (callToActionRow) => {
11
+ return useMemo(() => {
12
+ let chevronCount = 0;
13
+ let buttonCount = 0;
14
+ let chevronUrl;
15
+ let chevronText;
16
+ if (callToActionRow && callToActionRow.length > 0) {
17
+ callToActionRow.forEach((cta) => {
18
+ if (cta.type === "Button") {
19
+ buttonCount++;
20
+ } else {
21
+ chevronCount++;
22
+ chevronUrl = cta.targetUrl;
23
+ chevronText = cta.displayText;
24
+ }
25
+ });
26
+ }
27
+ const isClickable = chevronCount === 1 && buttonCount === 0 && typeof chevronUrl === "string" && chevronUrl.length > 0;
28
+ const handleClick = (e) => {
29
+ if (!isClickable) return;
30
+ const linkEl = e.currentTarget.querySelector("a");
31
+ if (linkEl && linkEl instanceof HTMLAnchorElement) {
32
+ window.location.href = linkEl.href;
33
+ }
34
+ };
35
+ return {
36
+ isClickable,
37
+ handleClick,
38
+ chevronText
39
+ };
40
+ }, [callToActionRow]);
41
+ };
42
+ const CallToActionSection = ({ callToActionRow }) => {
43
+ if (!Array.isArray(callToActionRow) || callToActionRow.length === 0) {
44
+ return null;
45
+ }
46
+ return /* @__PURE__ */ jsx("div", { className: buttons, children: callToActionRow.map(
47
+ ({
48
+ id,
49
+ variant,
50
+ displayText,
51
+ targetUrl,
52
+ type,
53
+ marketingIntersitial,
54
+ newTab,
55
+ ...rest
56
+ }) => type === "Button" ? rest.as == "button" ? /* @__PURE__ */ jsx(
57
+ Button,
58
+ {
59
+ targetUrl,
60
+ color: getVariant(variant),
61
+ size: "medium",
62
+ rounded: "medium",
63
+ marketingIntersitial,
64
+ newTab,
65
+ as: "button",
66
+ type: "button",
67
+ action: rest?.onClick,
68
+ children: displayText
69
+ },
70
+ id
71
+ ) : /* @__PURE__ */ jsx(
72
+ Button,
73
+ {
74
+ targetUrl,
75
+ color: getVariant(variant),
76
+ size: "medium",
77
+ rounded: "medium",
78
+ marketingIntersitial,
79
+ newTab,
80
+ children: displayText
81
+ },
82
+ id
83
+ ) : /* @__PURE__ */ jsx(
84
+ Chevron,
85
+ {
86
+ targetUrl,
87
+ variant: getVariant(variant),
88
+ marketingIntersitial,
89
+ newTab,
90
+ children: displayText
91
+ },
92
+ id
93
+ )
94
+ ) });
95
+ };
96
+ export {
97
+ CallToActionSection,
98
+ useFullClick
99
+ };
@@ -0,0 +1,11 @@
1
+ import { ReactNode, Ref } from 'react';
2
+ import { QuaternaryTypes } from '../../utils';
3
+
4
+ export interface HeaderSectionProps {
5
+ body?: ReactNode | undefined;
6
+ headingLevel: "h2" | "h3";
7
+ headingRef: Ref<HTMLHeadingElement>;
8
+ headline?: ReactNode | undefined;
9
+ variant: QuaternaryTypes;
10
+ }
11
+ export declare const HeaderSection: ({ body, headingLevel, headingRef, headline, variant, }: HeaderSectionProps) => import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,23 @@
1
+ import { jsxs, jsx } from "react/jsx-runtime";
2
+ import React from "react";
3
+ import { headerIconBillboard, title } from "../IconBillboard.css.js";
4
+ const HeaderSection = ({
5
+ body,
6
+ headingLevel,
7
+ headingRef,
8
+ headline,
9
+ variant
10
+ }) => /* @__PURE__ */ jsxs("div", { className: headerIconBillboard, children: [
11
+ headline && React.createElement(
12
+ headingLevel,
13
+ {
14
+ ref: headingRef,
15
+ className: `${title({ variant })}`
16
+ },
17
+ headline
18
+ ),
19
+ body && /* @__PURE__ */ jsx("div", { children: body })
20
+ ] });
21
+ export {
22
+ HeaderSection
23
+ };
@@ -0,0 +1,7 @@
1
+ import { ImageInterface } from '..';
2
+
3
+ interface IconSectionProps {
4
+ icon?: ImageInterface;
5
+ }
6
+ export declare const IconSection: ({ icon }: IconSectionProps) => import("react/jsx-runtime").JSX.Element | null;
7
+ export {};
@@ -0,0 +1,18 @@
1
+ import { jsx } from "react/jsx-runtime";
2
+ import { billboard_icon } from "../IconBillboard.css.js";
3
+ const IconSection = ({ icon }) => {
4
+ if (!icon) return null;
5
+ return /* @__PURE__ */ jsx("div", { className: billboard_icon, role: "presentation", children: /* @__PURE__ */ jsx(
6
+ "img",
7
+ {
8
+ src: icon?.src,
9
+ alt: icon?.alt ?? "",
10
+ className: "img_fluid",
11
+ height: icon?.height,
12
+ width: icon?.width
13
+ }
14
+ ) });
15
+ };
16
+ export {
17
+ IconSection
18
+ };
@@ -0,0 +1,11 @@
1
+ import { ReactNode } from 'react';
2
+ import { QuaternaryTypes } from '../../utils';
3
+
4
+ export interface ItemsSectionProps {
5
+ items?: {
6
+ id: string;
7
+ content: ReactNode;
8
+ }[];
9
+ variant: QuaternaryTypes;
10
+ }
11
+ export declare const ItemsSection: ({ items, variant }: ItemsSectionProps) => import("react/jsx-runtime").JSX.Element | null;
@@ -0,0 +1,11 @@
1
+ import { jsx } from "react/jsx-runtime";
2
+ import clsx from "clsx";
3
+ import { list } from "../IconBillboard.css.js";
4
+ import { BulletItem } from "../../BulletItem/BulletItem.js";
5
+ const ItemsSection = ({ items, variant }) => {
6
+ if (!items || items.length === 0) return null;
7
+ return /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx("ul", { className: clsx(list, "list_unstyled"), children: items.map((item) => /* @__PURE__ */ jsx(BulletItem, { id: item.id, variant, children: item.content }, item.id)) }) });
8
+ };
9
+ export {
10
+ ItemsSection
11
+ };
@@ -0,0 +1,8 @@
1
+ import { ReactNode } from 'react';
2
+
3
+ interface LayoutSectionProps {
4
+ side: boolean;
5
+ children: ReactNode;
6
+ }
7
+ export declare const LayoutSection: ({ side, children }: LayoutSectionProps) => import("react/jsx-runtime").JSX.Element;
8
+ export {};
@@ -0,0 +1,6 @@
1
+ import { jsx } from "react/jsx-runtime";
2
+ import { layout } from "../IconBillboard.css.js";
3
+ const LayoutSection = ({ side, children }) => /* @__PURE__ */ jsx("div", { className: `flex_col middle ${layout({ side })}`, children });
4
+ export {
5
+ LayoutSection
6
+ };
@@ -3,7 +3,7 @@ export declare const billboard: import('@vanilla-extract/recipes').RuntimeFn<{
3
3
  primary: {
4
4
  background: `var(--${string})`;
5
5
  color: `var(--${string})`;
6
- border: "1px solid #D4D4D4";
6
+ border: "1px solid #B9C1CE";
7
7
  };
8
8
  secondary: {
9
9
  background: `var(--${string})`;
@@ -58,38 +58,10 @@ export declare const imagePlacement: import('@vanilla-extract/recipes').RuntimeF
58
58
  export declare const supertag: import('@vanilla-extract/recipes').RuntimeFn<{
59
59
  variant: {
60
60
  primary: {
61
- selectors: {
62
- [x: string]: {
63
- WebkitBackgroundClip: "text";
64
- backgroundImage: `var(--${string})`;
65
- WebkitTextFillColor: "transparent";
66
- textShadow: "0px 0px #00000000";
67
- color?: undefined;
68
- } | {
69
- color: `var(--${string})`;
70
- WebkitBackgroundClip?: undefined;
71
- backgroundImage?: undefined;
72
- WebkitTextFillColor?: undefined;
73
- textShadow?: undefined;
74
- };
75
- };
61
+ color: `var(--${string})`;
76
62
  };
77
63
  secondary: {
78
- selectors: {
79
- [x: string]: {
80
- WebkitBackgroundClip: "text";
81
- backgroundImage: `var(--${string})`;
82
- WebkitTextFillColor: "transparent";
83
- textShadow: "0px 0px #00000000";
84
- color?: undefined;
85
- } | {
86
- color: `var(--${string})`;
87
- WebkitBackgroundClip?: undefined;
88
- backgroundImage?: undefined;
89
- WebkitTextFillColor?: undefined;
90
- textShadow?: undefined;
91
- };
92
- };
64
+ color: `var(--${string})`;
93
65
  };
94
66
  tertiary: {
95
67
  color: `var(--${string})`;
@@ -102,38 +74,10 @@ export declare const supertag: import('@vanilla-extract/recipes').RuntimeFn<{
102
74
  export declare const header: import('@vanilla-extract/recipes').RuntimeFn<{
103
75
  variant: {
104
76
  primary: {
105
- selectors: {
106
- [x: string]: {
107
- WebkitBackgroundClip: "text";
108
- backgroundImage: `var(--${string})`;
109
- WebkitTextFillColor: "transparent";
110
- textShadow: "0px 0px #00000000";
111
- color?: undefined;
112
- } | {
113
- color: `var(--${string})`;
114
- WebkitBackgroundClip?: undefined;
115
- backgroundImage?: undefined;
116
- WebkitTextFillColor?: undefined;
117
- textShadow?: undefined;
118
- };
119
- };
77
+ color: `var(--${string})`;
120
78
  };
121
79
  secondary: {
122
- selectors: {
123
- [x: string]: {
124
- WebkitBackgroundClip: "text";
125
- backgroundImage: `var(--${string})`;
126
- WebkitTextFillColor: "transparent";
127
- textShadow: "0px 0px #00000000";
128
- color?: undefined;
129
- } | {
130
- color: `var(--${string})`;
131
- WebkitBackgroundClip?: undefined;
132
- backgroundImage?: undefined;
133
- WebkitTextFillColor?: undefined;
134
- textShadow?: undefined;
135
- };
136
- };
80
+ color: `var(--${string})`;
137
81
  };
138
82
  tertiary: {
139
83
  color: `var(--${string})`;
@@ -53,7 +53,7 @@ const ImageBillboard = ({
53
53
  if (headingRef.current) {
54
54
  const section = headingRef.current.closest("section");
55
55
  if (section) {
56
- const existingH2 = section.querySelector("h2.header_2.mb_16");
56
+ const existingH2 = section.querySelector("h2._1r4ovbuj");
57
57
  if (existingH2) {
58
58
  setHeadingLevel("h3");
59
59
  }
@@ -1,6 +1,7 @@
1
1
  import { jsx, jsxs, Fragment } from "react/jsx-runtime";
2
2
  import "clsx";
3
3
  import "react";
4
+ import { getVariant } from "../utils/getVariant.js";
4
5
  import { buttons } from "../IconBillboard/IconBillboard.css.js";
5
6
  import "../icons/ArrowIcon/ArrowIcon.css.js";
6
7
  import "../icons/CheckIcon/CheckIcon.css.js";
@@ -10,13 +11,12 @@ import '../assets/VideoWrapper/VideoWrapper.css';import '../assets/TopicalNavSet
10
11
  /* empty css */
11
12
  /* empty css */
12
13
  import "../utils/allowedAxosDomains.js";
13
- import { getVariant } from "../utils/getVariant.js";
14
14
  /* empty css */
15
15
  /* empty css */
16
- import { Chevron } from "../Chevron/index.js";
17
16
  import { Button } from "../Button/Button.js";
18
17
  import "../Button/Button.css.js";
19
18
  import "react-use";
19
+ import { Chevron } from "../Chevron/index.js";
20
20
  import { SetContainer } from "../SetContainer/SetContainer.js";
21
21
  import "../SetContainer/SetContainer.css.js";
22
22
  import "../Accordion/Accordion.js";
@@ -1,32 +1,27 @@
1
1
  import { jsxs, jsx } from "react/jsx-runtime";
2
2
  import clsx from "clsx";
3
3
  import { Fragment } from "react";
4
+ import { getVariant } from "../../utils/getVariant.js";
4
5
  import { title } from "../../IconBillboard/IconBillboard.css.js";
5
6
  import "../../icons/ArrowIcon/ArrowIcon.css.js";
6
7
  import "../../icons/CheckIcon/CheckIcon.css.js";
7
8
  import ClockIcon from "../../icons/Clock/index.js";
8
- 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/Calculators/MarginTradingCalculator/MarginTradingCalculator.css';import '../../assets/Forms/QuickPricer/UserInformation.css';import '../../assets/Forms/QuickPricer/QuickPricerResults.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 */
9
+ 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/Calculators/MarginTradingCalculator/MarginTradingCalculator.css';import '../../assets/Forms/QuickPricer/UserInformation.css';import '../../assets/Modal/Modal.css';import '../../assets/Forms/QuickPricer/QuickPricerResults.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 */
9
10
  /* empty css */
10
11
  /* empty css */
11
12
  /* empty css */
12
13
  /* empty css */
13
14
  import "../../utils/allowedAxosDomains.js";
14
- import { getVariant } from "../../utils/getVariant.js";
15
15
  /* empty css */
16
16
  /* empty css */
17
17
  import "../../Accordion/Accordion.js";
18
18
  import "../../Accordion/Accordion.css.js";
19
19
  import "../../AlertBanner/AlertBanner.css.js";
20
20
  import "../../Article/Article.css.js";
21
- import "../../Interstitial/Interstitial-variants.css.js";
22
- import "../../Chevron/Chevron.css.js";
23
- /* empty css */
24
- import "../../Modal/contextApi/store.js";
25
- import "../../Button/Button.css.js";
26
- import "react-use";
27
21
  import "../../ArticlesSet/ArticlesSet.css.js";
28
22
  import "../../Calculators/calculator.css.js";
29
23
  import "../../Calculators/AnnualFeeCalculator/AnnualFeeCalculator.css.js";
24
+ import "../../Button/Button.css.js";
30
25
  import "../../Calculators/ApyCalculator/ApyCalculator.css.js";
31
26
  import "../../Table/Table.css.js";
32
27
  import "../../Calculators/AxosOneCalculator/BalanceAPYCalculator.css.js";
@@ -49,8 +44,13 @@ import "../../Forms/SalesforceFieldsForm.js";
49
44
  import "../../Input/RadioButton.css.js";
50
45
  import "../../Input/Checkbox.css.js";
51
46
  import "../../LoadingIndicator/LoadingIndicator.css.js";
47
+ import "react-use";
48
+ import "../../Chevron/Chevron.css.js";
49
+ import "../../Interstitial/Interstitial-variants.css.js";
52
50
  import "../../Inputs/Input.css.js";
53
51
  /* empty css */
52
+ /* empty css */
53
+ import "../../Modal/contextApi/store.js";
54
54
  import "../../Hyperlink/Hyperlink.css.js";
55
55
  /* empty css */
56
56
  import "iframe-resizer";
@@ -4,7 +4,7 @@ import "react";
4
4
  import { title } from "../../IconBillboard/IconBillboard.css.js";
5
5
  import "../../icons/ArrowIcon/ArrowIcon.css.js";
6
6
  import "../../icons/CheckIcon/CheckIcon.css.js";
7
- 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/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/Calculators/MarginTradingCalculator/MarginTradingCalculator.css';import '../../assets/Forms/QuickPricer/UserInformation.css';import '../../assets/Forms/QuickPricer/QuickPricerResults.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 */
7
+ 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/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/Calculators/MarginTradingCalculator/MarginTradingCalculator.css';import '../../assets/Forms/QuickPricer/UserInformation.css';import '../../assets/Modal/Modal.css';import '../../assets/Forms/QuickPricer/QuickPricerResults.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 */
8
8
  /* empty css */
9
9
  /* empty css */
10
10
  /* empty css */
@@ -16,15 +16,10 @@ import "../../Accordion/Accordion.js";
16
16
  import "../../Accordion/Accordion.css.js";
17
17
  import "../../AlertBanner/AlertBanner.css.js";
18
18
  import "../../Article/Article.css.js";
19
- import "../../Interstitial/Interstitial-variants.css.js";
20
- import "../../Chevron/Chevron.css.js";
21
- /* empty css */
22
- import "../../Modal/contextApi/store.js";
23
- import "../../Button/Button.css.js";
24
- import "react-use";
25
19
  import "../../ArticlesSet/ArticlesSet.css.js";
26
20
  import "../../Calculators/calculator.css.js";
27
21
  import "../../Calculators/AnnualFeeCalculator/AnnualFeeCalculator.css.js";
22
+ import "../../Button/Button.css.js";
28
23
  import "../../Calculators/ApyCalculator/ApyCalculator.css.js";
29
24
  import "../../Table/Table.css.js";
30
25
  import "../../Calculators/AxosOneCalculator/BalanceAPYCalculator.css.js";
@@ -47,8 +42,13 @@ import "../../Forms/SalesforceFieldsForm.js";
47
42
  import "../../Input/RadioButton.css.js";
48
43
  import "../../Input/Checkbox.css.js";
49
44
  import "../../LoadingIndicator/LoadingIndicator.css.js";
45
+ import "react-use";
46
+ import "../../Chevron/Chevron.css.js";
47
+ import "../../Interstitial/Interstitial-variants.css.js";
50
48
  import "../../Inputs/Input.css.js";
51
49
  /* empty css */
50
+ /* empty css */
51
+ import "../../Modal/contextApi/store.js";
52
52
  import "../../Hyperlink/Hyperlink.css.js";
53
53
  /* empty css */
54
54
  import "iframe-resizer";