@nulogy/components 15.2.2 → 15.3.0

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 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>>;
@@ -15,7 +14,7 @@ declare const AppSwitcher: {
         inline?: boolean;
         compact?: boolean;
         disabled?: boolean;
-        textTransform?: "-moz-initial" | "inherit" | "initial" | "revert" | "unset" | "none" | "full-width" | "capitalize" | "full-size-kana" | "lowercase" | "uppercase";
+        textTransform?: "none" | "inherit" | "initial" | "-moz-initial" | "revert" | "unset" | "capitalize" | "full-size-kana" | "full-width" | "lowercase" | "uppercase" | undefined;
         fontSize?: string;
     } & import("../../../..").StyledProps, "ref"> & {
         ref?: import("react").Ref<HTMLParagraphElement>;
@@ -26,7 +25,7 @@ declare const AppSwitcher: {
         inline?: boolean;
         compact?: boolean;
         disabled?: boolean;
-        textTransform?: "-moz-initial" | "inherit" | "initial" | "revert" | "unset" | "none" | "full-width" | "capitalize" | "full-size-kana" | "lowercase" | "uppercase";
+        textTransform?: "none" | "inherit" | "initial" | "-moz-initial" | "revert" | "unset" | "capitalize" | "full-size-kana" | "full-width" | "lowercase" | "uppercase" | undefined;
         fontSize?: string;
     } & import("../../../..").StyledProps, "ref"> & {
         ref?: import("react").Ref<HTMLParagraphElement>;
@@ -38,7 +37,7 @@ declare const AppSwitcher: {
         inline?: boolean;
         compact?: boolean;
         disabled?: boolean;
-        textTransform?: "-moz-initial" | "inherit" | "initial" | "revert" | "unset" | "none" | "full-width" | "capitalize" | "full-size-kana" | "lowercase" | "uppercase";
+        textTransform?: "none" | "inherit" | "initial" | "-moz-initial" | "revert" | "unset" | "capitalize" | "full-size-kana" | "full-width" | "lowercase" | "uppercase" | undefined;
         fontSize?: string;
     } & import("../../../..").StyledProps, "ref"> & {
         ref?: import("react").Ref<HTMLParagraphElement>;
@@ -47,7 +46,7 @@ declare const AppSwitcher: {
         inline?: boolean;
         compact?: boolean;
         disabled?: boolean;
-        textTransform?: "-moz-initial" | "inherit" | "initial" | "revert" | "unset" | "none" | "full-width" | "capitalize" | "full-size-kana" | "lowercase" | "uppercase";
+        textTransform?: "none" | "inherit" | "initial" | "-moz-initial" | "revert" | "unset" | "capitalize" | "full-size-kana" | "full-width" | "lowercase" | "uppercase" | undefined;
         fontSize?: string;
     } & import("../../../..").StyledProps, "ref"> & {
         ref?: import("react").Ref<HTMLParagraphElement>;

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

@@ -19,7 +19,7 @@ export default function DesktopNav({ primaryNavigation = [], secondaryNavigation
     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(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 }),
@@ -37,7 +37,7 @@ export default function DesktopNav({ primaryNavigation = [], secondaryNavigation
                         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.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" },

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

@@ -7,7 +7,6 @@ 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
@@ -30,12 +29,12 @@ export function MenuSubItem({ item, level }) {
     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))),
+            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, 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),
+    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, (_b = item.items) === null || _b === void 0 ? void 0 : _b.map((subItem) => React.createElement(MenuSubItem, { key: subItem.key, item: subItem, level: level + 1 }))))))))));
+                React.createElement(SubMenuList, null, item.items?.map((subItem) => React.createElement(MenuSubItem, { key: subItem.key, item: subItem, level: level + 1 }))))))))));
 }

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

@@ -1,4 +1,3 @@
-/// <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>>;

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

@@ -16,20 +16,62 @@ const getSharedInteractiveItemStyles = (theme) => ({
     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": {
+export const SubMenuItemLink = styled(RadixNavigationMenu.Link)(({ theme }) => ({
+    ...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": {
+    },
+    "&: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": {
+    },
+}), addStyledProps);
+export const SubMenuItemButton = styled(RadixNavigationMenu.Trigger)(({ theme }) => ({
+    ...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": {
+    },
+}), addStyledProps);
+export const SubMenuContent = styled(RadixNavigationMenu.Content).attrs(disableHoverEvents)(({ theme }) => ({
+    ...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);
+    },
+}), addStyledProps);
 export const SubMenuItem = styled(RadixNavigationMenu.Item)({
     position: "relative",
     width: "100%",

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

@@ -18,7 +18,7 @@ export default function MobileNav({ primaryNavigation = [], secondaryNavigation
     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(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 },
@@ -36,7 +36,7 @@ export default function MobileNav({ primaryNavigation = [], secondaryNavigation
                                 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" } })))),
+                                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 }))))))))),

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

@@ -1,14 +1,3 @@
-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";
@@ -17,8 +6,7 @@ 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"]);
+export const MobileMenuItem = React.forwardRef(({ menuItem, level = 0, ...props }, forwardedRef) => {
     if (menuItem.mobileVisibility !== undefined && menuItem.mobileVisibility !== "navigationMenu") {
         return null;
     }
@@ -26,7 +14,7 @@ export const MobileMenuItem = React.forwardRef((_a, forwardedRef) => {
      * Separator
      * -----------------------------------------------------------------*/
     if (menuItem.type === "separator") {
-        return (React.createElement(RadixNavigationMenuItem, Object.assign({ ref: forwardedRef }, props),
+        return (React.createElement(RadixNavigationMenuItem, { ref: forwardedRef, ...props },
             React.createElement(IndentedContainer, { level: level },
                 React.createElement(Divider, { secondary: level > 0, my: "x2" }))));
     }
@@ -34,7 +22,7 @@ export const MobileMenuItem = React.forwardRef((_a, forwardedRef) => {
      * Custom render fragment
      * -----------------------------------------------------------------*/
     if (menuItem.type === "custom") {
-        return (React.createElement(RadixNavigationMenuItem, Object.assign({ ref: forwardedRef }, props),
+        return (React.createElement(RadixNavigationMenuItem, { ref: forwardedRef, ...props },
             React.createElement(IndentedContainer, { level: level }, menuItem.render({ withinSubMenu: level > 0, level, withinMobileNav: true }))));
     }
     /* -------------------------------------------------------------------
@@ -51,11 +39,14 @@ export const MobileMenuItem = React.forwardRef((_a, forwardedRef) => {
      * Link
      * -----------------------------------------------------------------*/
     if (menuItem.type === "link") {
-        return (React.createElement(RadixNavigationMenuItem, Object.assign({ ref: forwardedRef }, props),
+        return (React.createElement(RadixNavigationMenuItem, { 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,
+                React.createElement(MobileNavigationLink, { asChild: true }, menuItem.element ? (React.cloneElement(menuItem.element, {
+                    ...menuItem.props,
+                    children: (React.createElement(React.Fragment, null,
                         IconFragment,
-                        LabelFragment)) }))) : (React.createElement("a", Object.assign({}, menuItem.props),
+                        LabelFragment)),
+                })) : (React.createElement("a", { ...menuItem.props },
                     IconFragment,
                     LabelFragment))))));
     }
@@ -66,16 +57,16 @@ export const MobileMenuItem = React.forwardRef((_a, forwardedRef) => {
         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),
+            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 })))))));
         }
         // Simple button with no children
-        return (React.createElement(RadixNavigationMenuItem, Object.assign({ ref: forwardedRef }, props),
+        return (React.createElement(RadixNavigationMenuItem, { ref: forwardedRef, ...props },
             React.createElement(IndentedContainer, { level: level },
-                React.createElement(MobileNavigationButton, Object.assign({}, ("props" in menuItem ? menuItem.props : {})),
+                React.createElement(MobileNavigationButton, { ...("props" in menuItem ? menuItem.props : {}) },
                     IconFragment,
                     LabelFragment))));
     }

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

@@ -1,4 +1,3 @@
-/// <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;
@@ -8,7 +7,7 @@ export declare const MenuItemGroupLabel: import("styled-components/dist/types").
     inline?: boolean;
     compact?: boolean;
     disabled?: boolean;
-    textTransform?: "-moz-initial" | "inherit" | "initial" | "revert" | "unset" | "none" | "full-width" | "capitalize" | "full-size-kana" | "lowercase" | "uppercase";
+    textTransform?: "none" | "inherit" | "initial" | "-moz-initial" | "revert" | "unset" | "capitalize" | "full-size-kana" | "full-width" | "lowercase" | "uppercase" | undefined;
     fontSize?: string;
 } & import("../../../..").StyledProps, "ref"> & {
     ref?: import("react").Ref<HTMLParagraphElement>;

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

@@ -11,10 +11,41 @@ const commonPadding = (theme) => ({
     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" })));
+const commonStyles = (theme) => ({
+    ...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 }) => ({
+    ...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 }) => ({
+    ...commonStyles(theme),
+}));
+export const MobileNavigationLink = styled(RadixNavigationMenu.Link)(({ theme }) => ({
+    ...commonStyles(theme),
+    textDecoration: "none",
+}));
 export const MobileSecondaryLogoContainer = styled(RadixNavigationMenu.Sub)(({ theme }) => ({
     marginTop: theme.space.x2,
     padding: theme.space.x2,

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

@@ -1,6 +1,6 @@
 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),
+    return (React.createElement("svg", { 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" }),

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import * as RadixNavigationMenu from "@radix-ui/react-navigation-menu";
 import { StyledProps } from "../../../StyledProps";
 declare const UserMenu: {

package/dist/src/Navigation/components/UserMenu/parts/Header.js

@@ -31,7 +31,7 @@ const HeaderWrapper = styled(Flex).attrs({
     },
 }));
 export const Header = ({ title, subtitle1, subtitle2, containerProps }) => {
-    return (React.createElement(HeaderWrapper, Object.assign({}, containerProps),
+    return (React.createElement(HeaderWrapper, { ...containerProps },
         React.createElement(HeaderText, { fontWeight: "bold" }, title),
         React.createElement(HeaderText, { fontWeight: "normal" }, subtitle1),
         React.createElement(HeaderText, { fontWeight: "normal" }, subtitle2),

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

@@ -1,22 +1,13 @@
-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 { RadixNavigationMenuItem } from "../../shared/components";
 import { UserMenuLink, UserMenuTrigger } from "./styled";
-const Item = React.forwardRef((_a, forwardedRef) => {
-    var { item, level = 0 } = _a, props = __rest(_a, ["item", "level"]);
-    return (React.createElement(RadixNavigationMenuItem, Object.assign({ ref: forwardedRef }, props),
-        item.type === "link" && (React.createElement(UserMenuLink, { asChild: true }, item.element ? (React.cloneElement(item.element, Object.assign(Object.assign({}, item.props), { children: item.label }))) : (React.createElement("a", Object.assign({}, item.props), item.label)))),
-        item.type === "button" && React.createElement(UserMenuTrigger, Object.assign({}, item.props), item.label),
+const Item = React.forwardRef(({ item, level = 0, ...props }, forwardedRef) => {
+    return (React.createElement(RadixNavigationMenuItem, { ref: forwardedRef, ...props },
+        item.type === "link" && (React.createElement(UserMenuLink, { asChild: true }, item.element ? (React.cloneElement(item.element, {
+            ...item.props,
+            children: item.label,
+        })) : (React.createElement("a", { ...item.props }, item.label)))),
+        item.type === "button" && React.createElement(UserMenuTrigger, { ...item.props }, item.label),
         item.type === "custom" && item.render({ level, withinMobileNav: false })));
 });
 Item.displayName = "Item";

package/dist/src/Navigation/components/UserMenu/parts/MobileItem.js

@@ -1,27 +1,18 @@
-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 { RadixNavigationMenuItem } from "../../shared/components";
 import { IndentedContainer } from "../../MobileNav/parts/styled";
 import { UserMenuLink, UserMenuTrigger } from "./styled";
-const MobileItem = React.forwardRef((_a, forwardedRef) => {
-    var { item, level = 0 } = _a, props = __rest(_a, ["item", "level"]);
+const MobileItem = React.forwardRef(({ item, level = 0, ...props }, forwardedRef) => {
     const content = (React.createElement(React.Fragment, null,
         item.type === "link" && (React.createElement(IndentedContainer, { level: level },
-            React.createElement(UserMenuLink, { asChild: true, "$isMobile": true }, item.element ? (React.cloneElement(item.element, Object.assign(Object.assign({}, item.props), { children: item.label }))) : (React.createElement("a", Object.assign({}, item.props), item.label))))),
+            React.createElement(UserMenuLink, { asChild: true, "$isMobile": true }, item.element ? (React.cloneElement(item.element, {
+                ...item.props,
+                children: item.label,
+            })) : (React.createElement("a", { ...item.props }, item.label))))),
         item.type === "button" && (React.createElement(IndentedContainer, { level: level },
-            React.createElement(UserMenuTrigger, Object.assign({}, item.props, { "$isMobile": true }), item.label))),
+            React.createElement(UserMenuTrigger, { ...item.props, "$isMobile": true }, item.label))),
         item.type === "custom" && item.render({ level, withinMobileNav: true })));
-    return (React.createElement(RadixNavigationMenuItem, Object.assign({ ref: forwardedRef }, props), content));
+    return (React.createElement(RadixNavigationMenuItem, { ref: forwardedRef, ...props }, content));
 });
 MobileItem.displayName = "MobileItem";
 export default MobileItem;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import * as RadixNavigationMenu from "@radix-ui/react-navigation-menu";
 export declare const UserMenuLink: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<RadixNavigationMenu.NavigationMenuLinkProps & import("react").RefAttributes<HTMLAnchorElement>, {
     $isMobile?: boolean;

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

@@ -1,21 +1,46 @@
 import styled from "styled-components";
 import * as RadixNavigationMenu from "@radix-ui/react-navigation-menu";
 import { addStyledProps } from "../../../../StyledProps";
-const baseUserMenuItemStyles = (theme, isMobile) => (Object.assign(Object.assign({ width: "100%", color: theme.colors.darkGrey, fontSize: theme.fontSizes.small, fontWeight: theme.fontWeights.bold, lineHeight: theme.lineHeights.smallTextBase, paddingTop: theme.space.x1_5, paddingBottom: theme.space.x1_5, paddingLeft: theme.space.x2, paddingRight: theme.space.x2 }, (!isMobile && {
-    "&:hover, &:focus": {
-        backgroundColor: theme.colors.lightBlue,
-        color: theme.colors.darkBlue,
-        outline: "none",
-    },
-})), (isMobile && {
-    "&:hover": {
-    // No background or color change on hover for mobile
-    },
-    "&:focus": {
-        backgroundColor: "transparent",
-        color: theme.colors.darkBlue,
-        outline: "none",
-    },
-})));
-export const UserMenuLink = styled(RadixNavigationMenu.Link)(({ theme, $isMobile }) => (Object.assign(Object.assign({}, baseUserMenuItemStyles(theme, $isMobile)), { display: "block", textDecoration: "none" })), addStyledProps);
-export const UserMenuTrigger = styled(RadixNavigationMenu.Trigger)(({ theme, $isMobile }) => (Object.assign(Object.assign({}, baseUserMenuItemStyles(theme, $isMobile)), { background: "none", border: "none", userSelect: "none", display: "flex", justifyContent: "space-between", alignItems: "center", textAlign: "left" })), addStyledProps);
+const baseUserMenuItemStyles = (theme, isMobile) => ({
+    width: "100%",
+    color: theme.colors.darkGrey,
+    fontSize: theme.fontSizes.small,
+    fontWeight: theme.fontWeights.bold,
+    lineHeight: theme.lineHeights.smallTextBase,
+    paddingTop: theme.space.x1_5,
+    paddingBottom: theme.space.x1_5,
+    paddingLeft: theme.space.x2,
+    paddingRight: theme.space.x2,
+    ...(!isMobile && {
+        "&:hover, &:focus": {
+            backgroundColor: theme.colors.lightBlue,
+            color: theme.colors.darkBlue,
+            outline: "none",
+        },
+    }),
+    ...(isMobile && {
+        "&:hover": {
+        // No background or color change on hover for mobile
+        },
+        "&:focus": {
+            backgroundColor: "transparent", // Ensure no background change
+            color: theme.colors.darkBlue,
+            outline: "none",
+        },
+    }),
+});
+export const UserMenuLink = styled(RadixNavigationMenu.Link)(({ theme, $isMobile }) => ({
+    ...baseUserMenuItemStyles(theme, $isMobile),
+    display: "block",
+    textDecoration: "none",
+}), addStyledProps);
+export const UserMenuTrigger = styled(RadixNavigationMenu.Trigger)(({ theme, $isMobile }) => ({
+    ...baseUserMenuItemStyles(theme, $isMobile),
+    background: "none",
+    border: "none",
+    userSelect: "none",
+    display: "flex",
+    justifyContent: "space-between",
+    alignItems: "center",
+    textAlign: "left",
+}), addStyledProps);

package/dist/src/Navigation/components/shared/NavigationLogo.js

@@ -1,27 +1,15 @@
-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 styled from "styled-components";
 const LogoContainer = styled.div(({ $maxWidth, $maxHeight }) => ({
     display: "flex",
     alignItems: "center",
-    maxWidth: $maxWidth !== null && $maxWidth !== void 0 ? $maxWidth : "184px",
-    maxHeight: $maxHeight !== null && $maxHeight !== void 0 ? $maxHeight : "36px",
+    maxWidth: $maxWidth ?? "184px",
+    maxHeight: $maxHeight ?? "36px",
     "& > *": {
         width: "100%",
         objectFit: "contain",
     },
 }));
-export const NavigationLogo = (_a) => {
-    var { children, maxWidth, maxHeight } = _a, props = __rest(_a, ["children", "maxWidth", "maxHeight"]);
-    return (React.createElement(LogoContainer, Object.assign({ "$maxWidth": maxWidth, "$maxHeight": maxHeight }, props), children));
+export const NavigationLogo = ({ children, maxWidth, maxHeight, ...props }) => {
+    return (React.createElement(LogoContainer, { "$maxWidth": maxWidth, "$maxHeight": maxHeight, ...props }, children));
 };

package/dist/src/Navigation/components/shared/NavigationLogoLink.js

@@ -1,14 +1,3 @@
-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 styled from "styled-components";
 import { NavigationMenuLink as BaseNavigationMenuLink } from "./components";
@@ -17,7 +6,6 @@ const NavigationMenuLink = styled(BaseNavigationMenuLink)(({ theme }) => ({
     alignItems: "center",
     padding: theme.space.x1,
 }));
-export const NavigationLogoLink = (_a) => {
-    var { href, renderAsFragment = false } = _a, props = __rest(_a, ["href", "renderAsFragment"]);
-    return React.createElement(NavigationMenuLink, Object.assign({ href: href, asChild: renderAsFragment }, props));
+export const NavigationLogoLink = ({ href, renderAsFragment = false, ...props }) => {
+    return React.createElement(NavigationMenuLink, { href: href, asChild: renderAsFragment, ...props });
 };

package/dist/src/Navigation/components/shared/NavigationMenuContent.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import * as RadixNavigationMenu from "@radix-ui/react-navigation-menu";
 import { StyledProps } from "../../../StyledProps";
 export interface NavigationMenuContentProps extends RadixNavigationMenu.NavigationMenuContentProps, StyledProps {