@axos-web-dev/shared-components 0.0.63 → 0.0.65
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.
- package/dist/BulletItem/BulletItem.d.ts +2 -1
- package/dist/BulletItem/BulletItem.js +2 -1
- package/dist/Carousel/index.js +1 -1
- package/dist/ImageLink/ImageLinkSet.js +1 -1
- package/dist/NavigationMenu/AxosAdvisorServices/NavBar.module.js +53 -53
- package/dist/NavigationMenu/AxosAdvisorServices/NavData.js +1 -1
- package/dist/NavigationMenu/AxosAdvisorServices/index.js +17 -13
- package/dist/SetContainer/SetContainer.js +1 -1
- package/dist/StepItem/StepItem.d.ts +1 -1
- package/dist/StepItem/StepItem.js +2 -2
- package/dist/StepItemSet/StepItemSet.js +1 -1
- package/dist/assets/NavigationMenu/AxosAdvisorServices/NavBar.css.css +602 -602
- package/dist/assets/StepItem/StepItem.css +4 -1
- package/dist/assets/StepItemSet/StepItemSet.css +6 -3
- package/package.json +1 -1
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
import { PropsWithChildren, ReactNode } from 'react';
|
|
2
|
+
import { QuaternaryTypes } from '../utils';
|
|
2
3
|
|
|
3
4
|
export interface BulletItemProps extends PropsWithChildren {
|
|
4
5
|
id: string;
|
|
5
|
-
variant?:
|
|
6
|
+
variant?: QuaternaryTypes;
|
|
6
7
|
icon?: {
|
|
7
8
|
src: string;
|
|
8
9
|
altText?: string;
|
|
@@ -10,6 +10,7 @@ import "../icons/CheckIcon/CheckIcon.css.js";
|
|
|
10
10
|
/* empty css */
|
|
11
11
|
import { vars } from "../themes/axos.css.js";
|
|
12
12
|
import { bulletIcon } from "./BulletItem.css.js";
|
|
13
|
+
import { getVariant } from "../utils/getVariant.js";
|
|
13
14
|
const BulletItem = (props) => {
|
|
14
15
|
const iconCheckVariant = /* @__PURE__ */ new Map([
|
|
15
16
|
[
|
|
@@ -44,7 +45,7 @@ const BulletItem = (props) => {
|
|
|
44
45
|
],
|
|
45
46
|
[void 0, /* @__PURE__ */ jsx(SvgCheckCircleLight, { height: 18, width: 18 })]
|
|
46
47
|
]);
|
|
47
|
-
const Icon = iconCheckVariant.get(props.variant);
|
|
48
|
+
const Icon = iconCheckVariant.get(getVariant(props.variant));
|
|
48
49
|
return /* @__PURE__ */ jsxs("li", { className: listItem, children: [
|
|
49
50
|
/* @__PURE__ */ jsx("span", { className: bulletIcon, children: Icon }),
|
|
50
51
|
/* @__PURE__ */ jsx("div", { children: props.children })
|
package/dist/Carousel/index.js
CHANGED
|
@@ -12,11 +12,11 @@ import SvgQuoteIconYellow from "../icons/QuoteIconYellow.js";
|
|
|
12
12
|
/* empty css */
|
|
13
13
|
/* empty css */
|
|
14
14
|
/* empty css */
|
|
15
|
+
import { getVariant } from "../utils/getVariant.js";
|
|
15
16
|
import "../Accordion/Accordion.js";
|
|
16
17
|
import "../Accordion/Accordion.css.js";
|
|
17
18
|
import "../AlertBanner/AlertBanner.css.js";
|
|
18
19
|
import "../Modal/contextApi/store.js";
|
|
19
|
-
import { getVariant } from "../utils/getVariant.js";
|
|
20
20
|
import clsx from "clsx";
|
|
21
21
|
import React, { useEffect, Children, cloneElement } from "react";
|
|
22
22
|
import "../Button/Button.css.js";
|
|
@@ -8,8 +8,8 @@ import "../icons/CheckIcon/CheckIcon.css.js";
|
|
|
8
8
|
/* empty css */
|
|
9
9
|
/* empty css */
|
|
10
10
|
/* empty css */
|
|
11
|
-
import { Chevron } from "../Chevron/index.js";
|
|
12
11
|
import { getVariant } from "../utils/getVariant.js";
|
|
12
|
+
import { Chevron } from "../Chevron/index.js";
|
|
13
13
|
import "clsx";
|
|
14
14
|
import { Button } from "../Button/Button.js";
|
|
15
15
|
import "../Button/Button.css.js";
|
|
@@ -1,56 +1,56 @@
|
|
|
1
|
-
const header = "
|
|
2
|
-
const wrapper = "
|
|
3
|
-
const header_main_row = "
|
|
4
|
-
const mobile_header = "
|
|
5
|
-
const logo_wrap = "
|
|
6
|
-
const primary_links = "
|
|
7
|
-
const main_nav_link = "
|
|
8
|
-
const sub_nav_link = "
|
|
9
|
-
const signin_wrap = "
|
|
10
|
-
const signin_btn = "
|
|
11
|
-
const sub_nav = "
|
|
12
|
-
const header_sub_row = "
|
|
13
|
-
const signin_dropdown = "
|
|
14
|
-
const shadow = "
|
|
15
|
-
const signin_header = "
|
|
16
|
-
const signin_subheader = "
|
|
17
|
-
const opacity = "
|
|
18
|
-
const fadeInDown = "
|
|
19
|
-
const footer = "
|
|
20
|
-
const open = "
|
|
21
|
-
const dd_wrapper = "
|
|
22
|
-
const dd_media = "
|
|
23
|
-
const dd_media_img = "
|
|
24
|
-
const dd_site_navs = "
|
|
25
|
-
const dd_media_header = "
|
|
26
|
-
const mt_8 = "
|
|
27
|
-
const mt_16 = "
|
|
28
|
-
const ml_8 = "
|
|
29
|
-
const dd_media_cta = "
|
|
30
|
-
const reversed_row = "
|
|
31
|
-
const headline = "
|
|
32
|
-
const nav_anchor = "
|
|
33
|
-
const headline_cta = "
|
|
34
|
-
const site_lists = "
|
|
35
|
-
const hamburger = "
|
|
36
|
-
const mobile_only = "
|
|
37
|
-
const mobile_logo = "
|
|
38
|
-
const highlight = "
|
|
39
|
-
const mobile_nav = "
|
|
40
|
-
const mobile_opened = "
|
|
41
|
-
const mobile_nav_item = "
|
|
42
|
-
const has_dropdown = "
|
|
43
|
-
const icon_wrap = "
|
|
44
|
-
const mobile_footer = "
|
|
45
|
-
const mobile_footer_content = "
|
|
46
|
-
const mobile_footer_media = "
|
|
47
|
-
const footer_cta = "
|
|
48
|
-
const inner_wrapper = "
|
|
49
|
-
const btn = "
|
|
50
|
-
const sub_menu = "
|
|
51
|
-
const main = "
|
|
52
|
-
const dd_footer = "
|
|
53
|
-
const desktop_only = "
|
|
1
|
+
const header = "_header_4yygj_1";
|
|
2
|
+
const wrapper = "_wrapper_4yygj_9";
|
|
3
|
+
const header_main_row = "_header_main_row_4yygj_21";
|
|
4
|
+
const mobile_header = "_mobile_header_4yygj_23";
|
|
5
|
+
const logo_wrap = "_logo_wrap_4yygj_35";
|
|
6
|
+
const primary_links = "_primary_links_4yygj_43";
|
|
7
|
+
const main_nav_link = "_main_nav_link_4yygj_51";
|
|
8
|
+
const sub_nav_link = "_sub_nav_link_4yygj_95";
|
|
9
|
+
const signin_wrap = "_signin_wrap_4yygj_99";
|
|
10
|
+
const signin_btn = "_signin_btn_4yygj_101";
|
|
11
|
+
const sub_nav = "_sub_nav_4yygj_95";
|
|
12
|
+
const header_sub_row = "_header_sub_row_4yygj_185";
|
|
13
|
+
const signin_dropdown = "_signin_dropdown_4yygj_217";
|
|
14
|
+
const shadow = "_shadow_4yygj_237";
|
|
15
|
+
const signin_header = "_signin_header_4yygj_253";
|
|
16
|
+
const signin_subheader = "_signin_subheader_4yygj_267";
|
|
17
|
+
const opacity = "_opacity_4yygj_311";
|
|
18
|
+
const fadeInDown = "_fadeInDown_4yygj_1";
|
|
19
|
+
const footer = "_footer_4yygj_323";
|
|
20
|
+
const open = "_open_4yygj_355";
|
|
21
|
+
const dd_wrapper = "_dd_wrapper_4yygj_379";
|
|
22
|
+
const dd_media = "_dd_media_4yygj_389";
|
|
23
|
+
const dd_media_img = "_dd_media_img_4yygj_399";
|
|
24
|
+
const dd_site_navs = "_dd_site_navs_4yygj_407";
|
|
25
|
+
const dd_media_header = "_dd_media_header_4yygj_421";
|
|
26
|
+
const mt_8 = "_mt_8_4yygj_439";
|
|
27
|
+
const mt_16 = "_mt_16_4yygj_447";
|
|
28
|
+
const ml_8 = "_ml_8_4yygj_455";
|
|
29
|
+
const dd_media_cta = "_dd_media_cta_4yygj_463";
|
|
30
|
+
const reversed_row = "_reversed_row_4yygj_491";
|
|
31
|
+
const headline = "_headline_4yygj_523";
|
|
32
|
+
const nav_anchor = "_nav_anchor_4yygj_535";
|
|
33
|
+
const headline_cta = "_headline_cta_4yygj_551";
|
|
34
|
+
const site_lists = "_site_lists_4yygj_581";
|
|
35
|
+
const hamburger = "_hamburger_4yygj_651";
|
|
36
|
+
const mobile_only = "_mobile_only_4yygj_679";
|
|
37
|
+
const mobile_logo = "_mobile_logo_4yygj_691";
|
|
38
|
+
const highlight = "_highlight_4yygj_701";
|
|
39
|
+
const mobile_nav = "_mobile_nav_4yygj_773";
|
|
40
|
+
const mobile_opened = "_mobile_opened_4yygj_795";
|
|
41
|
+
const mobile_nav_item = "_mobile_nav_item_4yygj_803";
|
|
42
|
+
const has_dropdown = "_has_dropdown_4yygj_833";
|
|
43
|
+
const icon_wrap = "_icon_wrap_4yygj_875";
|
|
44
|
+
const mobile_footer = "_mobile_footer_4yygj_885";
|
|
45
|
+
const mobile_footer_content = "_mobile_footer_content_4yygj_895";
|
|
46
|
+
const mobile_footer_media = "_mobile_footer_media_4yygj_923";
|
|
47
|
+
const footer_cta = "_footer_cta_4yygj_935";
|
|
48
|
+
const inner_wrapper = "_inner_wrapper_4yygj_991";
|
|
49
|
+
const btn = "_btn_4yygj_1001";
|
|
50
|
+
const sub_menu = "_sub_menu_4yygj_1011";
|
|
51
|
+
const main = "_main_4yygj_51";
|
|
52
|
+
const dd_footer = "_dd_footer_4yygj_1061";
|
|
53
|
+
const desktop_only = "_desktop_only_4yygj_1101";
|
|
54
54
|
const styles = {
|
|
55
55
|
header,
|
|
56
56
|
wrapper,
|
|
@@ -21,8 +21,12 @@ function NavBar() {
|
|
|
21
21
|
const signInToggle = () => setisOpenSignInToggle(!isOpenSignInToggle);
|
|
22
22
|
const mobileToggle = () => setisOpenMobile(!isOpenMobile);
|
|
23
23
|
const handleClick = (index) => setActiveIndex(index);
|
|
24
|
-
const [
|
|
25
|
-
const
|
|
24
|
+
const [isOpenProducts1, setisOpenProducts1] = useState(false);
|
|
25
|
+
const [isOpenProducts2, setisOpenProducts2] = useState(false);
|
|
26
|
+
const [isOpenProducts3, setisOpenProducts3] = useState(false);
|
|
27
|
+
const toggleProducts1 = () => setisOpenProducts1(!isOpenProducts1);
|
|
28
|
+
const toggleProducts2 = () => setisOpenProducts2(!isOpenProducts2);
|
|
29
|
+
const toggleProducts3 = () => setisOpenProducts3(!isOpenProducts3);
|
|
26
30
|
const getActiveIndex = () => {
|
|
27
31
|
const pathname = "/" + location.pathname.split("/")[1];
|
|
28
32
|
const index = navItems.findIndex(
|
|
@@ -236,7 +240,7 @@ function NavBar() {
|
|
|
236
240
|
}
|
|
237
241
|
) })
|
|
238
242
|
] }),
|
|
239
|
-
/* @__PURE__ */ jsx("div", { className: styles.mobile_body, children: /* @__PURE__ */ jsxs("ul", { className: "list_unstyled", "aria-expanded":
|
|
243
|
+
/* @__PURE__ */ jsx("div", { className: styles.mobile_body, children: /* @__PURE__ */ jsxs("ul", { className: "list_unstyled", "aria-expanded": isOpenMobile, children: [
|
|
240
244
|
/* @__PURE__ */ jsx("li", { className: `${styles.mobile_nav_item}`, children: /* @__PURE__ */ jsx(
|
|
241
245
|
"a",
|
|
242
246
|
{
|
|
@@ -256,7 +260,7 @@ function NavBar() {
|
|
|
256
260
|
"a",
|
|
257
261
|
{
|
|
258
262
|
href: "#",
|
|
259
|
-
onClick:
|
|
263
|
+
onClick: toggleProducts1,
|
|
260
264
|
role: "button",
|
|
261
265
|
className: clsx("flex_row", "between"),
|
|
262
266
|
children: [
|
|
@@ -266,7 +270,7 @@ function NavBar() {
|
|
|
266
270
|
{
|
|
267
271
|
className: clsx(
|
|
268
272
|
styles.icon_wrap,
|
|
269
|
-
|
|
273
|
+
isOpenProducts1 && styles.open
|
|
270
274
|
),
|
|
271
275
|
children: /* @__PURE__ */ jsx(
|
|
272
276
|
"svg",
|
|
@@ -293,7 +297,7 @@ function NavBar() {
|
|
|
293
297
|
/* @__PURE__ */ jsxs(
|
|
294
298
|
"div",
|
|
295
299
|
{
|
|
296
|
-
className: clsx(styles.sub_menu,
|
|
300
|
+
className: clsx(styles.sub_menu, isOpenProducts1 && expand),
|
|
297
301
|
children: [
|
|
298
302
|
/* @__PURE__ */ jsx(
|
|
299
303
|
"a",
|
|
@@ -337,7 +341,7 @@ function NavBar() {
|
|
|
337
341
|
"a",
|
|
338
342
|
{
|
|
339
343
|
href: "#",
|
|
340
|
-
onClick:
|
|
344
|
+
onClick: toggleProducts2,
|
|
341
345
|
role: "button",
|
|
342
346
|
className: clsx("flex_row", "between"),
|
|
343
347
|
children: [
|
|
@@ -347,7 +351,7 @@ function NavBar() {
|
|
|
347
351
|
{
|
|
348
352
|
className: clsx(
|
|
349
353
|
styles.icon_wrap,
|
|
350
|
-
|
|
354
|
+
isOpenProducts2 && styles.open
|
|
351
355
|
),
|
|
352
356
|
children: /* @__PURE__ */ jsx(
|
|
353
357
|
"svg",
|
|
@@ -374,7 +378,7 @@ function NavBar() {
|
|
|
374
378
|
/* @__PURE__ */ jsxs(
|
|
375
379
|
"div",
|
|
376
380
|
{
|
|
377
|
-
className: clsx(styles.sub_menu,
|
|
381
|
+
className: clsx(styles.sub_menu, isOpenProducts2 && expand),
|
|
378
382
|
children: [
|
|
379
383
|
/* @__PURE__ */ jsx(
|
|
380
384
|
"a",
|
|
@@ -409,7 +413,7 @@ function NavBar() {
|
|
|
409
413
|
"a",
|
|
410
414
|
{
|
|
411
415
|
href: "#",
|
|
412
|
-
onClick:
|
|
416
|
+
onClick: toggleProducts3,
|
|
413
417
|
role: "button",
|
|
414
418
|
className: clsx("flex_row", "between"),
|
|
415
419
|
children: [
|
|
@@ -419,7 +423,7 @@ function NavBar() {
|
|
|
419
423
|
{
|
|
420
424
|
className: clsx(
|
|
421
425
|
styles.icon_wrap,
|
|
422
|
-
|
|
426
|
+
isOpenProducts3 && styles.open
|
|
423
427
|
),
|
|
424
428
|
children: /* @__PURE__ */ jsx(
|
|
425
429
|
"svg",
|
|
@@ -446,7 +450,7 @@ function NavBar() {
|
|
|
446
450
|
/* @__PURE__ */ jsxs(
|
|
447
451
|
"div",
|
|
448
452
|
{
|
|
449
|
-
className: clsx(styles.sub_menu,
|
|
453
|
+
className: clsx(styles.sub_menu, isOpenProducts3 && expand),
|
|
450
454
|
children: [
|
|
451
455
|
/* @__PURE__ */ jsx(
|
|
452
456
|
"a",
|
|
@@ -476,7 +480,7 @@ function NavBar() {
|
|
|
476
480
|
/* @__PURE__ */ jsx(
|
|
477
481
|
"a",
|
|
478
482
|
{
|
|
479
|
-
href: "/growth-solutions/
|
|
483
|
+
href: "/growth-solutions/banking-and-lending-solutions",
|
|
480
484
|
role: "menuitem",
|
|
481
485
|
children: "Banking and Lending Solutions"
|
|
482
486
|
}
|
|
@@ -8,11 +8,11 @@ import "../icons/CheckIcon/CheckIcon.css.js";
|
|
|
8
8
|
/* empty css */
|
|
9
9
|
/* empty css */
|
|
10
10
|
/* empty css */
|
|
11
|
+
import { getVariant } from "../utils/getVariant.js";
|
|
11
12
|
import "../Accordion/Accordion.js";
|
|
12
13
|
import "../Accordion/Accordion.css.js";
|
|
13
14
|
import "../AlertBanner/AlertBanner.css.js";
|
|
14
15
|
import "../Modal/contextApi/store.js";
|
|
15
|
-
import { getVariant } from "../utils/getVariant.js";
|
|
16
16
|
import clsx from "clsx";
|
|
17
17
|
import "react";
|
|
18
18
|
import "../Button/Button.css.js";
|
|
@@ -15,8 +15,8 @@ const StepItem = ({
|
|
|
15
15
|
/* @__PURE__ */ jsx("div", { className: `flex center middle ${step_num({ variant })}`, children: counter })
|
|
16
16
|
] }) }),
|
|
17
17
|
/* @__PURE__ */ jsxs("div", { className: bullet_details, children: [
|
|
18
|
-
/* @__PURE__ */ jsx("span", { className: `${bs_topic({ variant })}`, role: "heading", children: title }),
|
|
19
|
-
/* @__PURE__ */ jsx("span", { className: bs_copy, children: /* @__PURE__ */ jsx(Fragment, { children: description }) })
|
|
18
|
+
title && /* @__PURE__ */ jsx("span", { className: `${bs_topic({ variant })}`, role: "heading", children: title }),
|
|
19
|
+
description && /* @__PURE__ */ jsx("span", { className: bs_copy, children: /* @__PURE__ */ jsx(Fragment, { children: description }) })
|
|
20
20
|
] })
|
|
21
21
|
] });
|
|
22
22
|
};
|
|
@@ -20,7 +20,7 @@ const StepItemSet = ({
|
|
|
20
20
|
}) => {
|
|
21
21
|
const variant = getVariant(fullVariant);
|
|
22
22
|
return /* @__PURE__ */ jsx("section", { className: `${bs_section({ variant })}`, id: `id_${id}`, children: /* @__PURE__ */ jsxs("div", { className: `${bs_wrapper} containment`, children: [
|
|
23
|
-
title || description && /* @__PURE__ */ jsxs("div", { className: "text_center", children: [
|
|
23
|
+
(title || description) && /* @__PURE__ */ jsxs("div", { className: "text_center", children: [
|
|
24
24
|
/* @__PURE__ */ jsxs(
|
|
25
25
|
"svg",
|
|
26
26
|
{
|