@nulogy/components 14.8.2 → 15.0.1

package/dist/src/Navigation/components/DesktopNav/DesktopNav.d.ts

@@ -1,5 +1,5 @@
-import React from "react";
-import { BaseNavigationProps } from "../../Navigation";
-type DesktopNavProps = BaseNavigationProps;
-export default function DesktopNav({ primaryNavigation, secondaryNavigation, appSwitcher, secondaryLogo, primaryLogo, userMenu, }: DesktopNavProps): React.JSX.Element;
-export {};
+import React from "react";
+import { BaseNavigationProps } from "../../Navigation";
+type DesktopNavProps = BaseNavigationProps;
+export default function DesktopNav({ primaryNavigation, secondaryNavigation, appSwitcher, secondaryLogo, primaryLogo, userMenu, }: DesktopNavProps): React.JSX.Element;
+export {};

package/dist/src/Navigation/components/DesktopNav/DesktopNav.js

@@ -0,0 +1,48 @@
+import React, { useMemo } from "react";
+import * as RadixNavigationMenu from "@radix-ui/react-navigation-menu";
+import { useTranslation } from "react-i18next";
+import { Box, Divider, Flex, TruncatedText, VerticalDivider } from "../../..";
+import { NavigationMenuItem, NavigationMenuSubList } from "../shared/NavigationMenuItem";
+import UserMenu from "../UserMenu/UserMenu";
+import { CaretDown, NavigationMenuList, NavigationMenuTrigger, NavigationMenuRoot, RadixNavigationMenuItem, } from "../shared/components";
+import NavigationMenuContent from "../shared/NavigationMenuContent";
+import { NulogyAppSwitcher } from "../AppSwitcher/NulogyAppSwitcher";
+import { useResponsiveMenu } from "../../hooks/useResponsiveMenu";
+import { NulogyLogo } from "../NulogyLogo/NulogyLogo";
+import { NavigationLogoLink } from "../shared/NavigationLogoLink";
+import MoreMenuItem, { HiddenNavigationMenuItem } from "./parts/MoreMenuItem";
+export default function DesktopNav({ primaryNavigation = [], secondaryNavigation = [], appSwitcher, secondaryLogo, primaryLogo, userMenu, }) {
+    const { t } = useTranslation();
+    const userMenuExists = !!userMenu;
+    const { menuItems, moreMenu, hiddenMenuItem, primaryMenuRef, secondaryMenuRef, hiddenButtonRef } = useResponsiveMenu(primaryNavigation);
+    const hasUserMenuContent = useMemo(() => userMenuExists && (userMenu.header || userMenu.controls || (userMenu.menuItems && userMenu.menuItems.length > 0)), [userMenuExists, userMenu]);
+    return (React.createElement(NavigationMenuRoot, null,
+        React.createElement(NavigationMenuList, { ref: primaryMenuRef },
+            React.createElement(NulogyAppSwitcher, { config: appSwitcher }),
+            React.createElement(RadixNavigationMenuItem, { display: "flex" }, primaryLogo !== null && primaryLogo !== void 0 ? primaryLogo : (React.createElement(NavigationLogoLink, { href: "/", "aria-label": "Nulogy Logo" },
+                React.createElement(NulogyLogo, null)))),
+            menuItems.map((item) => (React.createElement(NavigationMenuItem, { key: item.key, item: item }))),
+            moreMenu.length > 0 && React.createElement(MoreMenuItem, { moreMenu: moreMenu }),
+            hiddenMenuItem && React.createElement(HiddenNavigationMenuItem, { ref: hiddenButtonRef, item: hiddenMenuItem })),
+        React.createElement(NavigationMenuList, { ref: secondaryMenuRef },
+            secondaryNavigation.map((item) => (React.createElement(NavigationMenuItem, { key: item.key, item: item }))),
+            secondaryNavigation.length > 0 && userMenuExists && React.createElement(VerticalDivider, null),
+            secondaryLogo && React.createElement(RadixNavigationMenuItem, { display: "flex" }, secondaryLogo),
+            secondaryLogo && userMenuExists && React.createElement(VerticalDivider, null),
+            userMenuExists && (React.createElement(RadixNavigationMenu.Item, null,
+                React.createElement(NavigationMenuTrigger, { py: "half", disabled: !hasUserMenuContent, "aria-label": t("toggle user menu") },
+                    React.createElement(Flex, { flexDirection: "column", alignItems: "flex-start" },
+                        React.createElement(TruncatedText, { showTooltip: false, fontSize: "smaller", lineHeight: "smallerText", fontWeight: "normal" }, userMenu.triggerText.title),
+                        userMenu.triggerText.subtitle1 && (React.createElement(TruncatedText, { showTooltip: false, fontSize: "smaller", lineHeight: "smallerText", fontWeight: "normal" }, userMenu.triggerText.subtitle1)),
+                        userMenu.triggerText.subtitle2 && (React.createElement(TruncatedText, { showTooltip: false, fontSize: "smaller", lineHeight: "smallerText", fontWeight: "normal" }, userMenu.triggerText.subtitle2))),
+                    hasUserMenuContent && React.createElement(CaretDown, { icon: "downArrow", size: "x2", "aria-hidden": true })),
+                hasUserMenuContent && (React.createElement(NavigationMenuContent, { right: 0, p: "none", pt: userMenu.header || userMenu.controls ? "none" : "x1", pb: userMenu.menuItems && userMenu.menuItems.length ? "x1" : "none", "aria-label": t("user menu") },
+                    userMenu.header && React.createElement(UserMenu.Header, Object.assign({}, userMenu.header)),
+                    (userMenu.controls || (userMenu.menuItems && userMenu.menuItems.length > 0)) && (React.createElement(UserMenu.Container, { p: "none", display: "flex", flexDirection: "column" },
+                        userMenu.controls && React.createElement(Box, { p: "x2" }, userMenu.controls({ withinMobileNav: false })),
+                        userMenu.controls && userMenu.menuItems && userMenu.menuItems.length > 0 && (React.createElement(Box, { px: "x2" },
+                            React.createElement(Divider, { my: "x2" }))),
+                        userMenu.menuItems && userMenu.menuItems.length > 0 && (React.createElement(Box, { px: "none" },
+                            React.createElement(RadixNavigationMenu.Sub, { orientation: "vertical" },
+                                React.createElement(NavigationMenuSubList, null, userMenu.menuItems.map((item) => (React.createElement(UserMenu.Item, { key: item.key, item: item }))))))))))))))));
+}

package/dist/src/Navigation/components/DesktopNav/parts/MoreMenuItem.d.ts

@@ -1,8 +1,8 @@
-import React from "react";
-import type { MenuItem, MenuItems } from "../../../types";
-export default function MoreMenuItem({ moreMenu }: {
-    moreMenu: MenuItems;
-}): React.JSX.Element;
-export declare const HiddenNavigationMenuItem: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("../../shared/NavigationMenuItem").NavigationMenuItemProps & React.RefAttributes<HTMLLIElement>, import("../../shared/NavigationMenuItem").NavigationMenuItemProps & React.RefAttributes<HTMLLIElement>>, never>, {
-    item: MenuItem;
-}>> & string & Omit<React.ForwardRefExoticComponent<import("../../shared/NavigationMenuItem").NavigationMenuItemProps & React.RefAttributes<HTMLLIElement>>, keyof React.Component<any, {}, any>>;
+import React from "react";
+import type { MenuItem, MenuItems } from "../../../types";
+export default function MoreMenuItem({ moreMenu }: {
+    moreMenu: MenuItems;
+}): React.JSX.Element;
+export declare const HiddenNavigationMenuItem: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("../../shared/NavigationMenuItem").NavigationMenuItemProps & React.RefAttributes<HTMLLIElement>, import("../../shared/NavigationMenuItem").NavigationMenuItemProps & React.RefAttributes<HTMLLIElement>>, never>, {
+    item: MenuItem;
+}>> & string & Omit<React.ForwardRefExoticComponent<import("../../shared/NavigationMenuItem").NavigationMenuItemProps & React.RefAttributes<HTMLLIElement>>, keyof React.Component<any, {}, any>>;

package/dist/src/Navigation/components/DesktopNav/parts/MoreMenuItem.js

@@ -0,0 +1,20 @@
+import React from "react";
+import { useTranslation } from "react-i18next";
+import styled from "styled-components";
+import { NavigationMenuItem } from "../../shared/NavigationMenuItem";
+export default function MoreMenuItem({ moreMenu }) {
+    const { t } = useTranslation();
+    return (React.createElement(NavigationMenuItem, { item: {
+            key: "nds-primary-menu-more-item",
+            label: t("more"),
+            type: "button",
+            items: moreMenu,
+        } }));
+}
+export const HiddenNavigationMenuItem = styled(NavigationMenuItem).attrs({
+    tabIndex: -1,
+    "aria-hidden": true,
+})({
+    position: "absolute",
+    visibility: "hidden",
+});

package/dist/src/Navigation/components/EnvironmentBanner/EnvironmentBanner.d.ts

@@ -1,6 +1,6 @@
-import React from "react";
-export type EnvironmentBannerProps = {
-    children?: React.ReactNode;
-};
-declare const EnvironmentBanner: ({ children }: EnvironmentBannerProps) => React.JSX.Element;
-export default EnvironmentBanner;
+import React from "react";
+export type EnvironmentBannerProps = {
+    children?: React.ReactNode;
+};
+declare const EnvironmentBanner: ({ children }: EnvironmentBannerProps) => React.JSX.Element;
+export default EnvironmentBanner;

package/dist/src/Navigation/components/EnvironmentBanner/EnvironmentBanner.js

@@ -0,0 +1,6 @@
+import React from "react";
+import { Box } from "../../../Box";
+import { Text } from "../../../Type";
+const EnvironmentBanner = ({ children }) => (React.createElement(Box, { bg: "darkBlue", textAlign: "center" },
+    React.createElement(Text, { fontSize: "10px", letterSpacing: "0.5px", fontWeight: "bold", color: "white", textTransform: "uppercase", py: "2px" }, children)));
+export default EnvironmentBanner;

package/dist/src/Navigation/components/EnvironmentBanner/index.d.ts

@@ -1,2 +1,2 @@
-export { default as EnvironmentBanner } from "./EnvironmentBanner";
-export type { EnvironmentBannerProps } from "./EnvironmentBanner";
+export { default as EnvironmentBanner } from "./EnvironmentBanner";
+export type { EnvironmentBannerProps } from "./EnvironmentBanner";

package/dist/src/Navigation/components/EnvironmentBanner/index.js

@@ -0,0 +1 @@
+export { default as EnvironmentBanner } from "./EnvironmentBanner";

package/dist/src/Navigation/components/MenuSubItem/MenuSubItem.d.ts

@@ -1,8 +1,8 @@
-import React from "react";
-import { MenuItem } from "../../types";
-type Props = {
-    item: MenuItem;
-    level: number;
-};
-export declare function MenuSubItem({ item, level }: Props): React.JSX.Element;
-export {};
+import React from "react";
+import { MenuItem } from "../../types";
+type Props = {
+    item: MenuItem;
+    level: number;
+};
+export declare function MenuSubItem({ item, level }: Props): React.JSX.Element;
+export {};

package/dist/src/Navigation/components/MenuSubItem/MenuSubItem.js

@@ -0,0 +1,41 @@
+import React from "react";
+import * as RadixNavigationMenu from "@radix-ui/react-navigation-menu";
+import { useTheme } from "styled-components";
+import { Icon } from "../../../Icon";
+import { CaretRight } from "../shared/components";
+import { Flex } from "../../../Flex";
+import { Divider } from "../../../Divider";
+import { SubMenuContent, SubMenuItem, SubMenuItemButton, SubMenuItemLink, SubMenuList } from "./parts/styled";
+export function MenuSubItem({ item, level }) {
+    var _a, _b;
+    const theme = useTheme();
+    /* ---------------------------------------------------------------------
+     * Separator
+     * -------------------------------------------------------------------*/
+    if (item.type === "separator") {
+        return React.createElement(Divider, { my: "x1", mx: "x1", width: "auto" });
+    }
+    /* ---------------------------------------------------------------------
+     * Custom render
+     * -------------------------------------------------------------------*/
+    if (item.type === "custom") {
+        return (React.createElement(RadixNavigationMenu.Item, { key: item.key }, item.render({ withinSubMenu: true, level, withinMobileNav: false })));
+    }
+    /* ---------------------------------------------------------------------
+     * Default render
+     * -------------------------------------------------------------------*/
+    const hasIcon = "icon" in item;
+    const isLink = item.type === "link";
+    const hasSubMenu = item.type === "button" && !!item.items && item.items.length > 0;
+    const content = (React.createElement(React.Fragment, null,
+        hasIcon && (React.createElement(Flex, { alignItems: "center", gap: "x1" },
+            React.createElement(Icon, { icon: item.icon, size: "x3", "aria-hidden": true }),
+            React.createElement("span", null, (_a = item.label) !== null && _a !== void 0 ? _a : item.tooltip))),
+        "label" in item && item.label && !hasIcon && React.createElement("span", null, item.label),
+        hasSubMenu && React.createElement(CaretRight, { "aria-hidden": true, size: "x2" })));
+    return (React.createElement(SubMenuItem, { key: item.key, value: "label" in item ? item.label : item.key }, isLink ? (React.createElement(SubMenuItemLink, { asChild: true }, item.element ? (React.cloneElement(item.element, Object.assign(Object.assign({}, item.props), { children: content }))) : (React.createElement("a", Object.assign({}, item.props), content)))) : (React.createElement(React.Fragment, null,
+        React.createElement(SubMenuItemButton, Object.assign({}, item.props), content),
+        hasSubMenu && (React.createElement(SubMenuContent, { left: `calc(100% - ${theme.space.half})`, top: `calc(-1 * ${theme.space.x1})` },
+            React.createElement(RadixNavigationMenu.Sub, { orientation: "vertical" },
+                React.createElement(SubMenuList, null, (_b = item.items) === null || _b === void 0 ? void 0 : _b.map((subItem) => React.createElement(MenuSubItem, { key: subItem.key, item: subItem, level: level + 1 }))))))))));
+}

package/dist/src/Navigation/components/MenuSubItem/parts/styled.d.ts

@@ -1,8 +1,8 @@
-/// <reference types="react" />
-import * as RadixNavigationMenu from "@radix-ui/react-navigation-menu";
-import { StyledProps } from "../../../../StyledProps";
-export declare const SubMenuItemLink: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<RadixNavigationMenu.NavigationMenuLinkProps & import("react").RefAttributes<HTMLAnchorElement>, StyledProps>> & string & Omit<import("react").ForwardRefExoticComponent<RadixNavigationMenu.NavigationMenuLinkProps & import("react").RefAttributes<HTMLAnchorElement>>, keyof import("react").Component<any, {}, any>>;
-export declare const SubMenuItemButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<RadixNavigationMenu.NavigationMenuTriggerProps & import("react").RefAttributes<HTMLButtonElement>, StyledProps>> & string & Omit<import("react").ForwardRefExoticComponent<RadixNavigationMenu.NavigationMenuTriggerProps & import("react").RefAttributes<HTMLButtonElement>>, keyof import("react").Component<any, {}, any>>;
-export declare const SubMenuContent: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<RadixNavigationMenu.NavigationMenuContentProps & import("react").RefAttributes<HTMLDivElement>, RadixNavigationMenu.NavigationMenuContentProps & import("react").RefAttributes<HTMLDivElement>>, never>, StyledProps>> & string & Omit<import("react").ForwardRefExoticComponent<RadixNavigationMenu.NavigationMenuContentProps & import("react").RefAttributes<HTMLDivElement>>, keyof import("react").Component<any, {}, any>>;
-export declare const SubMenuItem: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<RadixNavigationMenu.NavigationMenuItemProps & import("react").RefAttributes<HTMLLIElement>, StyledProps>> & string & Omit<import("react").ForwardRefExoticComponent<RadixNavigationMenu.NavigationMenuItemProps & import("react").RefAttributes<HTMLLIElement>>, keyof import("react").Component<any, {}, any>>;
-export declare const SubMenuList: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<RadixNavigationMenu.NavigationMenuListProps & import("react").RefAttributes<HTMLUListElement>, StyledProps>> & string & Omit<import("react").ForwardRefExoticComponent<RadixNavigationMenu.NavigationMenuListProps & import("react").RefAttributes<HTMLUListElement>>, keyof import("react").Component<any, {}, any>>;
+/// <reference types="react" />
+import * as RadixNavigationMenu from "@radix-ui/react-navigation-menu";
+import { StyledProps } from "../../../../StyledProps";
+export declare const SubMenuItemLink: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<RadixNavigationMenu.NavigationMenuLinkProps & import("react").RefAttributes<HTMLAnchorElement>, StyledProps>> & string & Omit<import("react").ForwardRefExoticComponent<RadixNavigationMenu.NavigationMenuLinkProps & import("react").RefAttributes<HTMLAnchorElement>>, keyof import("react").Component<any, {}, any>>;
+export declare const SubMenuItemButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<RadixNavigationMenu.NavigationMenuTriggerProps & import("react").RefAttributes<HTMLButtonElement>, StyledProps>> & string & Omit<import("react").ForwardRefExoticComponent<RadixNavigationMenu.NavigationMenuTriggerProps & import("react").RefAttributes<HTMLButtonElement>>, keyof import("react").Component<any, {}, any>>;
+export declare const SubMenuContent: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<RadixNavigationMenu.NavigationMenuContentProps & import("react").RefAttributes<HTMLDivElement>, RadixNavigationMenu.NavigationMenuContentProps & import("react").RefAttributes<HTMLDivElement>>, never>, StyledProps>> & string & Omit<import("react").ForwardRefExoticComponent<RadixNavigationMenu.NavigationMenuContentProps & import("react").RefAttributes<HTMLDivElement>>, keyof import("react").Component<any, {}, any>>;
+export declare const SubMenuItem: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<RadixNavigationMenu.NavigationMenuItemProps & import("react").RefAttributes<HTMLLIElement>, StyledProps>> & string & Omit<import("react").ForwardRefExoticComponent<RadixNavigationMenu.NavigationMenuItemProps & import("react").RefAttributes<HTMLLIElement>>, keyof import("react").Component<any, {}, any>>;
+export declare const SubMenuList: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<RadixNavigationMenu.NavigationMenuListProps & import("react").RefAttributes<HTMLUListElement>, StyledProps>> & string & Omit<import("react").ForwardRefExoticComponent<RadixNavigationMenu.NavigationMenuListProps & import("react").RefAttributes<HTMLUListElement>>, keyof import("react").Component<any, {}, any>>;

package/dist/src/Navigation/components/MenuSubItem/parts/styled.js

@@ -0,0 +1,40 @@
+import * as RadixNavigationMenu from "@radix-ui/react-navigation-menu";
+import styled from "styled-components";
+import { addStyledProps } from "../../../../StyledProps";
+import { NAVIGATION_SUB_MENU_MIN_WIDTH_PX } from "../../shared/constants";
+import { disableHoverEvents } from "../../shared/disableHoverEvents";
+const getSharedPaddingStyles = (theme) => ({
+    paddingTop: theme.space.x1,
+    paddingBottom: theme.space.x1,
+});
+const getSharedInteractiveItemStyles = (theme) => ({
+    paddingLeft: theme.space.x1_5,
+    paddingRight: theme.space.x1_5,
+    fontWeight: theme.fontWeights.medium,
+    fontSize: theme.fontSizes.small,
+    lineHeight: theme.lineHeights.smallRelaxed,
+    whiteSpace: "nowrap",
+    transition: "background-color 250ms ease",
+});
+export const SubMenuItemLink = styled(RadixNavigationMenu.Link)(({ theme }) => (Object.assign(Object.assign(Object.assign({}, getSharedPaddingStyles(theme)), getSharedInteractiveItemStyles(theme)), { display: "flex", flexDirection: "column", alignItems: "flex-start", alignSelf: "stretch", width: "100%", textDecoration: "none", "&:hover, &:focus": {
+        backgroundColor: theme.colors.lightBlue,
+        color: theme.colors.darkBlue,
+        outline: "none",
+    }, "&:visited": {
+        color: "inherit",
+    } })), addStyledProps);
+export const SubMenuItemButton = styled(RadixNavigationMenu.Trigger)(({ theme }) => (Object.assign(Object.assign(Object.assign({}, getSharedPaddingStyles(theme)), getSharedInteractiveItemStyles(theme)), { display: "flex", alignItems: "center", justifyContent: "space-between", width: "100%", gap: theme.space.x2, background: "none", border: "none", outline: "none", color: theme.colors.darkGrey, userSelect: "none", "&:hover, &:focus": {
+        backgroundColor: theme.colors.lightBlue,
+        color: theme.colors.darkBlue,
+    } })), addStyledProps);
+export const SubMenuContent = styled(RadixNavigationMenu.Content).attrs(disableHoverEvents)(({ theme }) => (Object.assign(Object.assign({}, getSharedPaddingStyles(theme)), { position: "absolute", top: `calc(100% + ${theme.space.half})`, left: 0, minWidth: NAVIGATION_SUB_MENU_MIN_WIDTH_PX, display: "flex", flexDirection: "column", alignItems: "flex-start", background: theme.colors.white, color: theme.colors.darkGrey, borderRadius: theme.radii.medium, boxShadow: theme.shadows.medium, paddingRight: 0, paddingLeft: 0, listStyle: "none", "& > div": {
+        width: "100%",
+    } })), addStyledProps);
+export const SubMenuItem = styled(RadixNavigationMenu.Item)({
+    position: "relative",
+    width: "100%",
+}, addStyledProps);
+export const SubMenuList = styled(RadixNavigationMenu.List)({
+    padding: 0,
+    listStyle: "none",
+}, addStyledProps);

package/dist/src/Navigation/components/MobileNav/MobileNav.d.ts

@@ -1,5 +1,5 @@
-import React from "react";
-import { BaseNavigationProps } from "../../Navigation";
-type MobileNavProps = BaseNavigationProps;
-export default function MobileNav({ primaryNavigation, secondaryNavigation, appSwitcher, primaryLogo, secondaryLogo, userMenu, }: MobileNavProps): React.JSX.Element;
-export {};
+import React from "react";
+import { BaseNavigationProps } from "../../Navigation";
+type MobileNavProps = BaseNavigationProps;
+export default function MobileNav({ primaryNavigation, secondaryNavigation, appSwitcher, primaryLogo, secondaryLogo, userMenu, }: MobileNavProps): React.JSX.Element;
+export {};

package/dist/src/Navigation/components/MobileNav/MobileNav.js

@@ -0,0 +1,46 @@
+import React from "react";
+import * as RadixNavigationMenu from "@radix-ui/react-navigation-menu";
+import { useTranslation } from "react-i18next";
+import { NavigationMenuList, NavigationMenuRoot, NavigationMenuTrigger, RadixNavigationMenuItem, } from "../shared/components";
+import { NulogyAppSwitcher } from "../AppSwitcher/NulogyAppSwitcher";
+import { Icon } from "../../../Icon";
+import NavigationMenuContent from "../shared/NavigationMenuContent";
+import UserMenu from "../UserMenu/UserMenu";
+import { Box } from "../../../Box";
+import { getNavigationBarItems } from "../utils/getNavigationBarItems";
+import { NavigationMenuItem, NavigationMenuSubList } from "../shared/NavigationMenuItem";
+import { NulogyLogo } from "../NulogyLogo/NulogyLogo";
+import { NavigationLogoLink } from "../shared/NavigationLogoLink";
+import { MobileMenuItem } from "./parts/MobileMenuItem";
+import { MobileSecondaryLogoContainer } from "./parts/styled";
+export default function MobileNav({ primaryNavigation = [], secondaryNavigation = [], appSwitcher, primaryLogo, secondaryLogo, userMenu, }) {
+    const { t } = useTranslation();
+    return (React.createElement(NavigationMenuRoot, null,
+        React.createElement(NavigationMenuList, null,
+            React.createElement(NulogyAppSwitcher, { config: appSwitcher }),
+            React.createElement(RadixNavigationMenuItem, { display: "flex" }, primaryLogo !== null && primaryLogo !== void 0 ? primaryLogo : (React.createElement(NavigationLogoLink, { href: "/", "aria-label": t("nulogy logo") },
+                React.createElement(NulogyLogo, null))))),
+        (primaryNavigation.length > 0 || secondaryNavigation.length > 0 || userMenu) && (React.createElement(NavigationMenuList, null,
+            getNavigationBarItems([...primaryNavigation, ...secondaryNavigation]).map((item) => (React.createElement(RadixNavigationMenu.Item, { key: item.key },
+                React.createElement(NavigationMenuItem, { item: item })))),
+            React.createElement(RadixNavigationMenu.Item, null,
+                React.createElement(NavigationMenuTrigger, { "aria-label": t("toggle mobile menu") },
+                    React.createElement(Icon, { icon: "menu" })),
+                React.createElement(NavigationMenuContent, { right: 0 },
+                    React.createElement(UserMenu.Container, { p: "none", display: "flex", flexDirection: "column", gap: "x4" },
+                        primaryNavigation.length > 0 && (React.createElement(Box, { px: "x2" },
+                            React.createElement(RadixNavigationMenu.Sub, { orientation: "vertical" },
+                                React.createElement(NavigationMenuSubList, null, primaryNavigation.map((item) => (React.createElement(MobileMenuItem, { menuItem: item, key: item.key }))))))),
+                        secondaryNavigation.length > 0 && (React.createElement(Box, { px: "x2" },
+                            React.createElement(RadixNavigationMenu.Sub, { orientation: "vertical" },
+                                React.createElement(NavigationMenuSubList, null, secondaryNavigation.map((item) => (React.createElement(MobileMenuItem, { menuItem: item, key: item.key }))))))),
+                        userMenu && (React.createElement(React.Fragment, null,
+                            userMenu.header && (React.createElement(Box, { px: "x2" },
+                                React.createElement(UserMenu.Header, Object.assign({}, userMenu.header, { containerProps: { borderRadius: "large" } })))),
+                            userMenu.controls && React.createElement(Box, { px: "x2" }, userMenu.controls({ withinMobileNav: true })),
+                            userMenu.menuItems && userMenu.menuItems.length > 0 && (React.createElement(Box, { px: "none" },
+                                React.createElement(NavigationMenuSubList, null, userMenu.menuItems.map((item) => (React.createElement(UserMenu.MobileItem, { key: item.key, item: item }))))))))),
+                    secondaryLogo && (React.createElement(MobileSecondaryLogoContainer, null,
+                        React.createElement(NavigationMenuSubList, null,
+                            React.createElement(RadixNavigationMenuItem, null, secondaryLogo))))))))));
+}

package/dist/src/Navigation/components/MobileNav/parts/MobileMenuItem.d.ts

@@ -1,9 +1,9 @@
-import React from "react";
-import { MenuItem } from "../../../types";
-interface MobileMenuItemProps {
-    menuItem: MenuItem;
-    /** Depth (root = 0). */
-    level?: number;
-}
-export declare const MobileMenuItem: React.ForwardRefExoticComponent<MobileMenuItemProps & React.RefAttributes<HTMLLIElement>>;
-export {};
+import React from "react";
+import { MenuItem } from "../../../types";
+interface MobileMenuItemProps {
+    menuItem: MenuItem;
+    /** Depth (root = 0). */
+    level?: number;
+}
+export declare const MobileMenuItem: React.ForwardRefExoticComponent<MobileMenuItemProps & React.RefAttributes<HTMLLIElement>>;
+export {};

package/dist/src/Navigation/components/MobileNav/parts/MobileMenuItem.js

@@ -0,0 +1,84 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import React from "react";
+import * as RadixNavigationMenu from "@radix-ui/react-navigation-menu";
+import { Text } from "../../../../Type";
+import { Icon } from "../../../../Icon";
+import { Divider } from "../../../../Divider";
+import { RadixNavigationMenuItem } from "../../shared/components";
+import { NavigationMenuSubList } from "../../shared/NavigationMenuItem";
+import { IndentedContainer, MobileNavigationButton, MobileNavigationLink, MenuItemGroupLabel } from "./styled";
+export const MobileMenuItem = React.forwardRef((_a, forwardedRef) => {
+    var { menuItem, level = 0 } = _a, props = __rest(_a, ["menuItem", "level"]);
+    if (menuItem.mobileVisibility !== undefined && menuItem.mobileVisibility !== "navigationMenu") {
+        return null;
+    }
+    /* -------------------------------------------------------------------
+     * Separator
+     * -----------------------------------------------------------------*/
+    if (menuItem.type === "separator") {
+        return (React.createElement(RadixNavigationMenuItem, Object.assign({ ref: forwardedRef }, props),
+            React.createElement(IndentedContainer, { level: level },
+                React.createElement(Divider, { secondary: level > 0, my: "x2" }))));
+    }
+    /* -------------------------------------------------------------------
+     * Custom render fragment
+     * -----------------------------------------------------------------*/
+    if (menuItem.type === "custom") {
+        return (React.createElement(RadixNavigationMenuItem, Object.assign({ ref: forwardedRef }, props),
+            React.createElement(IndentedContainer, { level: level }, menuItem.render({ withinSubMenu: level > 0, level, withinMobileNav: true }))));
+    }
+    /* -------------------------------------------------------------------
+     * Helpers shared by link & button
+     * -----------------------------------------------------------------*/
+    const hasIcon = "icon" in menuItem;
+    const hasLabel = "label" in menuItem && !!menuItem.label;
+    const hasTooltip = "tooltip" in menuItem && !!menuItem.tooltip;
+    const IconFragment = hasIcon ? React.createElement(Icon, { icon: menuItem.icon, size: "x3", "aria-hidden": true }) : null;
+    // Determine the text to display: use label if available, otherwise use tooltip if icon is present
+    const labelText = hasLabel ? menuItem.label : hasIcon && hasTooltip ? menuItem.tooltip : null;
+    const LabelFragment = labelText ? (React.createElement(Text, { fontSize: "small", lineHeight: "smallTextCompressed" }, labelText)) : null;
+    /* -------------------------------------------------------------------
+     * Link
+     * -----------------------------------------------------------------*/
+    if (menuItem.type === "link") {
+        return (React.createElement(RadixNavigationMenuItem, Object.assign({ ref: forwardedRef }, props),
+            React.createElement(IndentedContainer, { level: level },
+                React.createElement(MobileNavigationLink, { asChild: true }, menuItem.element ? (React.cloneElement(menuItem.element, Object.assign(Object.assign({}, menuItem.props), { children: (React.createElement(React.Fragment, null,
+                        IconFragment,
+                        LabelFragment)) }))) : (React.createElement("a", Object.assign({}, menuItem.props),
+                    IconFragment,
+                    LabelFragment))))));
+    }
+    /* -------------------------------------------------------------------
+     * Button
+     * -----------------------------------------------------------------*/
+    if (menuItem.type === "button") {
+        const hasItems = !!menuItem.items && menuItem.items.length > 0;
+        // Button with nested items – show group label then children
+        if (hasItems) {
+            return (React.createElement(RadixNavigationMenuItem, Object.assign({ ref: forwardedRef }, props),
+                LabelFragment && (React.createElement(IndentedContainer, { level: level },
+                    React.createElement(MenuItemGroupLabel, null, labelText))),
+                React.createElement(RadixNavigationMenu.Sub, { orientation: "vertical" },
+                    React.createElement(NavigationMenuSubList, null, (menuItem.items || []).map((item) => (React.createElement(MobileMenuItem, { key: item.key, menuItem: item, level: level + 1 })))))));
+        }
+        // Simple button with no children
+        return (React.createElement(RadixNavigationMenuItem, Object.assign({ ref: forwardedRef }, props),
+            React.createElement(IndentedContainer, { level: level },
+                React.createElement(MobileNavigationButton, Object.assign({}, ("props" in menuItem ? menuItem.props : {})),
+                    IconFragment,
+                    LabelFragment))));
+    }
+    return null;
+});
+MobileMenuItem.displayName = "MobileMenuItem";

package/dist/src/Navigation/components/MobileNav/parts/styled.d.ts

@@ -1,18 +1,18 @@
-/// <reference types="react" />
-import * as RadixNavigationMenu from "@radix-ui/react-navigation-menu";
-export declare const IndentedContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import("../../../../Box").BoxProps> & import("../../../../Box").BoxProps, {
-    level: number;
-}>> & string;
-export declare const MenuItemGroupLabel: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, keyof import("react").HTMLAttributes<HTMLParagraphElement> | "disabled" | "inline" | "compact" | "textTransform" | keyof import("../../../..").StyledProps> & import("react").HTMLAttributes<HTMLParagraphElement> & {
-    variant?: import("../../../../NDSProvider/ComponentVariantContext").ComponentVariant;
-    inline?: boolean;
-    compact?: boolean;
-    disabled?: boolean;
-    textTransform?: "-moz-initial" | "inherit" | "initial" | "revert" | "unset" | "none" | "full-width" | "capitalize" | "full-size-kana" | "lowercase" | "uppercase";
-    fontSize?: string;
-} & import("../../../..").StyledProps, "ref"> & {
-    ref?: import("react").Ref<HTMLParagraphElement>;
-}, never>> & string;
-export declare const MobileNavigationButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<RadixNavigationMenu.NavigationMenuTriggerProps & import("react").RefAttributes<HTMLButtonElement>, never>> & string & Omit<import("react").ForwardRefExoticComponent<RadixNavigationMenu.NavigationMenuTriggerProps & import("react").RefAttributes<HTMLButtonElement>>, keyof import("react").Component<any, {}, any>>;
-export declare const MobileNavigationLink: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<RadixNavigationMenu.NavigationMenuLinkProps & import("react").RefAttributes<HTMLAnchorElement>, never>> & string & Omit<import("react").ForwardRefExoticComponent<RadixNavigationMenu.NavigationMenuLinkProps & import("react").RefAttributes<HTMLAnchorElement>>, keyof import("react").Component<any, {}, any>>;
-export declare const MobileSecondaryLogoContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<RadixNavigationMenu.NavigationMenuSubProps & import("react").RefAttributes<HTMLDivElement>, never>> & string & Omit<import("react").ForwardRefExoticComponent<RadixNavigationMenu.NavigationMenuSubProps & import("react").RefAttributes<HTMLDivElement>>, keyof import("react").Component<any, {}, any>>;
+/// <reference types="react" />
+import * as RadixNavigationMenu from "@radix-ui/react-navigation-menu";
+export declare const IndentedContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import("../../../../Box").BoxProps> & import("../../../../Box").BoxProps, {
+    level: number;
+}>> & string;
+export declare const MenuItemGroupLabel: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "textTransform" | "disabled" | keyof import("react").HTMLAttributes<HTMLParagraphElement> | "inline" | "compact" | keyof import("../../../..").StyledProps> & import("react").HTMLAttributes<HTMLParagraphElement> & {
+    variant?: import("../../../../NDSProvider/ComponentVariantContext").ComponentVariant;
+    inline?: boolean;
+    compact?: boolean;
+    disabled?: boolean;
+    textTransform?: "-moz-initial" | "inherit" | "initial" | "revert" | "unset" | "none" | "full-width" | "capitalize" | "full-size-kana" | "lowercase" | "uppercase";
+    fontSize?: string;
+} & import("../../../..").StyledProps, "ref"> & {
+    ref?: import("react").Ref<HTMLParagraphElement>;
+}, never>> & string;
+export declare const MobileNavigationButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<RadixNavigationMenu.NavigationMenuTriggerProps & import("react").RefAttributes<HTMLButtonElement>, never>> & string & Omit<import("react").ForwardRefExoticComponent<RadixNavigationMenu.NavigationMenuTriggerProps & import("react").RefAttributes<HTMLButtonElement>>, keyof import("react").Component<any, {}, any>>;
+export declare const MobileNavigationLink: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<RadixNavigationMenu.NavigationMenuLinkProps & import("react").RefAttributes<HTMLAnchorElement>, never>> & string & Omit<import("react").ForwardRefExoticComponent<RadixNavigationMenu.NavigationMenuLinkProps & import("react").RefAttributes<HTMLAnchorElement>>, keyof import("react").Component<any, {}, any>>;
+export declare const MobileSecondaryLogoContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<RadixNavigationMenu.NavigationMenuSubProps & import("react").RefAttributes<HTMLDivElement>, never>> & string & Omit<import("react").ForwardRefExoticComponent<RadixNavigationMenu.NavigationMenuSubProps & import("react").RefAttributes<HTMLDivElement>>, keyof import("react").Component<any, {}, any>>;

package/dist/src/Navigation/components/MobileNav/parts/styled.js

@@ -0,0 +1,23 @@
+import styled from "styled-components";
+import * as RadixNavigationMenu from "@radix-ui/react-navigation-menu";
+import { Box } from "../../../../Box";
+import { Text } from "../../../../Type";
+export const IndentedContainer = styled(Box)(({ theme, level }) => ({
+    paddingLeft: `calc(${level} * ${theme.space.x2})`,
+}));
+const commonPadding = (theme) => ({
+    paddingLeft: 0,
+    paddingRight: 0,
+    paddingTop: theme.space.x2,
+    paddingBottom: theme.space.x2,
+});
+const commonStyles = (theme) => (Object.assign(Object.assign({}, commonPadding(theme)), { background: "none", border: "none", outline: "none", userSelect: "none", display: "flex", alignItems: "center", gap: theme.space.x1, color: theme.colors.darkGrey, fontSize: theme.fontSizes.small, fontWeight: theme.fontWeights.medium, lineHeight: theme.lineHeights.smallTextBase, width: "100%", textAlign: "left" }));
+export const MenuItemGroupLabel = styled(Text)(({ theme }) => (Object.assign(Object.assign({}, commonPadding(theme)), { display: "flex", alignItems: "center", gap: theme.space.x1, color: theme.colors.darkGrey, fontSize: theme.fontSizes.small, fontWeight: theme.fontWeights.medium, lineHeight: theme.lineHeights.smallTextBase, width: "100%", textAlign: "left" })));
+export const MobileNavigationButton = styled(RadixNavigationMenu.Trigger)(({ theme }) => (Object.assign({}, commonStyles(theme))));
+export const MobileNavigationLink = styled(RadixNavigationMenu.Link)(({ theme }) => (Object.assign(Object.assign({}, commonStyles(theme)), { textDecoration: "none" })));
+export const MobileSecondaryLogoContainer = styled(RadixNavigationMenu.Sub)(({ theme }) => ({
+    marginTop: theme.space.x2,
+    padding: theme.space.x2,
+    display: "flex",
+    justifyContent: "center",
+}));

package/dist/src/Navigation/components/NulogyLogo/NulogyLogo.d.ts

@@ -1,6 +1,6 @@
-import React from "react";
-import type { NulogyAppName } from "../../../types/NulogyApp";
-export interface NulogyLogoProps {
-    app?: NulogyAppName;
-}
-export declare function NulogyLogo({ app }: NulogyLogoProps): React.JSX.Element;
+import React from "react";
+import type { NulogyAppName } from "../../../types/NulogyApp";
+export interface NulogyLogoProps {
+    app?: NulogyAppName;
+}
+export declare function NulogyLogo({ app }: NulogyLogoProps): React.JSX.Element;

package/dist/src/Navigation/components/NulogyLogo/NulogyLogo.js

@@ -0,0 +1,20 @@
+import React from "react";
+import { Flex } from "../../../Flex";
+import { Text } from "../../../Type";
+import { APP_DISPLAY_NAMES } from "../../../types/NulogyApp";
+import { SvgNulogyLogo } from "./SvgNulogyLogo";
+export function NulogyLogo({ app }) {
+    const appDisplayName = APP_DISPLAY_NAMES[app];
+    if (app && !(app in APP_DISPLAY_NAMES)) {
+        throw new Error(`Invalid app name: ${app}. Valid names are: ${Object.keys(APP_DISPLAY_NAMES).join(", ")}`);
+    }
+    return (React.createElement(Flex, { alignItems: "flex-start", justifyContent: "center", flexDirection: appDisplayName ? "column" : "row" },
+        React.createElement(SvgNulogyLogo, { width: "102", height: "24" }),
+        appDisplayName && (
+        /*
+        This Text component is using custom properties that are not
+        in the theme because we're trying to match the branding
+        typography and colors of the Nulogy logo.
+        */
+        React.createElement(Text, { fontSize: "10px", lineHeight: "12px", color: "#1C68A5", fontWeight: "normal", textTransform: "uppercase", letterSpacing: "0.4px" }, appDisplayName))));
+}

package/dist/src/Navigation/components/NulogyLogo/SvgNulogyLogo.d.ts

@@ -1,2 +1,2 @@
-import React, { SVGProps } from "react";
-export declare function SvgNulogyLogo(props: SVGProps<SVGSVGElement>): React.JSX.Element;
+import React, { SVGProps } from "react";
+export declare function SvgNulogyLogo(props: SVGProps<SVGSVGElement>): React.JSX.Element;

package/dist/src/Navigation/components/NulogyLogo/SvgNulogyLogo.js

@@ -0,0 +1,11 @@
+import React from "react";
+export function SvgNulogyLogo(props) {
+    return (React.createElement("svg", Object.assign({ viewBox: "0 0 102 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, props),
+        React.createElement("path", { d: "M23.4218 0.867146L27.759 2.60144V18.2175C27.759 21.5706 23.6157 22.1596 20.8189 22.5547C22.4185 22.1596 23.4307 21.7156 23.4218 18.2175V4.33721L19.0846 2.60144L23.4218 0.867146ZM5.20435 21.6875V12.1474C5.20435 11.1871 5.925 10.1009 6.79955 9.72653L11.2773 7.80283V13.8699L15.6145 16.4846C16.4891 16.9286 18.2175 16.9389 18.2175 15.616V13.0131L16.4802 12.1445V0L3.2555 4.87288C1.45757 5.53434 0 7.61934 0 9.54304V23.8569L5.20435 21.6875Z", fill: "#F0B41C" }),
+        React.createElement("path", { d: "M36.7354 18.4818H32.8096V7.1808H36.435V9.07491C36.9583 8.39756 37.6125 7.83242 38.3587 7.41313C39.0371 7.04867 39.7964 6.86089 40.5665 6.86709C41.7622 6.86709 42.6693 7.20991 43.2878 7.89553C43.9064 8.58116 44.2156 9.58444 44.2156 10.9054V18.4818H40.3105V12.0078C40.3105 11.4159 40.1892 10.9685 39.9465 10.6657C39.7038 10.3628 39.3442 10.2148 38.8678 10.2217C38.1831 10.2217 37.6563 10.4516 37.2874 10.9113C36.9184 11.371 36.7344 12.0404 36.7354 12.9194V18.4818Z", fill: "#1C68A5" }),
+        React.createElement("path", { d: "M54.0493 6.86694H57.9515V17.2594L54.3261 18.7081V16.5003C53.802 17.1785 53.148 17.7454 52.4024 18.168C51.7277 18.5291 50.9731 18.7149 50.2079 18.7081C49.0102 18.7081 48.1007 18.3628 47.4792 17.6722C46.8577 16.9817 46.5459 15.9779 46.5439 14.6609V6.86694H50.4698V13.5659C50.4698 14.1578 50.5911 14.6071 50.8338 14.9139C51.0765 15.2207 51.4361 15.3732 51.9126 15.3712C52.6031 15.3712 53.1299 15.1394 53.4929 14.6757C53.856 14.212 54.04 13.5451 54.0449 12.675L54.0493 6.86694Z", fill: "#1C68A5" }),
+        React.createElement("path", { d: "M62.349 18.7354H60.2773V0.830151L62.349 0V18.7354Z", fill: "#1C68A5" }),
+        React.createElement("path", { d: "M64.0928 13.0257C64.0928 11.2362 64.6615 9.76236 65.7989 8.60419C66.9364 7.44603 68.3787 6.86694 70.1258 6.86694C71.8729 6.86694 73.3152 7.44603 74.4526 8.60419C75.5901 9.76236 76.1588 11.2362 76.1588 13.0257C76.1588 14.8232 75.5901 16.3029 74.4526 17.4651C73.3152 18.6272 71.8729 19.2063 70.1258 19.2023C68.3856 19.2023 66.9453 18.6232 65.8049 17.4651C64.6645 16.3069 64.0938 14.8271 64.0928 13.0257ZM66.1497 13.0257C66.1497 14.4315 66.5132 15.5626 67.2402 16.4189C67.9673 17.2752 68.9208 17.7038 70.1006 17.7048C71.2845 17.7048 72.2419 17.2761 72.9729 16.4189C73.7039 15.5616 74.0719 14.4305 74.0768 13.0257C74.0768 11.6298 73.7088 10.5032 72.9729 9.64595C72.2369 8.78867 71.2795 8.36053 70.1006 8.36151C68.9168 8.36151 67.9634 8.79015 67.2402 9.64743C66.5171 10.5047 66.1536 11.6308 66.1497 13.0257Z", fill: "#1C68A5" }),
+        React.createElement("path", { d: "M86.2825 17.9933C85.7073 18.3338 85.0919 18.6013 84.4505 18.7895C83.8592 18.9596 83.2471 19.0463 82.6319 19.0469C80.9686 19.0469 79.6245 18.495 78.5995 17.3911C77.5745 16.2872 77.0625 14.8365 77.0635 13.0391C77.0635 11.2071 77.611 9.72043 78.706 8.57904C79.8011 7.43764 81.2315 6.86694 82.9974 6.86694C83.5542 6.87509 84.1095 6.92854 84.6577 7.02676C85.289 7.13133 86.0191 7.29213 86.8477 7.50916L88.3142 6.91726V17.1129C88.3142 18.4753 88.2496 19.4721 88.1203 20.1035C88.0069 20.6938 87.7835 21.2575 87.4618 21.7653C86.9756 22.5003 86.284 23.0761 85.473 23.4211C84.5283 23.8233 83.5089 24.0201 82.4824 23.9982C81.7434 23.9982 81.0074 23.9037 80.2923 23.7171C79.5452 23.5188 78.8236 23.2342 78.1422 22.8692L77.8034 20.4113L79.3201 21.4027C79.7777 21.6876 80.277 21.8993 80.7999 22.0302C81.3712 22.1909 81.9614 22.275 82.5549 22.2802C83.7387 22.2802 84.6567 21.9843 85.3088 21.3924C85.9608 20.8005 86.2854 19.958 86.2825 18.8649V17.9933ZM86.2825 16.4499V9.21238C85.7948 8.96846 85.2843 8.77317 84.7583 8.62935C84.298 8.50417 83.8235 8.43901 83.3466 8.4355C82.0848 8.4355 81.0692 8.8597 80.2997 9.7081C79.5303 10.5565 79.145 11.6851 79.144 13.0938C79.144 14.4473 79.4893 15.5216 80.1799 16.3168C80.8704 17.1119 81.8007 17.509 82.9707 17.508C83.461 17.5022 83.9474 17.4218 84.4135 17.2697C85.0592 17.0516 85.6846 16.7773 86.2825 16.4499Z", fill: "#1C68A5" }),
+        React.createElement("path", { d: "M90.0352 6.86694H92.1927L95.5784 15.7456L99.3044 6.86694H101.061L95.6672 19.3222L95.5784 19.4983C94.726 21.4378 94.0695 22.8189 93.6088 23.6416H91.364C91.8422 23.1454 92.2709 22.6037 92.644 22.0242C93.1111 21.2739 93.526 20.4922 93.8855 19.6847L94.6136 18.1176L90.0352 6.86694Z", fill: "#1C68A5" })));
+}

package/dist/src/Navigation/components/UserMenu/UserMenu.d.ts

@@ -1,14 +1,14 @@
-/// <reference types="react" />
-import * as RadixNavigationMenu from "@radix-ui/react-navigation-menu";
-import { StyledProps } from "../../../StyledProps";
-declare const UserMenu: {
-    Header: ({ title, subtitle1, subtitle2, containerProps }: import("./parts/Header").HeaderProps) => import("react").JSX.Element;
-    Container: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<RadixNavigationMenu.NavigationMenuSubProps & import("react").RefAttributes<HTMLDivElement>, RadixNavigationMenu.NavigationMenuSubProps & import("react").RefAttributes<HTMLDivElement>>, never>, StyledProps>> & string & Omit<import("react").ForwardRefExoticComponent<RadixNavigationMenu.NavigationMenuSubProps & import("react").RefAttributes<HTMLDivElement>>, keyof import("react").Component<any, {}, any>>;
-    Item: import("react").ForwardRefExoticComponent<import("./parts/Item").UserMenuItemProps & {
-        level?: number;
-    } & import("react").RefAttributes<HTMLLIElement>>;
-    MobileItem: import("react").ForwardRefExoticComponent<import("./parts/Item").UserMenuItemProps & {
-        level?: number;
-    } & import("react").RefAttributes<HTMLLIElement>>;
-};
-export default UserMenu;
+/// <reference types="react" />
+import * as RadixNavigationMenu from "@radix-ui/react-navigation-menu";
+import { StyledProps } from "../../../StyledProps";
+declare const UserMenu: {
+    Header: ({ title, subtitle1, subtitle2, containerProps }: import("./parts/Header").HeaderProps) => import("react").JSX.Element;
+    Container: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<RadixNavigationMenu.NavigationMenuSubProps & import("react").RefAttributes<HTMLDivElement>, RadixNavigationMenu.NavigationMenuSubProps & import("react").RefAttributes<HTMLDivElement>>, never>, StyledProps>> & string & Omit<import("react").ForwardRefExoticComponent<RadixNavigationMenu.NavigationMenuSubProps & import("react").RefAttributes<HTMLDivElement>>, keyof import("react").Component<any, {}, any>>;
+    Item: import("react").ForwardRefExoticComponent<import("./parts/Item").UserMenuItemProps & {
+        level?: number;
+    } & import("react").RefAttributes<HTMLLIElement>>;
+    MobileItem: import("react").ForwardRefExoticComponent<import("./parts/Item").UserMenuItemProps & {
+        level?: number;
+    } & import("react").RefAttributes<HTMLLIElement>>;
+};
+export default UserMenu;