@axos-web-dev/shared-components 2.2.30 → 2.2.32-sn

package/dist/NavigationMenu/ServerNavigation/SubNavBar.js

@@ -0,0 +1,281 @@
+"use client";
+import { jsxs, jsx } from "react/jsx-runtime";
+import "../../Accordion/Accordion.js";
+import "../../Accordion/Accordion.css.js";
+import "../../icons/ArrowIcon/ArrowIcon.css.js";
+import "../../icons/CheckIcon/CheckIcon.css.js";
+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/NavBar2.css';import '../../assets/NavigationMenu/AxosALTS/NavBar2.css';import '../../assets/NavigationMenu/AxosClearing/NavBar2.css';import '../../assets/NavigationMenu/AxosBank/SubNavbar.css';import '../../assets/NavigationMenu/ServerNavigation/NavigationBar.css';import '../../assets/NavigationMenu/AxosAdvisorServices/SubNavbar.css';import '../../assets/NavigationMenu/AxosAdvisorServices/NavBar2.css';import '../../assets/NavigationMenu/AxosAdvisor/SubNavbar.css';import '../../assets/NavigationMenu/AxosAdvisor/NavBar2.css';import '../../assets/NavigationMenu/AxosBank/NavBar2.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/Chatbot/ChatWindow.css';import '../../assets/Chatbot/Bubble.css';import '../../assets/Chatbot/AnimatedGradientBorder.css';import '../../assets/CallToActionBar/CallToActionBar.css';import '../../assets/Insight/Insight.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/ImageToast/ImageToast.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/ufb.css';import '../../assets/themes/premier.css';import '../../assets/themes/axos.css';/* empty css                                   */
+/* empty css                                      */
+/* empty css                                  */
+/* empty css                                       */
+/* empty css                                                       */
+/* empty css                                                   */
+import { appendQueryParams } from "../../utils/appendQueryParams.js";
+import { useState, useRef, useEffect } from "react";
+import "clsx";
+import "../../Chevron/Chevron.css.js";
+import "../../AlertBanner/AlertBanner.css.js";
+import "../../Article/Article.css.js";
+import "../../IconBillboard/IconBillboard.css.js";
+/* empty css                                             */
+/* empty css                                             */
+import "../../Interstitial/Interstitial-variants.css.js";
+/* empty css                                   */
+import { useGlobalContext } from "../../Modal/contextApi/store.js";
+import "../../Button/Button.css.js";
+import { useClickAway } from "react-use";
+import "../../ArticlesSet/ArticlesSet.css.js";
+import "../../Calculators/calculator.css.js";
+import "../../Calculators/AnnualFeeCalculator/AnnualFeeCalculator.css.js";
+import "next/image.js";
+import "../../Calculators/ApyCalculator/ApyCalculator.css.js";
+import "../../Calculators/ApyCalculatorUserTest/ApyCalculatorUserTest.css.js";
+import "../../HeroBanner/LargeBanner.css.js";
+import "../../HeroBanner/HeroBanner.css.js";
+import "../../HeroBanner/SelectionBanner.css.js";
+/* empty css                                             */
+import "../../SetContainer/SetContainer.css.js";
+import "../../Table/Table.css.js";
+import "../../Calculators/AxosOneCalculator/BalanceAPYCalculator.css.js";
+import "../../Calculators/BalanceAPYCalculator/BalanceAPYCalculator.css.js";
+import "@hookform/resolvers/zod";
+import "../../Input/Checkbox.js";
+import "../../Input/CurrencyInput.js";
+import "../../Input/Dropdown.js";
+import "../../Input/Dropdown.css.js";
+import "../../Input/Input.js";
+import "../../Input/Input.css.js";
+import "../../Input/InputAmount.js";
+import "../../Input/InputPhone.js";
+import "../../Input/InputTextArea.js";
+import "../../Input/DownPaymentInput.js";
+import "../../Input/RadioButton.js";
+import "../../Input/PercentageInput.js";
+import "react-hook-form";
+import "../../Calculators/BuyDownCalculator/BuyDownCalculator.css.js";
+import "../../Forms/Forms.css.js";
+import "../../Forms/HoneyPot/index.js";
+import "../../Forms/SalesforceFieldsForm.js";
+import "../../Input/RadioButton.css.js";
+import "../../Input/Checkbox.css.js";
+import "../../LoadingIndicator/LoadingIndicator.css.js";
+import "../../Inputs/Input.css.js";
+/* empty css                                                            */
+import "../../Hyperlink/Hyperlink.css.js";
+/* empty css                                                         */
+import "iframe-resizer";
+/* empty css                                                                                   */
+import "../../Calculators/MonthlyPaymentCalculator/MonthlyPaymentCalculator.css.js";
+import "../../Calculators/MonthlyPaymentLVFCalculator/MonthlyPaymentCalculator.css.js";
+import "../../Calculators/SummitApyCalculator/BalanceAPYCalculator.css.js";
+/* empty css                                       */
+import "react-dom";
+/* empty css                                   */
+import "../../Auth/SignInPassword.js";
+/* empty css                                                 */
+/* empty css                                             */
+/* empty css                                       */
+/* empty css                                                       */
+import "../../Carousel/index.js";
+/* empty css                                                      */
+import "../../Chatbot/Chatbot.css.ts.vanilla.css.js";
+/* empty css                                      */
+import "../../Chatbot/store/chat.js";
+import "../../Chatbot/Chatbot.js";
+/* empty css                                          */
+import "../../Chatbot/store/messages.js";
+/* empty css                                                                       */
+import "../../Comparison/Comparison.css.js";
+import "../../Tab/Tab.css.js";
+import "../../icons/Star/Star.css.js";
+import "../../ContentBanner/ContentBanner.css.js";
+/* empty css                                                 */
+import "../../ExecutiveBio/ExecutiveBio.css.js";
+import "../../FaqAccordion/index.js";
+import "../../FooterDisclosure/FooterDisclosure.css.js";
+/* empty css                                                             */
+/* empty css                                                            */
+/* empty css                                               */
+import "../../ImageBillboard/ImageBillboard.css.js";
+import "next/script.js";
+/* empty css                                           */
+/* empty css                                           */
+/* empty css                                                 */
+/* empty css                                                         */
+/* empty css                                               */
+import "../../LandingPageHeader/LandingPageHeader.css.js";
+import "next/link.js";
+/* empty css                                    */
+/* empty css                                       */
+import "next/navigation.js";
+/* empty css                                          */
+/* empty css                                               */
+/* empty css                                                  */
+import styles from "./NavBar.module.js";
+/* empty css                                 */
+/* empty css                                       */
+/* empty css                                        */
+/* empty css                                    */
+/* empty css                                      */
+import "../../PageNavItem/PageNavItem.css.js";
+import "react-slick";
+/* empty css                                                    */
+/* empty css                                             */
+/* empty css                                                       */
+/* empty css                                                     */
+import "../../StepItem/StepItem.css.js";
+import "../../StepItemSet/StepItemSet.css.js";
+/* empty css                                           */
+/* empty css                                   */
+/* empty css                                                     */
+/* empty css                                                   */
+/* empty css                                                 */
+import { Menu } from "./Menu.js";
+import { sub_nav } from "./SubNavbar.css.js";
+function SubNavBar({
+  items
+}) {
+  const { resolveUrl } = useGlobalContext();
+  const [hoveredLink, setHoveredLink] = useState(void 0);
+  const [menu, setMenu] = useState(void 0);
+  const handleMouseEnter = (link) => setHoveredLink(link);
+  const handleMouseLeave = () => setHoveredLink(void 0);
+  const containerRef = useRef(null);
+  const subNavBarRef = useRef(null);
+  const [isClient, setIsClient] = useState(false);
+  useClickAway(subNavBarRef, () => {
+    handleMouseLeave();
+  });
+  useEffect(() => {
+    setIsClient(true);
+  }, []);
+  useEffect(() => {
+    if (hoveredLink && containerRef.current && isClient) {
+      containerRef.current.focus();
+    }
+  }, [hoveredLink, isClient]);
+  useEffect(() => {
+    appendQueryParams();
+  }, [hoveredLink]);
+  useEffect(() => {
+    const menu2 = items?.subItems?.find(
+      (item) => typeof item != "undefined" && item.label === hoveredLink
+    );
+    if (menu2 && "menuItems" in menu2) setMenu(menu2?.menuItems);
+  }, [hoveredLink, setMenu, items]);
+  const handleKeyDownContainer = (e, linkId) => {
+    if (e.key === "Tab") {
+      const focusableElements = containerRef.current?.querySelectorAll(
+        'button, [href], a, [tabindex]:not([tabindex="-1"])'
+      );
+      if (focusableElements && isClient) {
+        const lastElement = focusableElements[focusableElements.length - 1];
+        const isShiftPressed = e.shiftKey;
+        if (!isShiftPressed && document.activeElement === lastElement) {
+          e.preventDefault();
+          const triggeredLink = document.getElementById(linkId);
+          setHoveredLink(void 0);
+          const nextLi = triggeredLink?.parentElement?.nextElementSibling;
+          const nextA = nextLi?.querySelector("a");
+          nextA?.focus();
+        }
+      }
+    }
+  };
+  const renderSubItems = items?.subItems?.map(
+    (item) => item && /* @__PURE__ */ jsxs(
+      "li",
+      {
+        className: styles.sub_nav_link,
+        onMouseEnter: () => {
+          if (item && "menuItems" in item && item?.menuItems?.subItems && item?.menuItems?.subItems?.length > 0) {
+            handleMouseEnter(item?.label);
+          }
+        },
+        role: "menuitem",
+        id: `menu-${item?.label?.toLocaleLowerCase()}`,
+        children: [
+          /* @__PURE__ */ jsx(
+            "a",
+            {
+              href: resolveUrl(item?.url),
+              id: item?.target?.id,
+              "aria-label": item?.descriptiveTextAriaLabel,
+              children: item?.label
+            }
+          ),
+          "menuItems" in item && item?.menuItems && item?.menuItems?.subItems && item?.menuItems?.subItems?.length > 0 ? /* @__PURE__ */ jsx(
+            "a",
+            {
+              href: "#",
+              id: item?.label,
+              onKeyDown: (event) => {
+                if (event.key === "Enter") {
+                  handleMouseEnter(item?.label);
+                }
+              },
+              "aria-label": `Press Enter to open the ${item?.label} section sub-menu.`,
+              children: /* @__PURE__ */ jsx(
+                "svg",
+                {
+                  width: "15",
+                  height: "12",
+                  viewBox: "0 0 20 12",
+                  fill: "none",
+                  xmlns: "http://www.w3.org/2000/svg",
+                  style: { marginLeft: "8px" },
+                  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: "white"
+                    }
+                  )
+                }
+              )
+            }
+          ) : null
+        ]
+      },
+      item?.id
+    )
+  );
+  return /* @__PURE__ */ jsx("div", { className: `${sub_nav} ${styles.desktop_only}`, ref: subNavBarRef, children: /* @__PURE__ */ jsx("div", { className: styles.wrapper, children: /* @__PURE__ */ jsx("div", { className: styles.header_sub_row, children: /* @__PURE__ */ jsxs("nav", { children: [
+    /* @__PURE__ */ jsx("ul", { className: "list_unstyled flex_row middle", role: "menubar", children: renderSubItems }),
+    /* @__PURE__ */ jsx("div", { className: "relative", children: /* @__PURE__ */ jsx(
+      "div",
+      {
+        style: {
+          display: hoveredLink !== void 0 ? "block" : "none"
+        },
+        onMouseLeave: () => {
+          setHoveredLink(void 0);
+        },
+        children: /* @__PURE__ */ jsx(
+          Menu,
+          {
+            id: hoveredLink || "",
+            onDownKeyContainer: handleKeyDownContainer,
+            onMouseLeave: handleMouseLeave,
+            ref: containerRef,
+            header: menu?.bannerHeading,
+            headerOnHover: menu?.heading,
+            description: menu?.bannerDescription,
+            helpUrl: menu?.helpAndSupportLink,
+            image: {
+              src: menu?.bannerImage?.fields?.file?.url,
+              alt: menu?.bannerImage?.fields?.title,
+              width: menu?.bannerImage?.fields?.file?.details?.image?.width || 232,
+              height: menu?.bannerImage?.fields?.file?.details?.image?.height || 232
+            },
+            bannerCta: menu?.bannerCta,
+            subNavItems: menu?.subItems
+          }
+        )
+      }
+    ) })
+  ] }) }) }) });
+}
+export {
+  SubNavBar as default
+};

package/dist/NavigationMenu/ServerNavigation/SubNavItem.d.ts

@@ -0,0 +1 @@
+export declare const SubNavItem: () => import("react").JSX.Element;

package/dist/NavigationMenu/ServerNavigation/SubNavItem.js

@@ -0,0 +1,317 @@
+"use client";
+import { jsx, Fragment, jsxs } from "react/jsx-runtime";
+import "../../Accordion/Accordion.js";
+import "../../Accordion/Accordion.css.js";
+import "../../icons/ArrowIcon/ArrowIcon.css.js";
+import "../../icons/CheckIcon/CheckIcon.css.js";
+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/NavBar2.css';import '../../assets/NavigationMenu/AxosALTS/NavBar2.css';import '../../assets/NavigationMenu/AxosClearing/NavBar2.css';import '../../assets/NavigationMenu/AxosBank/SubNavbar.css';import '../../assets/NavigationMenu/ServerNavigation/NavigationBar.css';import '../../assets/NavigationMenu/AxosAdvisorServices/SubNavbar.css';import '../../assets/NavigationMenu/AxosAdvisorServices/NavBar2.css';import '../../assets/NavigationMenu/AxosAdvisor/SubNavbar.css';import '../../assets/NavigationMenu/AxosAdvisor/NavBar2.css';import '../../assets/NavigationMenu/AxosBank/NavBar2.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/Chatbot/ChatWindow.css';import '../../assets/Chatbot/Bubble.css';import '../../assets/Chatbot/AnimatedGradientBorder.css';import '../../assets/CallToActionBar/CallToActionBar.css';import '../../assets/Insight/Insight.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/ImageToast/ImageToast.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/ufb.css';import '../../assets/themes/premier.css';import '../../assets/themes/axos.css';/* empty css                                   */
+/* empty css                                      */
+/* empty css                                  */
+/* empty css                                       */
+/* empty css                                                       */
+/* empty css                                                   */
+import "react";
+import "clsx";
+import "../../Chevron/Chevron.css.js";
+import "../../AlertBanner/AlertBanner.css.js";
+import "../../Article/Article.css.js";
+import "../../IconBillboard/IconBillboard.css.js";
+/* empty css                                             */
+/* empty css                                             */
+import "../../Interstitial/Interstitial-variants.css.js";
+/* empty css                                   */
+import { useGlobalContext } from "../../Modal/contextApi/store.js";
+import "../../Button/Button.css.js";
+import "react-use";
+import "../../ArticlesSet/ArticlesSet.css.js";
+import "../../Calculators/calculator.css.js";
+import "../../Calculators/AnnualFeeCalculator/AnnualFeeCalculator.css.js";
+import "next/image.js";
+import "../../Calculators/ApyCalculator/ApyCalculator.css.js";
+import "../../Calculators/ApyCalculatorUserTest/ApyCalculatorUserTest.css.js";
+import "../../HeroBanner/LargeBanner.css.js";
+import "../../HeroBanner/HeroBanner.css.js";
+import "../../HeroBanner/SelectionBanner.css.js";
+/* empty css                                             */
+import "../../SetContainer/SetContainer.css.js";
+import "../../Table/Table.css.js";
+import "../../Calculators/AxosOneCalculator/BalanceAPYCalculator.css.js";
+import "../../Calculators/BalanceAPYCalculator/BalanceAPYCalculator.css.js";
+import "@hookform/resolvers/zod";
+import "../../Input/Checkbox.js";
+import "../../Input/CurrencyInput.js";
+import "../../Input/Dropdown.js";
+import "../../Input/Dropdown.css.js";
+import "../../Input/Input.js";
+import "../../Input/Input.css.js";
+import "../../Input/InputAmount.js";
+import "../../Input/InputPhone.js";
+import "../../Input/InputTextArea.js";
+import "../../Input/DownPaymentInput.js";
+import "../../Input/RadioButton.js";
+import "../../Input/PercentageInput.js";
+import "react-hook-form";
+import "../../Calculators/BuyDownCalculator/BuyDownCalculator.css.js";
+import "../../Forms/Forms.css.js";
+import "../../Forms/HoneyPot/index.js";
+import "../../Forms/SalesforceFieldsForm.js";
+import "../../Input/RadioButton.css.js";
+import "../../Input/Checkbox.css.js";
+import "../../LoadingIndicator/LoadingIndicator.css.js";
+import "../../Inputs/Input.css.js";
+/* empty css                                                            */
+import "../../Hyperlink/Hyperlink.css.js";
+/* empty css                                                         */
+import "iframe-resizer";
+/* empty css                                                                                   */
+import "../../Calculators/MonthlyPaymentCalculator/MonthlyPaymentCalculator.css.js";
+import "../../Calculators/MonthlyPaymentLVFCalculator/MonthlyPaymentCalculator.css.js";
+import "../../Calculators/SummitApyCalculator/BalanceAPYCalculator.css.js";
+/* empty css                                       */
+import "react-dom";
+/* empty css                                   */
+import "../../Auth/SignInPassword.js";
+/* empty css                                                 */
+/* empty css                                             */
+/* empty css                                       */
+/* empty css                                                       */
+import "../../Carousel/index.js";
+/* empty css                                                      */
+import "../../Chatbot/Chatbot.css.ts.vanilla.css.js";
+/* empty css                                      */
+import "../../Chatbot/store/chat.js";
+import "../../Chatbot/Chatbot.js";
+/* empty css                                          */
+import "../../Chatbot/store/messages.js";
+/* empty css                                                                       */
+import "../../Comparison/Comparison.css.js";
+import "../../Tab/Tab.css.js";
+import "../../icons/Star/Star.css.js";
+import "../../ContentBanner/ContentBanner.css.js";
+/* empty css                                                 */
+import "../../ExecutiveBio/ExecutiveBio.css.js";
+import "../../FaqAccordion/index.js";
+import "../../FooterDisclosure/FooterDisclosure.css.js";
+/* empty css                                                             */
+/* empty css                                                            */
+/* empty css                                               */
+import "../../ImageBillboard/ImageBillboard.css.js";
+import "next/script.js";
+/* empty css                                           */
+/* empty css                                           */
+/* empty css                                                 */
+/* empty css                                                         */
+/* empty css                                               */
+import "../../LandingPageHeader/LandingPageHeader.css.js";
+import "next/link.js";
+/* empty css                                    */
+/* empty css                                       */
+import "next/navigation.js";
+/* empty css                                          */
+/* empty css                                               */
+/* empty css                                                  */
+import styles from "./NavBar.module.js";
+/* empty css                                 */
+import "./Menu.js";
+import "./SubNavbar.css.js";
+/* empty css                                       */
+/* empty css                                        */
+/* empty css                                    */
+/* empty css                                      */
+import "../../PageNavItem/PageNavItem.css.js";
+import "react-slick";
+/* empty css                                                    */
+/* empty css                                             */
+/* empty css                                                       */
+/* empty css                                                     */
+import "../../StepItem/StepItem.css.js";
+import "../../StepItemSet/StepItemSet.css.js";
+/* empty css                                           */
+/* empty css                                   */
+/* empty css                                                     */
+/* empty css                                                   */
+/* empty css                                                 */
+const SubNavItem = () => {
+  const { resolveUrl } = useGlobalContext();
+  return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs(
+      "li",
+      {
+        className: styles.sub_nav_link,
+        role: "menuitem",
+        children: [
+          /* @__PURE__ */ jsx(
+            "a",
+            {
+              href: resolveUrl("{AXOSBANK}/personal/bank"),
+              id: "personalNav1",
+              "aria-label": "Press Enter to navigate to the Bank section home page, or press Tab again to focus on the down arrow and press Enter to open the Bank section sub-menu.",
+              children: "Bank"
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "a",
+            {
+              href: "#",
+              id: "personalNav1",
+              "aria-label": "Press Enter to open the Bank section sub-menu.",
+              children: /* @__PURE__ */ jsx(
+                "svg",
+                {
+                  width: "15",
+                  height: "12",
+                  viewBox: "0 0 20 12",
+                  fill: "none",
+                  xmlns: "http://www.w3.org/2000/svg",
+                  style: { marginLeft: "8px" },
+                  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: "white"
+                    }
+                  )
+                }
+              )
+            }
+          )
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsxs(
+      "li",
+      {
+        className: styles.sub_nav_link,
+        role: "menuitem",
+        children: [
+          /* @__PURE__ */ jsx(
+            "a",
+            {
+              href: resolveUrl("{AXOSBANK}/personal/borrow"),
+              id: "personalNav2",
+              "aria-label": "Press Enter to navigate to the Borrow section home page, or press Tab again to focus on the down arrow and press Enter to open the Borrow section sub-menu.",
+              children: "Borrow"
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "a",
+            {
+              href: "#",
+              id: "personalNav2",
+              "aria-label": "Press Enter to open the Borrow section sub-menu.",
+              children: /* @__PURE__ */ jsx(
+                "svg",
+                {
+                  width: "15",
+                  height: "12",
+                  viewBox: "0 0 20 12",
+                  fill: "none",
+                  xmlns: "http://www.w3.org/2000/svg",
+                  style: { marginLeft: "8px" },
+                  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: "white"
+                    }
+                  )
+                }
+              )
+            }
+          )
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsxs(
+      "li",
+      {
+        className: styles.sub_nav_link,
+        role: "menuitem",
+        children: [
+          /* @__PURE__ */ jsx(
+            "a",
+            {
+              href: resolveUrl("{AXOS}/invest"),
+              id: "personalNav3",
+              "aria-label": "Press Enter to navigate to the Invest section home page, or press Tab again to focus on the down arrow and press Enter to open the Invest section sub-menu.",
+              children: "Invest"
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "a",
+            {
+              href: "#",
+              id: "personalNav3",
+              "aria-label": "Press Enter to open the Invest section sub-menu.",
+              children: /* @__PURE__ */ jsx(
+                "svg",
+                {
+                  width: "15",
+                  height: "12",
+                  viewBox: "0 0 20 12",
+                  fill: "none",
+                  xmlns: "http://www.w3.org/2000/svg",
+                  style: { marginLeft: "8px" },
+                  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: "white"
+                    }
+                  )
+                }
+              )
+            }
+          )
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsxs(
+      "li",
+      {
+        className: styles.sub_nav_link,
+        role: "menuitem",
+        children: [
+          /* @__PURE__ */ jsx(
+            "a",
+            {
+              href: resolveUrl("{AXOSBANK}/personal/plan"),
+              id: "personalNav4",
+              "aria-label": "Press Enter to navigate to the Plan section home page, or press Tab again to focus on the down arrow and press Enter to open the Plan section sub-menu.",
+              children: "Plan"
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "a",
+            {
+              href: "#",
+              id: "personalNav4",
+              "aria-label": "Press Enter to open the Plan section sub-menu.",
+              children: /* @__PURE__ */ jsx(
+                "svg",
+                {
+                  width: "15",
+                  height: "12",
+                  viewBox: "0 0 20 12",
+                  fill: "none",
+                  xmlns: "http://www.w3.org/2000/svg",
+                  style: { marginLeft: "8px" },
+                  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: "white"
+                    }
+                  )
+                }
+              )
+            }
+          )
+        ]
+      }
+    )
+  ] }) });
+};
+export {
+  SubNavItem
+};