@nulogy/components 16.0.0 → 16.0.2

package/dist/src/NavBarSearch/NavBarSearch.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from "react";
 import { styled } from "styled-components";
 import { darken, transparentize } from "polished";
@@ -12,11 +13,7 @@ const BaseNavBarSearch = ({ name = "global-search", onSubmit, ...props }) => {
         onSubmit(e);
     };
     const { t } = useTranslation();
-    return (React.createElement("form", { ...props, onSubmit: handleOnSubmit },
-        React.createElement(Flex, { role: "search" },
-            React.createElement(Input, { id: "navbar-search", type: "search", "aria-labelledby": name, required: true, placeholder: t("search nulogy") }),
-            React.createElement("button", { id: name, "aria-label": name },
-                React.createElement(Icon, { icon: "search" })))));
+    return (_jsx("form", { ...props, onSubmit: handleOnSubmit, children: _jsxs(Flex, { role: "search", children: [_jsx(Input, { id: "navbar-search", type: "search", "aria-labelledby": name, required: true, placeholder: t("search nulogy") }), _jsx("button", { id: name, "aria-label": name, children: _jsx(Icon, { icon: "search" }) })] }) }));
 };
 const NavBarSearch = styled(BaseNavBarSearch)(({ theme }) => ({
     background: theme.colors.lightBlue,

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

@@ -12,5 +12,5 @@ export interface BaseNavigationProps {
 export interface NavigationProps extends BaseNavigationProps {
     breakpoint?: string;
 }
-declare const Navigation: ({ breakpoint, ...props }: NavigationProps) => React.JSX.Element;
+declare const Navigation: ({ breakpoint, ...props }: NavigationProps) => import("react/jsx-runtime").JSX.Element;
 export default Navigation;

package/dist/src/Navigation/Navigation.js

@@ -1,4 +1,4 @@
-import React from "react";
+import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
 import { useTheme } from "styled-components";
 import useMediaQuery from "../hooks/useMediaQuery";
 import DesktopNav from "./components/DesktopNav/DesktopNav";
@@ -8,6 +8,6 @@ const Navigation = ({ breakpoint = NAVIGATION_DEFAULT_BREAKPOINT_THEME_KEY, ...p
     const theme = useTheme();
     const query = theme?.breakpoints?.[breakpoint] ? breakpoint : `(min-width: ${breakpoint})`;
     const largeScreen = useMediaQuery(query);
-    return React.createElement(React.Fragment, null, largeScreen ? React.createElement(DesktopNav, { ...props }) : React.createElement(MobileNav, { ...props }));
+    return _jsx(_Fragment, { children: largeScreen ? _jsx(DesktopNav, { ...props }) : _jsx(MobileNav, { ...props }) });
 };
 export default Navigation;

package/dist/src/Navigation/components/AppSwitcher/NulogyAppSwitcher.d.ts

@@ -10,5 +10,5 @@ export type AppSwitcherConfig = false | {
 type AppSwitcherProps = {
     config: AppSwitcherConfig;
 };
-export declare function NulogyAppSwitcher({ config }: AppSwitcherProps): React.JSX.Element;
+export declare function NulogyAppSwitcher({ config }: AppSwitcherProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/src/Navigation/components/AppSwitcher/NulogyAppSwitcher.js

@@ -1,4 +1,5 @@
-import React, { useMemo } from "react";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMemo } from "react";
 import * as RadixNavigationMenu from "@radix-ui/react-navigation-menu";
 import { useTranslation } from "react-i18next";
 import { Icon } from "../../../Icon";
@@ -63,15 +64,5 @@ export function NulogyAppSwitcher({ config }) {
     }, [config, t]);
     if (!config)
         return null;
-    return (React.createElement(RadixNavigationMenu.Item, null,
-        React.createElement(NavigationMenuIconTrigger, { "aria-label": t("toggle app switcher") },
-            React.createElement(Icon, { icon: "apps", size: "x3" })),
-        React.createElement(NavigationMenuContent, { left: 0, "aria-label": t("app switcher") },
-            React.createElement(RadixNavigationMenu.Sub, null,
-                React.createElement(AppSwitcher.List, null, includedApps.map((app) => (React.createElement(AppSwitcher.Item, { key: app.id },
-                    React.createElement(AppSwitcher.Link, { href: app.url, "aria-label": app.label },
-                        app.indicator ? (React.createElement(AppSwitcher.Header, null,
-                            React.createElement(AppSwitcher.Title, null, app.label),
-                            app.indicator)) : (React.createElement(AppSwitcher.Title, null, app.label)),
-                        React.createElement(AppSwitcher.Description, null, app.description))))))))));
+    return (_jsxs(RadixNavigationMenu.Item, { children: [_jsx(NavigationMenuIconTrigger, { "aria-label": t("toggle app switcher"), children: _jsx(Icon, { icon: "apps", size: "x3" }) }), _jsx(NavigationMenuContent, { left: 0, "aria-label": t("app switcher"), children: _jsx(RadixNavigationMenu.Sub, { children: _jsx(AppSwitcher.List, { children: includedApps.map((app) => (_jsx(AppSwitcher.Item, { children: _jsxs(AppSwitcher.Link, { href: app.url, "aria-label": app.label, children: [app.indicator ? (_jsxs(AppSwitcher.Header, { children: [_jsx(AppSwitcher.Title, { children: app.label }), app.indicator] })) : (_jsx(AppSwitcher.Title, { children: app.label })), _jsx(AppSwitcher.Description, { children: app.description })] }) }, app.id))) }) }) })] }));
 }

package/dist/src/Navigation/components/AppSwitcher/parts/Item.d.ts

@@ -1,4 +1,6 @@
 import React from "react";
 import * as RadixNavigationMenu from "@radix-ui/react-navigation-menu";
-declare const Item: React.ForwardRefExoticComponent<Omit<import("styled-components").FastOmit<RadixNavigationMenu.NavigationMenuItemProps & React.RefAttributes<HTMLLIElement>, never>, "ref"> & React.RefAttributes<HTMLLIElement>>;
+declare const Item: React.ForwardRefExoticComponent<Omit<import("styled-components").FastOmit<Omit<RadixNavigationMenu.NavigationMenuItemProps & React.RefAttributes<HTMLLIElement>, "ref"> & {
+    ref?: React.Ref<HTMLLIElement>;
+}, never>, "ref"> & React.RefAttributes<HTMLLIElement>>;
 export default Item;

package/dist/src/Navigation/components/AppSwitcher/parts/Item.js

@@ -1,9 +1,10 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 import React from "react";
 import { styled } from "styled-components";
 import * as RadixNavigationMenu from "@radix-ui/react-navigation-menu";
 const FullWidthItem = styled(RadixNavigationMenu.Item)({
     width: "100%",
 });
-const Item = React.forwardRef(({ children, ...props }, forwardedRef) => (React.createElement(FullWidthItem, { ...props, ref: forwardedRef }, children)));
+const Item = React.forwardRef(({ children, ...props }, forwardedRef) => (_jsx(FullWidthItem, { ...props, ref: forwardedRef, children: children })));
 Item.displayName = "Item";
 export default Item;

package/dist/src/Navigation/components/AppSwitcher/parts/Link.js

@@ -1,8 +1,8 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 import React from "react";
 import * as RadixNavigationMenu from "@radix-ui/react-navigation-menu";
 import { styled } from "styled-components";
-const Link = React.forwardRef(({ children, ...props }, forwardedRef) => (React.createElement(RadixNavigationMenu.Link, { asChild: true },
-    React.createElement(A, { ...props, ref: forwardedRef }, children))));
+const Link = React.forwardRef(({ children, ...props }, forwardedRef) => (_jsx(RadixNavigationMenu.Link, { asChild: true, children: _jsx(A, { ...props, ref: forwardedRef, children: children }) })));
 Link.displayName = "Link";
 export default Link;
 export const A = styled("a")(({ theme }) => ({

package/dist/src/Navigation/components/AppSwitcher/parts/index.d.ts

@@ -1,15 +1,23 @@
 import * as RadixNavigationMenu from "@radix-ui/react-navigation-menu";
 declare const AppSwitcher: {
-    Content: 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>, import("../../shared/NavigationMenuContent").NavigationMenuContentProps>> & string & Omit<import("react").ForwardRefExoticComponent<RadixNavigationMenu.NavigationMenuContentProps & import("react").RefAttributes<HTMLDivElement>>, keyof import("react").Component<any, {}, any>>;
-    List: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<RadixNavigationMenu.NavigationMenuListProps & import("react").RefAttributes<HTMLUListElement>, never>> & string & Omit<import("react").ForwardRefExoticComponent<RadixNavigationMenu.NavigationMenuListProps & import("react").RefAttributes<HTMLUListElement>>, keyof import("react").Component<any, {}, any>>;
-    Item: import("react").ForwardRefExoticComponent<Omit<import("styled-components").FastOmit<RadixNavigationMenu.NavigationMenuItemProps & import("react").RefAttributes<HTMLLIElement>, never>, "ref"> & import("react").RefAttributes<HTMLLIElement>>;
+    Content: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<Omit<RadixNavigationMenu.NavigationMenuContentProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & {
+        ref?: import("react").Ref<HTMLDivElement>;
+    }, Omit<RadixNavigationMenu.NavigationMenuContentProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & {
+        ref?: import("react").Ref<HTMLDivElement>;
+    }>, never>, import("../../shared/NavigationMenuContent").NavigationMenuContentProps>> & string & Omit<import("react").ForwardRefExoticComponent<RadixNavigationMenu.NavigationMenuContentProps & import("react").RefAttributes<HTMLDivElement>>, keyof import("react").Component<any, {}, any>>;
+    List: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<RadixNavigationMenu.NavigationMenuListProps & import("react").RefAttributes<HTMLUListElement>, "ref"> & {
+        ref?: import("react").Ref<HTMLUListElement>;
+    }, never>> & string & Omit<import("react").ForwardRefExoticComponent<RadixNavigationMenu.NavigationMenuListProps & import("react").RefAttributes<HTMLUListElement>>, keyof import("react").Component<any, {}, any>>;
+    Item: import("react").ForwardRefExoticComponent<Omit<import("styled-components").FastOmit<Omit<RadixNavigationMenu.NavigationMenuItemProps & import("react").RefAttributes<HTMLLIElement>, "ref"> & {
+        ref?: import("react").Ref<HTMLLIElement>;
+    }, never>, "ref"> & import("react").RefAttributes<HTMLLIElement>>;
     Link: import("react").ForwardRefExoticComponent<Omit<import("styled-components").FastOmit<Omit<import("react").DetailedHTMLProps<import("react").AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "ref"> & {
         ref?: import("react").Ref<HTMLAnchorElement>;
     }, never>, "ref"> & import("react").RefAttributes<HTMLAnchorElement>>;
     Header: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
         ref?: import("react").Ref<HTMLDivElement>;
     }, never>> & string;
-    Title: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<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> & {
+    Title: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "textTransform" | keyof import("react").HTMLAttributes<HTMLParagraphElement> | "disabled" | "inline" | "compact" | keyof import("../../../..").StyledProps> & import("react").HTMLAttributes<HTMLParagraphElement> & {
         variant?: import("../../../../NDSProvider/ComponentVariantContext").ComponentVariant;
         inline?: boolean;
         compact?: boolean;
@@ -20,7 +28,7 @@ declare const AppSwitcher: {
         ref?: import("react").Ref<HTMLParagraphElement>;
     }, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, "ref"> & {
         ref?: import("react").Ref<HTMLHeadingElement>;
-    }>, never>, never>, import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<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> & {
+    }>, never>, never>, import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "textTransform" | keyof import("react").HTMLAttributes<HTMLParagraphElement> | "disabled" | "inline" | "compact" | keyof import("../../../..").StyledProps> & import("react").HTMLAttributes<HTMLParagraphElement> & {
         variant?: import("../../../../NDSProvider/ComponentVariantContext").ComponentVariant;
         inline?: boolean;
         compact?: boolean;
@@ -32,7 +40,7 @@ declare const AppSwitcher: {
     }, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, "ref"> & {
         ref?: import("react").Ref<HTMLHeadingElement>;
     }>, never>, never>>, never>, never>> & string;
-    Description: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<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> & {
+    Description: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "textTransform" | keyof import("react").HTMLAttributes<HTMLParagraphElement> | "disabled" | "inline" | "compact" | keyof import("../../../..").StyledProps> & import("react").HTMLAttributes<HTMLParagraphElement> & {
         variant?: import("../../../../NDSProvider/ComponentVariantContext").ComponentVariant;
         inline?: boolean;
         compact?: boolean;
@@ -41,7 +49,7 @@ declare const AppSwitcher: {
         fontSize?: string;
     } & import("../../../..").StyledProps, "ref"> & {
         ref?: import("react").Ref<HTMLParagraphElement>;
-    }, 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> & {
+    }, Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "textTransform" | keyof import("react").HTMLAttributes<HTMLParagraphElement> | "disabled" | "inline" | "compact" | keyof import("../../../..").StyledProps> & import("react").HTMLAttributes<HTMLParagraphElement> & {
         variant?: import("../../../../NDSProvider/ComponentVariantContext").ComponentVariant;
         inline?: boolean;
         compact?: boolean;

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

@@ -1,5 +1,4 @@
-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 default function DesktopNav({ primaryNavigation, secondaryNavigation, appSwitcher, secondaryLogo, primaryLogo, userMenu, }: DesktopNavProps): import("react/jsx-runtime").JSX.Element;
 export {};

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

@@ -1,4 +1,5 @@
-import React, { useMemo } from "react";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMemo } from "react";
 import * as RadixNavigationMenu from "@radix-ui/react-navigation-menu";
 import { useTranslation } from "react-i18next";
 import { Box, Divider, Flex, TruncatedText, VerticalDivider } from "../../..";
@@ -16,33 +17,5 @@ export default function DesktopNav({ primaryNavigation = [], secondaryNavigation
     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 ?? (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, { ...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 }))))))))))))))));
+    return (_jsxs(NavigationMenuRoot, { children: [_jsxs(NavigationMenuList, { ref: primaryMenuRef, children: [_jsx(NulogyAppSwitcher, { config: appSwitcher }), _jsx(RadixNavigationMenuItem, { display: "flex", children: primaryLogo ?? (_jsx(NavigationLogoLink, { href: "/", "aria-label": "Nulogy Logo", children: _jsx(NulogyLogo, {}) })) }), menuItems.map((item) => (_jsx(NavigationMenuItem, { item: item }, item.key))), moreMenu.length > 0 && _jsx(MoreMenuItem, { moreMenu: moreMenu }), hiddenMenuItem && _jsx(HiddenNavigationMenuItem, { ref: hiddenButtonRef, item: hiddenMenuItem })] }), _jsxs(NavigationMenuList, { ref: secondaryMenuRef, children: [secondaryNavigation.map((item) => (_jsx(NavigationMenuItem, { item: item }, item.key))), secondaryNavigation.length > 0 && userMenuExists && _jsx(VerticalDivider, {}), secondaryLogo && _jsx(RadixNavigationMenuItem, { display: "flex", children: secondaryLogo }), secondaryLogo && userMenuExists && _jsx(VerticalDivider, {}), userMenuExists && (_jsxs(RadixNavigationMenu.Item, { children: [_jsxs(NavigationMenuTrigger, { py: "half", disabled: !hasUserMenuContent, "aria-label": t("toggle user menu"), children: [_jsxs(Flex, { flexDirection: "column", alignItems: "flex-start", children: [_jsx(TruncatedText, { showTooltip: false, fontSize: "smaller", lineHeight: "smallerText", fontWeight: "normal", children: userMenu.triggerText.title }), userMenu.triggerText.subtitle1 && (_jsx(TruncatedText, { showTooltip: false, fontSize: "smaller", lineHeight: "smallerText", fontWeight: "normal", children: userMenu.triggerText.subtitle1 })), userMenu.triggerText.subtitle2 && (_jsx(TruncatedText, { showTooltip: false, fontSize: "smaller", lineHeight: "smallerText", fontWeight: "normal", children: userMenu.triggerText.subtitle2 }))] }), hasUserMenuContent && _jsx(CaretDown, { icon: "downArrow", size: "x2", "aria-hidden": true })] }), hasUserMenuContent && (_jsxs(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"), children: [userMenu.header && _jsx(UserMenu.Header, { ...userMenu.header }), (userMenu.controls || (userMenu.menuItems && userMenu.menuItems.length > 0)) && (_jsxs(UserMenu.Container, { p: "none", display: "flex", flexDirection: "column", children: [userMenu.controls && _jsx(Box, { p: "x2", children: userMenu.controls({ withinMobileNav: false }) }), userMenu.controls && userMenu.menuItems && userMenu.menuItems.length > 0 && (_jsx(Box, { px: "x2", children: _jsx(Divider, { my: "x2" }) })), userMenu.menuItems && userMenu.menuItems.length > 0 && (_jsx(Box, { px: "none", children: _jsx(RadixNavigationMenu.Sub, { orientation: "vertical", children: _jsx(NavigationMenuSubList, { children: userMenu.menuItems.map((item) => (_jsx(UserMenu.Item, { item: item }, item.key))) }) }) }))] }))] }))] }))] })] }));
 }

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

@@ -2,7 +2,11 @@ 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>, {
+}): import("react/jsx-runtime").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<Omit<import("../../shared/NavigationMenuItem").NavigationMenuItemProps & React.RefAttributes<HTMLLIElement>, "ref"> & {
+    ref?: React.Ref<HTMLLIElement>;
+}, Omit<import("../../shared/NavigationMenuItem").NavigationMenuItemProps & React.RefAttributes<HTMLLIElement>, "ref"> & {
+    ref?: React.Ref<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

@@ -1,10 +1,10 @@
-import React from "react";
+import { jsx as _jsx } from "react/jsx-runtime";
 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: {
+    return (_jsx(NavigationMenuItem, { item: {
             key: "nds-primary-menu-more-item",
             label: t("more"),
             type: "button",

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

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

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

@@ -1,6 +1,5 @@
-import React from "react";
+import { jsx as _jsx } from "react/jsx-runtime";
 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)));
+const EnvironmentBanner = ({ children }) => (_jsx(Box, { bg: "darkBlue", textAlign: "center", children: _jsx(Text, { fontSize: "10px", letterSpacing: "0.5px", fontWeight: "bold", color: "white", textTransform: "uppercase", py: "2px", children: children }) }));
 export default EnvironmentBanner;

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

@@ -1,8 +1,7 @@
-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 declare function MenuSubItem({ item, level }: Props): import("react/jsx-runtime").JSX.Element;
 export {};

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

@@ -1,3 +1,4 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import React from "react";
 import * as RadixNavigationMenu from "@radix-ui/react-navigation-menu";
 import { useTheme } from "styled-components";
@@ -12,13 +13,13 @@ export function MenuSubItem({ item, level }) {
      * Separator
      * -------------------------------------------------------------------*/
     if (item.type === "separator") {
-        return React.createElement(Divider, { my: "x1", mx: "x1", width: "auto" });
+        return _jsx(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 })));
+        return (_jsx(RadixNavigationMenu.Item, { children: item.render({ withinSubMenu: true, level, withinMobileNav: false }) }, item.key));
     }
     /* ---------------------------------------------------------------------
      * Default render
@@ -26,15 +27,6 @@ export function MenuSubItem({ item, level }) {
     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, item.label ?? 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, { ...item.props, children: content })) : (React.createElement("a", { ...item.props }, content)))) : (React.createElement(React.Fragment, null,
-        React.createElement(SubMenuItemButton, { ...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, item.items?.map((subItem) => React.createElement(MenuSubItem, { key: subItem.key, item: subItem, level: level + 1 }))))))))));
+    const content = (_jsxs(_Fragment, { children: [hasIcon && (_jsxs(Flex, { alignItems: "center", gap: "x1", children: [_jsx(Icon, { icon: item.icon, size: "x3", "aria-hidden": true }), _jsx("span", { children: item.label ?? item.tooltip })] })), "label" in item && item.label && !hasIcon && _jsx("span", { children: item.label }), hasSubMenu && _jsx(CaretRight, { "aria-hidden": true, size: "x2" })] }));
+    return (_jsx(SubMenuItem, { value: "label" in item ? item.label : item.key, children: isLink ? (_jsx(SubMenuItemLink, { asChild: true, children: item.element ? (React.cloneElement(item.element, { ...item.props, children: content })) : (_jsx("a", { ...item.props, children: content })) })) : (_jsxs(_Fragment, { children: [_jsx(SubMenuItemButton, { ...item.props, children: content }), hasSubMenu && (_jsx(SubMenuContent, { left: `calc(100% - ${theme.space.half})`, top: `calc(-1 * ${theme.space.x1})`, children: _jsx(RadixNavigationMenu.Sub, { orientation: "vertical", children: _jsx(SubMenuList, { children: item.items?.map((subItem) => (_jsx(MenuSubItem, { item: subItem, level: level + 1 }, subItem.key))) }) }) }))] })) }, item.key));
 }

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

@@ -1,7 +1,19 @@
 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>>;
+export declare const SubMenuItemLink: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<Omit<RadixNavigationMenu.NavigationMenuLinkProps & import("react").RefAttributes<HTMLAnchorElement>, "ref"> & {
+    ref?: import("react").Ref<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<Omit<RadixNavigationMenu.NavigationMenuTriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & {
+    ref?: import("react").Ref<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<Omit<RadixNavigationMenu.NavigationMenuContentProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & {
+    ref?: import("react").Ref<HTMLDivElement>;
+}, Omit<RadixNavigationMenu.NavigationMenuContentProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & {
+    ref?: import("react").Ref<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<Omit<RadixNavigationMenu.NavigationMenuItemProps & import("react").RefAttributes<HTMLLIElement>, "ref"> & {
+    ref?: import("react").Ref<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<Omit<RadixNavigationMenu.NavigationMenuListProps & import("react").RefAttributes<HTMLUListElement>, "ref"> & {
+    ref?: import("react").Ref<HTMLUListElement>;
+}, StyledProps>> & string & Omit<import("react").ForwardRefExoticComponent<RadixNavigationMenu.NavigationMenuListProps & import("react").RefAttributes<HTMLUListElement>>, keyof import("react").Component<any, {}, any>>;

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

@@ -1,5 +1,4 @@
-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 default function MobileNav({ primaryNavigation, secondaryNavigation, appSwitcher, primaryLogo, secondaryLogo, userMenu, }: MobileNavProps): import("react/jsx-runtime").JSX.Element;
 export {};

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

@@ -1,4 +1,4 @@
-import React from "react";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import * as RadixNavigationMenu from "@radix-ui/react-navigation-menu";
 import { useTranslation } from "react-i18next";
 import { NavigationMenuList, NavigationMenuRoot, NavigationMenuTrigger, RadixNavigationMenuItem, } from "../shared/components";
@@ -15,32 +15,5 @@ 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 ?? (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, { ...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))))))))));
+    return (_jsxs(NavigationMenuRoot, { children: [_jsxs(NavigationMenuList, { children: [_jsx(NulogyAppSwitcher, { config: appSwitcher }), _jsx(RadixNavigationMenuItem, { display: "flex", children: primaryLogo ?? (_jsx(NavigationLogoLink, { href: "/", "aria-label": t("nulogy logo"), children: _jsx(NulogyLogo, {}) })) })] }), (primaryNavigation.length > 0 || secondaryNavigation.length > 0 || userMenu) && (_jsxs(NavigationMenuList, { children: [getNavigationBarItems([...primaryNavigation, ...secondaryNavigation]).map((item) => (_jsx(RadixNavigationMenu.Item, { children: _jsx(NavigationMenuItem, { item: item }) }, item.key))), _jsxs(RadixNavigationMenu.Item, { children: [_jsx(NavigationMenuTrigger, { "aria-label": t("toggle mobile menu"), children: _jsx(Icon, { icon: "menu" }) }), _jsxs(NavigationMenuContent, { right: 0, children: [_jsxs(UserMenu.Container, { p: "none", display: "flex", flexDirection: "column", gap: "x4", children: [primaryNavigation.length > 0 && (_jsx(Box, { px: "x2", children: _jsx(RadixNavigationMenu.Sub, { orientation: "vertical", children: _jsx(NavigationMenuSubList, { children: primaryNavigation.map((item) => (_jsx(MobileMenuItem, { menuItem: item }, item.key))) }) }) })), secondaryNavigation.length > 0 && (_jsx(Box, { px: "x2", children: _jsx(RadixNavigationMenu.Sub, { orientation: "vertical", children: _jsx(NavigationMenuSubList, { children: secondaryNavigation.map((item) => (_jsx(MobileMenuItem, { menuItem: item }, item.key))) }) }) })), userMenu && (_jsxs(_Fragment, { children: [userMenu.header && (_jsx(Box, { px: "x2", children: _jsx(UserMenu.Header, { ...userMenu.header, containerProps: { borderRadius: "large" } }) })), userMenu.controls && _jsx(Box, { px: "x2", children: userMenu.controls({ withinMobileNav: true }) }), userMenu.menuItems && userMenu.menuItems.length > 0 && (_jsx(Box, { px: "none", children: _jsx(NavigationMenuSubList, { children: userMenu.menuItems.map((item) => (_jsx(UserMenu.MobileItem, { item: item }, item.key))) }) }))] }))] }), secondaryLogo && (_jsx(MobileSecondaryLogoContainer, { children: _jsx(NavigationMenuSubList, { children: _jsx(RadixNavigationMenuItem, { children: secondaryLogo }) }) }))] })] })] }))] }));
 }

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

@@ -1,3 +1,4 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import React from "react";
 import * as RadixNavigationMenu from "@radix-ui/react-navigation-menu";
 import { Text } from "../../../../Type";
@@ -14,16 +15,13 @@ export const MobileMenuItem = React.forwardRef(({ menuItem, level = 0, ...props
      * Separator
      * -----------------------------------------------------------------*/
     if (menuItem.type === "separator") {
-        return (React.createElement(RadixNavigationMenuItem, { ref: forwardedRef, ...props },
-            React.createElement(IndentedContainer, { level: level },
-                React.createElement(Divider, { secondary: level > 0, my: "x2" }))));
+        return (_jsx(RadixNavigationMenuItem, { ref: forwardedRef, ...props, children: _jsx(IndentedContainer, { level: level, children: _jsx(Divider, { secondary: level > 0, my: "x2" }) }) }));
     }
     /* -------------------------------------------------------------------
      * Custom render fragment
      * -----------------------------------------------------------------*/
     if (menuItem.type === "custom") {
-        return (React.createElement(RadixNavigationMenuItem, { ref: forwardedRef, ...props },
-            React.createElement(IndentedContainer, { level: level }, menuItem.render({ withinSubMenu: level > 0, level, withinMobileNav: true }))));
+        return (_jsx(RadixNavigationMenuItem, { ref: forwardedRef, ...props, children: _jsx(IndentedContainer, { level: level, children: menuItem.render({ withinSubMenu: level > 0, level, withinMobileNav: true }) }) }));
     }
     /* -------------------------------------------------------------------
      * Helpers shared by link & button
@@ -31,24 +29,18 @@ export const MobileMenuItem = React.forwardRef(({ menuItem, level = 0, ...props
     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;
+    const IconFragment = hasIcon ? _jsx(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;
+    const LabelFragment = labelText ? (_jsx(Text, { fontSize: "small", lineHeight: "smallTextCompressed", children: labelText })) : null;
     /* -------------------------------------------------------------------
      * Link
      * -----------------------------------------------------------------*/
     if (menuItem.type === "link") {
-        return (React.createElement(RadixNavigationMenuItem, { ref: forwardedRef, ...props },
-            React.createElement(IndentedContainer, { level: level },
-                React.createElement(MobileNavigationLink, { asChild: true }, menuItem.element ? (React.cloneElement(menuItem.element, {
-                    ...menuItem.props,
-                    children: (React.createElement(React.Fragment, null,
-                        IconFragment,
-                        LabelFragment)),
-                })) : (React.createElement("a", { ...menuItem.props },
-                    IconFragment,
-                    LabelFragment))))));
+        return (_jsx(RadixNavigationMenuItem, { ref: forwardedRef, ...props, children: _jsx(IndentedContainer, { level: level, children: _jsx(MobileNavigationLink, { asChild: true, children: menuItem.element ? (React.cloneElement(menuItem.element, {
+                        ...menuItem.props,
+                        children: (_jsxs(_Fragment, { children: [IconFragment, LabelFragment] })),
+                    })) : (_jsxs("a", { ...menuItem.props, children: [IconFragment, LabelFragment] })) }) }) }));
     }
     /* -------------------------------------------------------------------
      * Button
@@ -57,18 +49,10 @@ export const MobileMenuItem = React.forwardRef(({ menuItem, level = 0, ...props
         const hasItems = !!menuItem.items && menuItem.items.length > 0;
         // Button with nested items – show group label then children
         if (hasItems) {
-            return (React.createElement(RadixNavigationMenuItem, { 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 })))))));
+            return (_jsxs(RadixNavigationMenuItem, { ref: forwardedRef, ...props, children: [LabelFragment && (_jsx(IndentedContainer, { level: level, children: _jsx(MenuItemGroupLabel, { children: labelText }) })), _jsx(RadixNavigationMenu.Sub, { orientation: "vertical", children: _jsx(NavigationMenuSubList, { children: (menuItem.items || []).map((item) => (_jsx(MobileMenuItem, { menuItem: item, level: level + 1 }, item.key))) }) })] }));
         }
         // Simple button with no children
-        return (React.createElement(RadixNavigationMenuItem, { ref: forwardedRef, ...props },
-            React.createElement(IndentedContainer, { level: level },
-                React.createElement(MobileNavigationButton, { ...("props" in menuItem ? menuItem.props : {}) },
-                    IconFragment,
-                    LabelFragment))));
+        return (_jsx(RadixNavigationMenuItem, { ref: forwardedRef, ...props, children: _jsx(IndentedContainer, { level: level, children: _jsxs(MobileNavigationButton, { ...("props" in menuItem ? menuItem.props : {}), children: [IconFragment, LabelFragment] }) }) }));
     }
     return null;
 });

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

@@ -2,7 +2,7 @@ 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> & {
+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" | keyof import("react").HTMLAttributes<HTMLParagraphElement> | "disabled" | "inline" | "compact" | keyof import("../../../..").StyledProps> & import("react").HTMLAttributes<HTMLParagraphElement> & {
     variant?: import("../../../../NDSProvider/ComponentVariantContext").ComponentVariant;
     inline?: boolean;
     compact?: boolean;
@@ -12,6 +12,12 @@ export declare const MenuItemGroupLabel: import("styled-components/dist/types").
 } & 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>>;
+export declare const MobileNavigationButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<RadixNavigationMenu.NavigationMenuTriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & {
+    ref?: import("react").Ref<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<Omit<RadixNavigationMenu.NavigationMenuLinkProps & import("react").RefAttributes<HTMLAnchorElement>, "ref"> & {
+    ref?: import("react").Ref<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<Omit<RadixNavigationMenu.NavigationMenuSubProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & {
+    ref?: import("react").Ref<HTMLDivElement>;
+}, never>> & string & Omit<import("react").ForwardRefExoticComponent<RadixNavigationMenu.NavigationMenuSubProps & import("react").RefAttributes<HTMLDivElement>>, keyof import("react").Component<any, {}, any>>;

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

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

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

@@ -1,4 +1,4 @@
-import React from "react";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Flex } from "../../../Flex";
 import { Text } from "../../../Type";
 import { APP_DISPLAY_NAMES } from "../../../types/NulogyApp";
@@ -8,13 +8,11 @@ export function NulogyLogo({ 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))));
+    return (_jsxs(Flex, { alignItems: "flex-start", justifyContent: "center", flexDirection: appDisplayName ? "column" : "row", children: [_jsx(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.
+            */
+            _jsx(Text, { fontSize: "10px", lineHeight: "12px", color: "#1C68A5", fontWeight: "normal", textTransform: "uppercase", letterSpacing: "0.4px", children: appDisplayName }))] }));
 }