@axos-web-dev/shared-components 0.0.91 → 0.0.92

package/dist/NavigationMenu/AxosClearing/index.js

@@ -0,0 +1,470 @@
+"use client";
+import { jsxs, jsx } from "react/jsx-runtime";
+import { Button } from "../../Button/Button.js";
+import "../../Button/Button.css.js";
+import { useState, useRef, useEffect } from "react";
+import "react-use";
+import clsx from "clsx";
+import Image from "next/image.js";
+import Link from "next/link.js";
+import { NavItem } from "../NavItem/index.js";
+import { expand } from "./NavBar.css.js";
+import styles from "./NavBar.module.js";
+import { navItems } from "./NavData.js";
+import SubNavBar from "./SubNavBar.js";
+function NavBar() {
+  const [isOpenMobile, setisOpenMobile] = useState(false);
+  const [activeIndex, setActiveIndex] = useState();
+  const [lastNavItem, setLastNavItem] = useState();
+  const ref = useRef(null);
+  const mobileToggle = () => setisOpenMobile(!isOpenMobile);
+  const handleClick = (index) => setActiveIndex(index);
+  const [isOpenProducts1, setisOpenProducts1] = useState(false);
+  const [isOpenProducts2, setisOpenProducts2] = useState(false);
+  const [isOpenProducts3, setisOpenProducts3] = useState(false);
+  const toggleProducts1 = () => setisOpenProducts1(!isOpenProducts1);
+  const toggleProducts2 = () => setisOpenProducts2(!isOpenProducts2);
+  const toggleProducts3 = () => setisOpenProducts3(!isOpenProducts3);
+  const getActiveIndex = () => {
+    const pathname = "/" + location.pathname.split("/")[1];
+    const index = navItems.findIndex(
+      (path) => path.url === pathname
+    );
+    setActiveIndex(index);
+  };
+  useEffect(() => {
+    getActiveIndex();
+  }, [activeIndex]);
+  useEffect(() => {
+    setLastNavItem(navItems[navItems.length - 1]);
+  }, []);
+  return /* @__PURE__ */ jsxs("header", { id: "header", children: [
+    /* @__PURE__ */ jsx("div", { className: `${styles.header} bg_white`, children: /* @__PURE__ */ jsx("div", { className: styles.wrapper, children: /* @__PURE__ */ jsxs("div", { className: `${styles.header_main_row} flex_row between middle`, children: [
+      /* @__PURE__ */ jsx("div", { className: `${styles.desktop_only} flex_row middle`, children: /* @__PURE__ */ jsxs("div", { className: `${styles.main_nav} flex_row middle`, children: [
+        /* @__PURE__ */ jsx("div", { className: styles.logo_wrap, children: /* @__PURE__ */ jsx("a", { href: "/", "aria-label": "return to axos clearing homepage", children: /* @__PURE__ */ jsx(
+          Image,
+          {
+            src: "https://images.axos.com/o9ov1v03uwqk/1KWdk4xENAS8hmQRQWhviO/05df12996a96400c057b0066b4cf250f/axos-clearing-logo.svg",
+            alt: "",
+            width: 140,
+            height: 48,
+            priority: true
+          }
+        ) }) }),
+        /* @__PURE__ */ jsx("nav", { className: styles.primary_links, children: /* @__PURE__ */ jsx("ul", { className: "list_unstyled flex_row middle", role: "menu", children: navItems.map(
+          (item, i, arr) => arr.length - 1 !== i && /* @__PURE__ */ jsx(
+            NavItem,
+            {
+              className: styles.main_nav_link,
+              onClick: handleClick,
+              index: i,
+              name: item.name,
+              url: item.url,
+              isActive: activeIndex == i
+            },
+            i
+          )
+        ) }) })
+      ] }) }),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          className: clsx(styles.mobile_only, styles.hamburger),
+          onClick: mobileToggle,
+          children: /* @__PURE__ */ jsx(
+            "svg",
+            {
+              width: "24",
+              height: "24",
+              viewBox: "0 0 24 24",
+              fill: "none",
+              xmlns: "http://www.w3.org/2000/svg",
+              children: /* @__PURE__ */ jsx(
+                "path",
+                {
+                  fillRule: "evenodd",
+                  clipRule: "evenodd",
+                  d: "M22.5 15.75V17.25H1.5V15.75H22.5ZM22.5 11.25V12.75H1.5V11.25H22.5ZM22.5 6.75V8.25H1.5V6.75H22.5Z",
+                  fill: "#4A5560"
+                }
+              )
+            }
+          )
+        }
+      ),
+      /* @__PURE__ */ jsx("div", { className: `${styles.mobile_only} ${styles.mobile_logo}`, children: /* @__PURE__ */ jsx(Link, { href: "/", "aria-label": "return to axos bank homepage", children: /* @__PURE__ */ jsx(
+        Image,
+        {
+          src: "https://images.axos.com/o9ov1v03uwqk/1KWdk4xENAS8hmQRQWhviO/05df12996a96400c057b0066b4cf250f/axos-clearing-logo.svg",
+          alt: "",
+          width: 112,
+          height: 40
+        }
+      ) }) }),
+      /* @__PURE__ */ jsx("div", { className: styles.signin_wrap, children: /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: `${styles.desktop_only} flex_row middle relative`,
+          ref,
+          children: [
+            lastNavItem && /* @__PURE__ */ jsx(
+              NavItem,
+              {
+                url: lastNavItem.url,
+                name: lastNavItem.name,
+                className: `link list_unstyled ${styles.main_nav_link} ${styles.highlight}`,
+                isActive: activeIndex == navItems.length,
+                onClick: handleClick,
+                index: navItems.length
+              },
+              navItems.length + 1
+            ),
+            /* @__PURE__ */ jsxs(
+              Button,
+              {
+                className: clsx(
+                  styles.signin_btn,
+                  "flex_row",
+                  "center",
+                  "middle"
+                ),
+                as: "button",
+                type: "button",
+                color: "primary",
+                id: "signIn",
+                size: "small",
+                targetUrl: "/contact-us",
+                children: [
+                  /* @__PURE__ */ jsx("span", { children: "Get in Touch" }),
+                  /* @__PURE__ */ jsx(
+                    "svg",
+                    {
+                      width: "20",
+                      height: "12",
+                      viewBox: "0 0 20 12",
+                      fill: "none",
+                      xmlns: "http://www.w3.org/2000/svg",
+                      children: /* @__PURE__ */ jsx(
+                        "path",
+                        {
+                          d: "M0.46875 1.76574L9.99908 11.2961L19.5294 1.76574L18.4687 0.705078L9.99908 9.17491L1.52941 0.705078L0.46875 1.76574Z",
+                          fill: "#fff"
+                        }
+                      )
+                    }
+                  )
+                ]
+              }
+            )
+          ]
+        }
+      ) })
+    ] }) }) }),
+    /* @__PURE__ */ jsx(SubNavBar, {}),
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: clsx(
+          styles.mobile_nav,
+          styles.mobile_only,
+          "relative",
+          "bg_white",
+          isOpenMobile ? styles.mobile_opened : ""
+        ),
+        "aria-expanded": isOpenMobile,
+        role: "menu",
+        children: /* @__PURE__ */ jsxs("div", { className: clsx(styles.inner_wrapper, "bg_white"), children: [
+          /* @__PURE__ */ jsxs("div", { className: `${styles.mobile_header} relative text_center`, children: [
+            /* @__PURE__ */ jsx("p", { role: "heading", children: "Welcome" }),
+            /* @__PURE__ */ jsx("button", { onClick: mobileToggle, "aria-label": "close navigation menu", children: /* @__PURE__ */ jsx(
+              "svg",
+              {
+                xmlns: "http://www.w3.org/2000/svg",
+                width: "24",
+                height: "24",
+                viewBox: "0 0 24 24",
+                fill: "none",
+                children: /* @__PURE__ */ jsx(
+                  "path",
+                  {
+                    d: "M20.2812 2.65625L21.3419 3.71691L13.0602 11.9982L21.3419 20.2812L20.2812 21.3419L11.9982 13.0602L3.71691 21.3419L2.65625 20.2812L10.9377 11.9982L2.65625 3.71691L3.71691 2.65625L11.9982 10.9377L20.2812 2.65625Z",
+                    fill: "#4A5560"
+                  }
+                )
+              }
+            ) })
+          ] }),
+          /* @__PURE__ */ jsx("div", { className: styles.mobile_body, children: /* @__PURE__ */ jsxs("ul", { className: "list_unstyled", "aria-expanded": isOpenMobile, children: [
+            /* @__PURE__ */ jsxs(
+              "li",
+              {
+                className: `${styles.mobile_nav_item} ${styles.has_dropdown}`,
+                id: "dd_1",
+                children: [
+                  /* @__PURE__ */ jsxs(
+                    "a",
+                    {
+                      href: "#",
+                      onClick: toggleProducts1,
+                      role: "button",
+                      className: clsx("flex_row", "between"),
+                      children: [
+                        "Who We Serve",
+                        /* @__PURE__ */ jsx(
+                          "span",
+                          {
+                            className: clsx(
+                              styles.icon_wrap,
+                              isOpenProducts1 && styles.open
+                            ),
+                            children: /* @__PURE__ */ jsx(
+                              "svg",
+                              {
+                                xmlns: "http://www.w3.org/2000/svg",
+                                width: "24",
+                                height: "24",
+                                viewBox: "0 0 24 24",
+                                fill: "none",
+                                children: /* @__PURE__ */ jsx(
+                                  "path",
+                                  {
+                                    d: "M2.46875 7.76574L11.9991 17.2961L21.5294 7.76574L20.4687 6.70508L11.9991 15.1749L3.52941 6.70508L2.46875 7.76574Z",
+                                    fill: "#4A5560"
+                                  }
+                                )
+                              }
+                            )
+                          }
+                        )
+                      ]
+                    }
+                  ),
+                  /* @__PURE__ */ jsxs(
+                    "div",
+                    {
+                      className: clsx(styles.sub_menu, isOpenProducts1 && expand),
+                      children: [
+                        /* @__PURE__ */ jsx(
+                          Link,
+                          {
+                            href: "/who-we-serve",
+                            className: styles.main,
+                            role: "heading",
+                            children: "Who We Serve Home"
+                          }
+                        ),
+                        /* @__PURE__ */ jsx(Link, { href: "/who-we-serve/broker-dealers", role: "menuitem", children: "Broker Dealers" }),
+                        /* @__PURE__ */ jsx(
+                          Link,
+                          {
+                            href: "/who-we-serve/registered-investment-advisors",
+                            role: "menuitem",
+                            children: "Registered Investment Advisors"
+                          }
+                        )
+                      ]
+                    }
+                  )
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsxs(
+              "li",
+              {
+                className: `${styles.mobile_nav_item} ${styles.has_dropdown}`,
+                id: "dd_2",
+                children: [
+                  /* @__PURE__ */ jsxs(
+                    "a",
+                    {
+                      href: "#",
+                      onClick: toggleProducts2,
+                      role: "button",
+                      className: clsx("flex_row", "between"),
+                      children: [
+                        "Products and Services",
+                        /* @__PURE__ */ jsx(
+                          "span",
+                          {
+                            className: clsx(
+                              styles.icon_wrap,
+                              isOpenProducts2 && styles.open
+                            ),
+                            children: /* @__PURE__ */ jsx(
+                              "svg",
+                              {
+                                xmlns: "http://www.w3.org/2000/svg",
+                                width: "24",
+                                height: "24",
+                                viewBox: "0 0 24 24",
+                                fill: "none",
+                                children: /* @__PURE__ */ jsx(
+                                  "path",
+                                  {
+                                    d: "M2.46875 7.76574L11.9991 17.2961L21.5294 7.76574L20.4687 6.70508L11.9991 15.1749L3.52941 6.70508L2.46875 7.76574Z",
+                                    fill: "#4A5560"
+                                  }
+                                )
+                              }
+                            )
+                          }
+                        )
+                      ]
+                    }
+                  ),
+                  /* @__PURE__ */ jsxs(
+                    "div",
+                    {
+                      className: clsx(styles.sub_menu, isOpenProducts2 && expand),
+                      children: [
+                        /* @__PURE__ */ jsx(
+                          Link,
+                          {
+                            href: "/products-and-services",
+                            className: styles.main,
+                            role: "heading",
+                            children: "Products and Services Home"
+                          }
+                        ),
+                        /* @__PURE__ */ jsx(
+                          Link,
+                          {
+                            href: "/products-and-services/capital-management",
+                            role: "menuitem",
+                            children: "Capital Management"
+                          }
+                        ),
+                        /* @__PURE__ */ jsx(
+                          Link,
+                          {
+                            href: "/products-and-services/value-added-services",
+                            role: "menuitem",
+                            children: "Value Added Services"
+                          }
+                        ),
+                        /* @__PURE__ */ jsx(
+                          Link,
+                          {
+                            href: "/products-and-services/securities-services",
+                            role: "menuitem",
+                            children: "Securities Services"
+                          }
+                        ),
+                        /* @__PURE__ */ jsx(
+                          Link,
+                          {
+                            href: "/products-and-services/technology-platform",
+                            role: "menuitem",
+                            children: "Technology Platform"
+                          }
+                        )
+                      ]
+                    }
+                  )
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsxs(
+              "li",
+              {
+                className: `${styles.mobile_nav_item} ${styles.has_dropdown}`,
+                id: "dd_3",
+                children: [
+                  /* @__PURE__ */ jsxs(
+                    "a",
+                    {
+                      href: "#",
+                      onClick: toggleProducts3,
+                      role: "button",
+                      className: clsx("flex_row", "between"),
+                      children: [
+                        "Axos Advantage",
+                        /* @__PURE__ */ jsx(
+                          "span",
+                          {
+                            className: clsx(
+                              styles.icon_wrap,
+                              isOpenProducts3 && styles.open
+                            ),
+                            children: /* @__PURE__ */ jsx(
+                              "svg",
+                              {
+                                xmlns: "http://www.w3.org/2000/svg",
+                                width: "24",
+                                height: "24",
+                                viewBox: "0 0 24 24",
+                                fill: "none",
+                                children: /* @__PURE__ */ jsx(
+                                  "path",
+                                  {
+                                    d: "M2.46875 7.76574L11.9991 17.2961L21.5294 7.76574L20.4687 6.70508L11.9991 15.1749L3.52941 6.70508L2.46875 7.76574Z",
+                                    fill: "#4A5560"
+                                  }
+                                )
+                              }
+                            )
+                          }
+                        )
+                      ]
+                    }
+                  ),
+                  /* @__PURE__ */ jsxs(
+                    "div",
+                    {
+                      className: clsx(styles.sub_menu, isOpenProducts3 && expand),
+                      children: [
+                        /* @__PURE__ */ jsx(
+                          Link,
+                          {
+                            href: "/axos-advantage",
+                            className: styles.main,
+                            role: "heading",
+                            children: "Axos Advantage Home"
+                          }
+                        ),
+                        /* @__PURE__ */ jsx(Link, { href: "/axos-advantage/contact-us", role: "menuitem", children: "Contact Us" }),
+                        /* @__PURE__ */ jsx(Link, { href: "/axos-advantage/meet-the-team", role: "menuitem", children: "Meet the Team" }),
+                        /* @__PURE__ */ jsx(
+                          Link,
+                          {
+                            href: "/axos-advantage/meet-the-team/why-choose-axos",
+                            role: "menuitem",
+                            children: "Why Choose Axos"
+                          }
+                        )
+                      ]
+                    }
+                  )
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsx("li", { className: `${styles.mobile_nav_item}`, children: /* @__PURE__ */ jsx(
+              Link,
+              {
+                href: "https://connect.axosclearing.com/",
+                className: `flex_row between ${styles.btn}`,
+                children: "Sign In"
+              }
+            ) })
+          ] }) }),
+          /* @__PURE__ */ jsx("div", { className: styles.mobile_footer, children: /* @__PURE__ */ jsxs("div", { className: "flex_row between", children: [
+            /* @__PURE__ */ jsxs(
+              "div",
+              {
+                className: `${styles.mobile_footer_content} flex_col between`,
+                children: [
+                  /* @__PURE__ */ jsx("p", { children: /* @__PURE__ */ jsx("strong", { children: "Get in Touch" }) }),
+                  /* @__PURE__ */ jsx("div", { className: styles.footer_cta, children: /* @__PURE__ */ jsx(Button, { color: "primary", targetUrl: "/contact-us", children: "Contact Us" }) })
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsx("div", { className: styles.mobile_footer_media, children: " " })
+          ] }) })
+        ] })
+      }
+    )
+  ] });
+}
+export {
+  NavBar as default
+};

package/dist/NavigationMenu/index.d.ts

@@ -1,4 +1,5 @@
 export { default as NavBarAXA } from './AxosAdvisor';
 export { default as NavBarAAS } from './AxosAdvisorServices';
 export { default as NavBarAXB } from './AxosBank';
+export { default as NavBarAXC } from './AxosClearing';
 export { default as NavBarAFS } from './AxosFiduciary';

package/dist/NavigationMenu/index.js

@@ -1,10 +1,12 @@
 import { default as default2 } from "./AxosAdvisor/index.js";
 import { default as default3 } from "./AxosAdvisorServices/index.js";
 import { default as default4 } from "./AxosBank/index.js";
-import { default as default5 } from "./AxosFiduciary/index.js";
+import { default as default5 } from "./AxosClearing/index.js";
+import { default as default6 } from "./AxosFiduciary/index.js";
 export {
   default3 as NavBarAAS,
-  default5 as NavBarAFS,
+  default6 as NavBarAFS,
   default2 as NavBarAXA,
-  default4 as NavBarAXB
+  default4 as NavBarAXB,
+  default5 as NavBarAXC
 };

package/dist/SetContainer/SetContainer.js

@@ -71,7 +71,9 @@ import "../Chevron/Chevron.css.js";
 /* empty css                                                                 */
 import "next/link.js";
 /* empty css                                                   */
+import "next/navigation.js";
 /* empty css                                                      */
+/* empty css                                                       */
 /* empty css                                                    */
 /* empty css                                                  */
 import "../StepItem/StepItem.css.js";

package/dist/Table/Table.d.ts

@@ -9,6 +9,7 @@ export declare const TableBody: ({ children }: PropsWithChildren) => import("rea
 export declare const TableCell: ({ children, as, variant, highlighted, ...props }: CellProps) => import('react').DetailedReactHTMLElement<{
     className: string;
     manifest?: string | undefined;
+    amp?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
     suppressContentEditableWarning?: boolean | undefined;
@@ -56,6 +57,12 @@ export declare const TableCell: ({ children, as, variant, highlighted, ...props
     unselectable?: "on" | "off" | undefined;
     inputMode?: "none" | "text" | "search" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
     is?: string | undefined;
+    popover?: "" | "auto" | "manual" | undefined;
+    popoverTargetAction?: "hide" | "show" | "toggle" | undefined;
+    popoverTarget?: string | undefined;
+    onToggle?: import('react').ToggleEventHandler<HTMLTableCellElement> | undefined;
+    onBeforeToggle?: import('react').ToggleEventHandler<HTMLTableCellElement> | undefined;
+    inert?: boolean | undefined;
     "aria-activedescendant"?: string | undefined;
     "aria-atomic"?: (boolean | "false" | "true") | undefined;
     "aria-autocomplete"?: "none" | "both" | "inline" | "list" | undefined;
@@ -272,4 +279,10 @@ export declare const TableCell: ({ children, as, variant, highlighted, ...props
     onAnimationIterationCapture?: import('react').AnimationEventHandler<HTMLTableCellElement> | undefined;
     onTransitionEnd?: import('react').TransitionEventHandler<HTMLTableCellElement> | undefined;
     onTransitionEndCapture?: import('react').TransitionEventHandler<HTMLTableCellElement> | undefined;
+    onTransitionCancel?: import('react').TransitionEventHandler<HTMLTableCellElement> | undefined;
+    onTransitionCancelCapture?: import('react').TransitionEventHandler<HTMLTableCellElement> | undefined;
+    onTransitionRun?: import('react').TransitionEventHandler<HTMLTableCellElement> | undefined;
+    onTransitionRunCapture?: import('react').TransitionEventHandler<HTMLTableCellElement> | undefined;
+    onTransitionStart?: import('react').TransitionEventHandler<HTMLTableCellElement> | undefined;
+    onTransitionStartCapture?: import('react').TransitionEventHandler<HTMLTableCellElement> | undefined;
 }, HTMLElement>;

package/dist/TopicalNavSet/TopicalNavSet.js

@@ -5,15 +5,15 @@ const TopicalNavSet = ({
   id,
   topicalNavigationItems
 }) => {
-  return /* @__PURE__ */ jsx("nav", { className: picker_section, children: /* @__PURE__ */ jsx("div", { className: picker_container, children: /* @__PURE__ */ jsx("div", { className: `${picker_orient} flex`, children: topicalNavigationItems?.map((nav) => /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsx("nav", { id: `id_${id}`, className: picker_section, children: /* @__PURE__ */ jsx("div", { className: picker_container, children: /* @__PURE__ */ jsx("div", { className: `${picker_orient} flex`, children: topicalNavigationItems?.map((nav) => /* @__PURE__ */ jsx(
     TopicalNavItem,
     {
-      id: `id_${id}`,
+      id: `id_${nav?.id}`,
       icon: { src: nav?.icon?.src || "" },
       displayText: nav?.displayText,
       targetUrl: nav?.targetUrl
     },
-    `id_${id}`
+    `id_${nav?.id}`
   )) }) }) });
 };
 export {

package/dist/assets/CallToActionBar/CallToActionBar.css

@@ -42,7 +42,6 @@
   max-height: 200px;
 }
 ._1tdyl74a {
-  width: 100%;
   justify-content: space-between;
 }
 ._1tdyl74b {
@@ -75,6 +74,9 @@
 ._1tdyl74f {
   max-height: 315px;
 }
+._1tdyl740 p {
+  margin-bottom: 0;
+}
 @media screen and (max-width:1127px) {
   [class*=cta_section_lg] {
     max-height: 256px;