@nulogy/components 16.0.0 → 16.0.2

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

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

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

@@ -1,11 +1,4 @@
-import React from "react";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 export function SvgNulogyLogo(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" }),
-        React.createElement("path", { d: "M62.349 18.7354H60.2773V0.830151L62.349 0V18.7354Z", fill: "#1C68A5" }),
-        React.createElement("path", { d: "M64.0928 13.0257C64.0928 11.2362 64.6615 9.76236 65.7989 8.60419C66.9364 7.44603 68.3787 6.86694 70.1258 6.86694C71.8729 6.86694 73.3152 7.44603 74.4526 8.60419C75.5901 9.76236 76.1588 11.2362 76.1588 13.0257C76.1588 14.8232 75.5901 16.3029 74.4526 17.4651C73.3152 18.6272 71.8729 19.2063 70.1258 19.2023C68.3856 19.2023 66.9453 18.6232 65.8049 17.4651C64.6645 16.3069 64.0938 14.8271 64.0928 13.0257ZM66.1497 13.0257C66.1497 14.4315 66.5132 15.5626 67.2402 16.4189C67.9673 17.2752 68.9208 17.7038 70.1006 17.7048C71.2845 17.7048 72.2419 17.2761 72.9729 16.4189C73.7039 15.5616 74.0719 14.4305 74.0768 13.0257C74.0768 11.6298 73.7088 10.5032 72.9729 9.64595C72.2369 8.78867 71.2795 8.36053 70.1006 8.36151C68.9168 8.36151 67.9634 8.79015 67.2402 9.64743C66.5171 10.5047 66.1536 11.6308 66.1497 13.0257Z", fill: "#1C68A5" }),
-        React.createElement("path", { d: "M86.2825 17.9933C85.7073 18.3338 85.0919 18.6013 84.4505 18.7895C83.8592 18.9596 83.2471 19.0463 82.6319 19.0469C80.9686 19.0469 79.6245 18.495 78.5995 17.3911C77.5745 16.2872 77.0625 14.8365 77.0635 13.0391C77.0635 11.2071 77.611 9.72043 78.706 8.57904C79.8011 7.43764 81.2315 6.86694 82.9974 6.86694C83.5542 6.87509 84.1095 6.92854 84.6577 7.02676C85.289 7.13133 86.0191 7.29213 86.8477 7.50916L88.3142 6.91726V17.1129C88.3142 18.4753 88.2496 19.4721 88.1203 20.1035C88.0069 20.6938 87.7835 21.2575 87.4618 21.7653C86.9756 22.5003 86.284 23.0761 85.473 23.4211C84.5283 23.8233 83.5089 24.0201 82.4824 23.9982C81.7434 23.9982 81.0074 23.9037 80.2923 23.7171C79.5452 23.5188 78.8236 23.2342 78.1422 22.8692L77.8034 20.4113L79.3201 21.4027C79.7777 21.6876 80.277 21.8993 80.7999 22.0302C81.3712 22.1909 81.9614 22.275 82.5549 22.2802C83.7387 22.2802 84.6567 21.9843 85.3088 21.3924C85.9608 20.8005 86.2854 19.958 86.2825 18.8649V17.9933ZM86.2825 16.4499V9.21238C85.7948 8.96846 85.2843 8.77317 84.7583 8.62935C84.298 8.50417 83.8235 8.43901 83.3466 8.4355C82.0848 8.4355 81.0692 8.8597 80.2997 9.7081C79.5303 10.5565 79.145 11.6851 79.144 13.0938C79.144 14.4473 79.4893 15.5216 80.1799 16.3168C80.8704 17.1119 81.8007 17.509 82.9707 17.508C83.461 17.5022 83.9474 17.4218 84.4135 17.2697C85.0592 17.0516 85.6846 16.7773 86.2825 16.4499Z", fill: "#1C68A5" }),
-        React.createElement("path", { d: "M90.0352 6.86694H92.1927L95.5784 15.7456L99.3044 6.86694H101.061L95.6672 19.3222L95.5784 19.4983C94.726 21.4378 94.0695 22.8189 93.6088 23.6416H91.364C91.8422 23.1454 92.2709 22.6037 92.644 22.0242C93.1111 21.2739 93.526 20.4922 93.8855 19.6847L94.6136 18.1176L90.0352 6.86694Z", fill: "#1C68A5" })));
+    return (_jsxs("svg", { viewBox: "0 0 102 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: [_jsx("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" }), _jsx("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" }), _jsx("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" }), _jsx("path", { d: "M62.349 18.7354H60.2773V0.830151L62.349 0V18.7354Z", fill: "#1C68A5" }), _jsx("path", { d: "M64.0928 13.0257C64.0928 11.2362 64.6615 9.76236 65.7989 8.60419C66.9364 7.44603 68.3787 6.86694 70.1258 6.86694C71.8729 6.86694 73.3152 7.44603 74.4526 8.60419C75.5901 9.76236 76.1588 11.2362 76.1588 13.0257C76.1588 14.8232 75.5901 16.3029 74.4526 17.4651C73.3152 18.6272 71.8729 19.2063 70.1258 19.2023C68.3856 19.2023 66.9453 18.6232 65.8049 17.4651C64.6645 16.3069 64.0938 14.8271 64.0928 13.0257ZM66.1497 13.0257C66.1497 14.4315 66.5132 15.5626 67.2402 16.4189C67.9673 17.2752 68.9208 17.7038 70.1006 17.7048C71.2845 17.7048 72.2419 17.2761 72.9729 16.4189C73.7039 15.5616 74.0719 14.4305 74.0768 13.0257C74.0768 11.6298 73.7088 10.5032 72.9729 9.64595C72.2369 8.78867 71.2795 8.36053 70.1006 8.36151C68.9168 8.36151 67.9634 8.79015 67.2402 9.64743C66.5171 10.5047 66.1536 11.6308 66.1497 13.0257Z", fill: "#1C68A5" }), _jsx("path", { d: "M86.2825 17.9933C85.7073 18.3338 85.0919 18.6013 84.4505 18.7895C83.8592 18.9596 83.2471 19.0463 82.6319 19.0469C80.9686 19.0469 79.6245 18.495 78.5995 17.3911C77.5745 16.2872 77.0625 14.8365 77.0635 13.0391C77.0635 11.2071 77.611 9.72043 78.706 8.57904C79.8011 7.43764 81.2315 6.86694 82.9974 6.86694C83.5542 6.87509 84.1095 6.92854 84.6577 7.02676C85.289 7.13133 86.0191 7.29213 86.8477 7.50916L88.3142 6.91726V17.1129C88.3142 18.4753 88.2496 19.4721 88.1203 20.1035C88.0069 20.6938 87.7835 21.2575 87.4618 21.7653C86.9756 22.5003 86.284 23.0761 85.473 23.4211C84.5283 23.8233 83.5089 24.0201 82.4824 23.9982C81.7434 23.9982 81.0074 23.9037 80.2923 23.7171C79.5452 23.5188 78.8236 23.2342 78.1422 22.8692L77.8034 20.4113L79.3201 21.4027C79.7777 21.6876 80.277 21.8993 80.7999 22.0302C81.3712 22.1909 81.9614 22.275 82.5549 22.2802C83.7387 22.2802 84.6567 21.9843 85.3088 21.3924C85.9608 20.8005 86.2854 19.958 86.2825 18.8649V17.9933ZM86.2825 16.4499V9.21238C85.7948 8.96846 85.2843 8.77317 84.7583 8.62935C84.298 8.50417 83.8235 8.43901 83.3466 8.4355C82.0848 8.4355 81.0692 8.8597 80.2997 9.7081C79.5303 10.5565 79.145 11.6851 79.144 13.0938C79.144 14.4473 79.4893 15.5216 80.1799 16.3168C80.8704 17.1119 81.8007 17.509 82.9707 17.508C83.461 17.5022 83.9474 17.4218 84.4135 17.2697C85.0592 17.0516 85.6846 16.7773 86.2825 16.4499Z", fill: "#1C68A5" }), _jsx("path", { d: "M90.0352 6.86694H92.1927L95.5784 15.7456L99.3044 6.86694H101.061L95.6672 19.3222L95.5784 19.4983C94.726 21.4378 94.0695 22.8189 93.6088 23.6416H91.364C91.8422 23.1454 92.2709 22.6037 92.644 22.0242C93.1111 21.2739 93.526 20.4922 93.8855 19.6847L94.6136 18.1176L90.0352 6.86694Z", fill: "#1C68A5" })] }));
 }

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

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

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

@@ -1,7 +1,6 @@
-import React from "react";
 import { UserMenuInfo } from "../../../types";
 import { FlexProps } from "../../../../Flex/Flex";
 export interface HeaderProps extends UserMenuInfo {
     containerProps?: FlexProps;
 }
-export declare const Header: ({ title, subtitle1, subtitle2, containerProps }: HeaderProps) => React.JSX.Element;
+export declare const Header: ({ title, subtitle1, subtitle2, containerProps }: HeaderProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -1,4 +1,4 @@
-import React from "react";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { styled } from "styled-components";
 import { Text } from "../../../../Type";
 import { Flex } from "../../../../Flex";
@@ -31,9 +31,5 @@ const HeaderWrapper = styled(Flex).attrs({
     },
 }));
 export const Header = ({ title, subtitle1, subtitle2, containerProps }) => {
-    return (React.createElement(HeaderWrapper, { ...containerProps },
-        React.createElement(HeaderText, { fontWeight: "bold" }, title),
-        React.createElement(HeaderText, { fontWeight: "normal" }, subtitle1),
-        React.createElement(HeaderText, { fontWeight: "normal" }, subtitle2),
-        React.createElement(BackgroundTriangles, null)));
+    return (_jsxs(HeaderWrapper, { ...containerProps, children: [_jsx(HeaderText, { fontWeight: "bold", children: title }), _jsx(HeaderText, { fontWeight: "normal", children: subtitle1 }), _jsx(HeaderText, { fontWeight: "normal", children: subtitle2 }), _jsx(BackgroundTriangles, {})] }));
 };

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

@@ -1,14 +1,12 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from "react";
 import { RadixNavigationMenuItem } from "../../shared/components";
 import { UserMenuLink, UserMenuTrigger } from "./styled";
 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 })));
+    return (_jsxs(RadixNavigationMenuItem, { ref: forwardedRef, ...props, children: [item.type === "link" && (_jsx(UserMenuLink, { asChild: true, children: item.element ? (React.cloneElement(item.element, {
+                    ...item.props,
+                    children: item.label,
+                })) : (_jsx("a", { ...item.props, children: item.label })) })), item.type === "button" && _jsx(UserMenuTrigger, { ...item.props, children: item.label }), item.type === "custom" && item.render({ level, withinMobileNav: false })] }));
 });
 Item.displayName = "Item";
 export default Item;

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

@@ -1,18 +1,14 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import React from "react";
 import { RadixNavigationMenuItem } from "../../shared/components";
 import { IndentedContainer } from "../../MobileNav/parts/styled";
 import { UserMenuLink, UserMenuTrigger } from "./styled";
 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, {
-                ...item.props,
-                children: item.label,
-            })) : (React.createElement("a", { ...item.props }, item.label))))),
-        item.type === "button" && (React.createElement(IndentedContainer, { level: level },
-            React.createElement(UserMenuTrigger, { ...item.props, "$isMobile": true }, item.label))),
-        item.type === "custom" && item.render({ level, withinMobileNav: true })));
-    return (React.createElement(RadixNavigationMenuItem, { ref: forwardedRef, ...props }, content));
+    const content = (_jsxs(_Fragment, { children: [item.type === "link" && (_jsx(IndentedContainer, { level: level, children: _jsx(UserMenuLink, { asChild: true, "$isMobile": true, children: item.element ? (React.cloneElement(item.element, {
+                        ...item.props,
+                        children: item.label,
+                    })) : (_jsx("a", { ...item.props, children: item.label })) }) })), item.type === "button" && (_jsx(IndentedContainer, { level: level, children: _jsx(UserMenuTrigger, { ...item.props, "$isMobile": true, children: item.label }) })), item.type === "custom" && item.render({ level, withinMobileNav: true })] }));
+    return (_jsx(RadixNavigationMenuItem, { ref: forwardedRef, ...props, children: content }));
 });
 MobileItem.displayName = "MobileItem";
 export default MobileItem;

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

@@ -1,7 +1,11 @@
 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>, {
+export declare const UserMenuLink: 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>;
+}, {
     $isMobile?: boolean;
 }>> & string & Omit<import("react").ForwardRefExoticComponent<RadixNavigationMenu.NavigationMenuLinkProps & import("react").RefAttributes<HTMLAnchorElement>>, keyof import("react").Component<any, {}, any>>;
-export declare const UserMenuTrigger: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<RadixNavigationMenu.NavigationMenuTriggerProps & import("react").RefAttributes<HTMLButtonElement>, {
+export declare const UserMenuTrigger: 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>;
+}, {
     $isMobile?: boolean;
 }>> & string & Omit<import("react").ForwardRefExoticComponent<RadixNavigationMenu.NavigationMenuTriggerProps & import("react").RefAttributes<HTMLButtonElement>>, keyof import("react").Component<any, {}, any>>;

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

@@ -4,5 +4,5 @@ interface NavigationLogoProps {
     maxHeight?: string;
     children: React.ReactNode;
 }
-export declare const NavigationLogo: ({ children, maxWidth, maxHeight, ...props }: NavigationLogoProps) => React.JSX.Element;
+export declare const NavigationLogo: ({ children, maxWidth, maxHeight, ...props }: NavigationLogoProps) => import("react/jsx-runtime").JSX.Element;
 export {};

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

@@ -1,4 +1,4 @@
-import React from "react";
+import { jsx as _jsx } from "react/jsx-runtime";
 import { styled } from "styled-components";
 const LogoContainer = styled.div(({ $maxWidth, $maxHeight }) => ({
     display: "flex",
@@ -11,5 +11,5 @@ const LogoContainer = styled.div(({ $maxWidth, $maxHeight }) => ({
     },
 }));
 export const NavigationLogo = ({ children, maxWidth, maxHeight, ...props }) => {
-    return (React.createElement(LogoContainer, { "$maxWidth": maxWidth, "$maxHeight": maxHeight, ...props }, children));
+    return (_jsx(LogoContainer, { "$maxWidth": maxWidth, "$maxHeight": maxHeight, ...props, children: children }));
 };

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

@@ -1,7 +1,6 @@
-import React from "react";
 import type { NavigationMenuLinkProps } from "@radix-ui/react-navigation-menu";
 interface NavigationLogoLinkProps extends Omit<NavigationMenuLinkProps, "asChild"> {
     renderAsFragment?: boolean;
 }
-export declare const NavigationLogoLink: ({ href, renderAsFragment, ...props }: NavigationLogoLinkProps) => React.JSX.Element;
+export declare const NavigationLogoLink: ({ href, renderAsFragment, ...props }: NavigationLogoLinkProps) => import("react/jsx-runtime").JSX.Element;
 export {};

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

@@ -1,4 +1,4 @@
-import React from "react";
+import { jsx as _jsx } from "react/jsx-runtime";
 import { styled } from "styled-components";
 import { NavigationMenuLink as BaseNavigationMenuLink } from "./components";
 const NavigationMenuLink = styled(BaseNavigationMenuLink)(({ theme }) => ({
@@ -7,5 +7,5 @@ const NavigationMenuLink = styled(BaseNavigationMenuLink)(({ theme }) => ({
     padding: theme.space.x1,
 }));
 export const NavigationLogoLink = ({ href, renderAsFragment = false, ...props }) => {
-    return React.createElement(NavigationMenuLink, { href: href, asChild: renderAsFragment, ...props });
+    return _jsx(NavigationMenuLink, { href: href, asChild: renderAsFragment, ...props });
 };

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

@@ -2,5 +2,9 @@ import * as RadixNavigationMenu from "@radix-ui/react-navigation-menu";
 import { StyledProps } from "../../../StyledProps";
 export interface NavigationMenuContentProps extends RadixNavigationMenu.NavigationMenuContentProps, StyledProps {
 }
-declare const NavigationMenuContent: 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>, NavigationMenuContentProps>> & string & Omit<import("react").ForwardRefExoticComponent<RadixNavigationMenu.NavigationMenuContentProps & import("react").RefAttributes<HTMLDivElement>>, keyof import("react").Component<any, {}, any>>;
+declare const NavigationMenuContent: 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>, NavigationMenuContentProps>> & string & Omit<import("react").ForwardRefExoticComponent<RadixNavigationMenu.NavigationMenuContentProps & import("react").RefAttributes<HTMLDivElement>>, keyof import("react").Component<any, {}, any>>;
 export default NavigationMenuContent;

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

@@ -9,4 +9,6 @@ export interface NavigationMenuItemProps extends RadixNavigationMenu.NavigationM
  * A single Radix <NavigationMenu.Item> that can represent any MenuItem variant.
  */
 export declare const NavigationMenuItem: React.ForwardRefExoticComponent<NavigationMenuItemProps & React.RefAttributes<HTMLLIElement>>;
-export declare const NavigationMenuSubList: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<RadixNavigationMenu.NavigationMenuListProps & React.RefAttributes<HTMLUListElement>, never>> & string & Omit<React.ForwardRefExoticComponent<RadixNavigationMenu.NavigationMenuListProps & React.RefAttributes<HTMLUListElement>>, keyof React.Component<any, {}, any>>;
+export declare const NavigationMenuSubList: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<RadixNavigationMenu.NavigationMenuListProps & React.RefAttributes<HTMLUListElement>, "ref"> & {
+    ref?: React.Ref<HTMLUListElement>;
+}, never>> & string & Omit<React.ForwardRefExoticComponent<RadixNavigationMenu.NavigationMenuListProps & React.RefAttributes<HTMLUListElement>>, keyof React.Component<any, {}, any>>;

package/dist/src/Navigation/components/shared/NavigationMenuItem.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 { styled } from "styled-components";
@@ -14,14 +15,13 @@ import { CaretDown, NavigationMenuLink, NavigationMenuTrigger, RadixNavigationMe
  */
 export const NavigationMenuItem = React.forwardRef(({ item, level = 0, ...props }, forwardedRef) => {
     if (item.type === "separator") {
-        return (React.createElement(RadixNavigationMenuItem, { ref: forwardedRef, ...props },
-            React.createElement(VerticalDivider, { mx: "x1" })));
+        return (_jsx(RadixNavigationMenuItem, { ref: forwardedRef, ...props, children: _jsx(VerticalDivider, { mx: "x1" }) }));
     }
     /* ---------------------------------------------------------------------
      * Handle "custom” items
      * -------------------------------------------------------------------*/
     if (item.type === "custom") {
-        return (React.createElement(RadixNavigationMenuItem, { ref: forwardedRef, ...props }, item.render({ withinSubMenu: level > 0, level, withinMobileNav: false })));
+        return (_jsx(RadixNavigationMenuItem, { ref: forwardedRef, ...props, children: item.render({ withinSubMenu: level > 0, level, withinMobileNav: false }) }));
     }
     const hasIcon = "icon" in item;
     const isLink = item.type === "link";
@@ -29,22 +29,13 @@ export const NavigationMenuItem = React.forwardRef(({ item, level = 0, ...props
     const hasLabel = "label" in item && item.label;
     const hasIconOnly = hasIcon && !hasLabel;
     const hasTooltip = hasIconOnly && Boolean(item.tooltip);
-    const Content = (React.createElement(React.Fragment, null,
-        hasIcon && React.createElement(Icon, { icon: item.icon, size: "x3", "aria-hidden": true }),
-        "label" in item && item.label && (React.createElement(Text, { fontSize: "small", lineHeight: "smallTextCompressed" }, item.label)),
-        hasSubMenu && React.createElement(CaretDown, { "aria-hidden": true, size: "x2" })));
+    const Content = (_jsxs(_Fragment, { children: [hasIcon && _jsx(Icon, { icon: item.icon, size: "x3", "aria-hidden": true }), "label" in item && item.label && (_jsx(Text, { fontSize: "small", lineHeight: "smallTextCompressed", children: item.label })), hasSubMenu && _jsx(CaretDown, { "aria-hidden": true, size: "x2" })] }));
     if (isLink) {
-        const Item = (React.createElement(RadixNavigationMenuItem, { ref: forwardedRef, ...props },
-            React.createElement(NavigationMenuLink, { asChild: true, "aria-label": hasIconOnly && item.tooltip ? item.tooltip : item.label, borderRadius: hasIconOnly ? "rounded" : undefined, p: hasIcon ? "x1" : undefined }, item.element ? (React.cloneElement(item.element, { ...item.props, children: Content })) : (React.createElement("a", { ...item.props }, Content)))));
-        return hasTooltip ? (React.createElement(MiniTooltip, { delayDuration: 0, sideOffset: 0, content: item.tooltip }, Item)) : (Item);
+        const Item = (_jsx(RadixNavigationMenuItem, { ref: forwardedRef, ...props, children: _jsx(NavigationMenuLink, { asChild: true, "aria-label": hasIconOnly && item.tooltip ? item.tooltip : item.label, borderRadius: hasIconOnly ? "rounded" : undefined, p: hasIcon ? "x1" : undefined, children: item.element ? (React.cloneElement(item.element, { ...item.props, children: Content })) : (_jsx("a", { ...item.props, children: Content })) }) }));
+        return hasTooltip ? (_jsx(MiniTooltip, { delayDuration: 0, sideOffset: 0, content: item.tooltip, children: Item })) : (Item);
     }
-    const Item = (React.createElement(RadixNavigationMenuItem, { ref: forwardedRef, ...props },
-        React.createElement(NavigationMenuTrigger, { asChild: true, position: "relative", "aria-label": hasIconOnly && item.tooltip ? item.tooltip : hasLabel ? item.label : undefined, borderRadius: hasIconOnly ? "rounded" : undefined, p: hasIcon ? "x1" : undefined },
-            React.createElement(Button, { ...item.props }, Content)),
-        hasSubMenu && (React.createElement(SubMenuContent, null,
-            React.createElement(RadixNavigationMenu.Sub, { orientation: "vertical" },
-                React.createElement(NavigationMenuSubList, null, item.items?.map((sub) => React.createElement(MenuSubItem, { key: sub.key, item: sub, level: level + 1 }))))))));
-    return hasTooltip ? (React.createElement(MiniTooltip, { delayDuration: 0, sideOffset: 0, content: item.tooltip }, Item)) : (Item);
+    const Item = (_jsxs(RadixNavigationMenuItem, { ref: forwardedRef, ...props, children: [_jsx(NavigationMenuTrigger, { asChild: true, position: "relative", "aria-label": hasIconOnly && item.tooltip ? item.tooltip : hasLabel ? item.label : undefined, borderRadius: hasIconOnly ? "rounded" : undefined, p: hasIcon ? "x1" : undefined, children: _jsx(Button, { ...item.props, children: Content }) }), hasSubMenu && (_jsx(SubMenuContent, { children: _jsx(RadixNavigationMenu.Sub, { orientation: "vertical", children: _jsx(NavigationMenuSubList, { children: item.items?.map((sub) => (_jsx(MenuSubItem, { item: sub, level: level + 1 }, sub.key))) }) }) }))] }));
+    return hasTooltip ? (_jsx(MiniTooltip, { delayDuration: 0, sideOffset: 0, content: item.tooltip, children: Item })) : (Item);
 });
 NavigationMenuItem.displayName = "NavigationMenuItem";
 export const NavigationMenuSubList = styled(RadixNavigationMenu.List) `
@@ -61,6 +52,6 @@ const Button = React.forwardRef(({ onPointerEnter, onPointerLeave, onPointerMove
     void onPointerEnter;
     void onPointerLeave;
     void onPointerMove;
-    return React.createElement("button", { ...props, ref: forwardedRef });
+    return _jsx("button", { ...props, ref: forwardedRef });
 });
 Button.displayName = "Button";

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

@@ -1,16 +1,42 @@
 import * as RadixNavigationMenu from "@radix-ui/react-navigation-menu";
 import { IconProps } from "../../../Icon/Icon";
 import { StyledProps } from "../../../StyledProps";
-export declare const NavigationMenuRoot: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<RadixNavigationMenu.NavigationMenuProps & import("react").RefAttributes<HTMLElement>, StyledProps>> & string & Omit<import("react").ForwardRefExoticComponent<RadixNavigationMenu.NavigationMenuProps & import("react").RefAttributes<HTMLElement>>, keyof import("react").Component<any, {}, any>>;
-export declare const NavigationMenuList: 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>>;
+export declare const NavigationMenuRoot: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<Omit<RadixNavigationMenu.NavigationMenuProps & import("react").RefAttributes<HTMLElement>, "ref"> & {
+    ref?: import("react").Ref<HTMLElement>;
+}, StyledProps>> & string & Omit<import("react").ForwardRefExoticComponent<RadixNavigationMenu.NavigationMenuProps & import("react").RefAttributes<HTMLElement>>, keyof import("react").Component<any, {}, any>>;
+export declare const NavigationMenuList: 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>>;
 interface NavigationMenuTriggerProps extends RadixNavigationMenu.NavigationMenuTriggerProps, StyledProps {
     disableMenuToggleOnHover?: boolean;
 }
-export declare const NavigationMenuTrigger: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("styled-components/dist/types").Substitute<RadixNavigationMenu.NavigationMenuTriggerProps & import("react").RefAttributes<HTMLButtonElement>, RadixNavigationMenu.NavigationMenuTriggerProps & import("react").RefAttributes<HTMLButtonElement>>, NavigationMenuTriggerProps>, never>> & string & Omit<import("react").ForwardRefExoticComponent<RadixNavigationMenu.NavigationMenuTriggerProps & import("react").RefAttributes<HTMLButtonElement>>, keyof import("react").Component<any, {}, any>>;
-export declare const NavigationMenuLink: 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 NavigationMenuIconLink: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<RadixNavigationMenu.NavigationMenuLinkProps & import("react").RefAttributes<HTMLAnchorElement>, keyof StyledProps> & StyledProps, never>> & string;
-export declare const NavigationMenuIconTrigger: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("styled-components/dist/types").Substitute<RadixNavigationMenu.NavigationMenuTriggerProps & import("react").RefAttributes<HTMLButtonElement>, RadixNavigationMenu.NavigationMenuTriggerProps & import("react").RefAttributes<HTMLButtonElement>>, NavigationMenuTriggerProps>, never>, never>> & string;
-export declare const CaretDown: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<IconProps & import("react").RefAttributes<SVGSVGElement>, keyof IconProps> & IconProps, import("styled-components").FastOmit<IconProps & import("react").RefAttributes<SVGSVGElement>, keyof IconProps> & IconProps>, never>, Partial<IconProps>>> & string;
-export declare const CaretRight: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<IconProps & import("react").RefAttributes<SVGSVGElement>, keyof IconProps> & IconProps, import("styled-components").FastOmit<IconProps & import("react").RefAttributes<SVGSVGElement>, keyof IconProps> & IconProps>, never>, Partial<IconProps>>> & string;
-export declare const RadixNavigationMenuItem: 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 NavigationMenuTrigger: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("styled-components/dist/types").Substitute<Omit<RadixNavigationMenu.NavigationMenuTriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & {
+    ref?: import("react").Ref<HTMLButtonElement>;
+}, Omit<RadixNavigationMenu.NavigationMenuTriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & {
+    ref?: import("react").Ref<HTMLButtonElement>;
+}>, NavigationMenuTriggerProps>, never>> & string & Omit<import("react").ForwardRefExoticComponent<RadixNavigationMenu.NavigationMenuTriggerProps & import("react").RefAttributes<HTMLButtonElement>>, keyof import("react").Component<any, {}, any>>;
+export declare const NavigationMenuLink: 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 NavigationMenuIconLink: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<Omit<RadixNavigationMenu.NavigationMenuLinkProps & import("react").RefAttributes<HTMLAnchorElement>, "ref"> & {
+    ref?: import("react").Ref<HTMLAnchorElement>;
+}, keyof StyledProps> & StyledProps, never>> & string;
+export declare const NavigationMenuIconTrigger: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("styled-components/dist/types").Substitute<Omit<RadixNavigationMenu.NavigationMenuTriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & {
+    ref?: import("react").Ref<HTMLButtonElement>;
+}, Omit<RadixNavigationMenu.NavigationMenuTriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & {
+    ref?: import("react").Ref<HTMLButtonElement>;
+}>, NavigationMenuTriggerProps>, never>, never>> & string;
+export declare const CaretDown: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<Omit<IconProps & import("react").RefAttributes<SVGSVGElement>, "ref"> & {
+    ref?: import("react").Ref<SVGSVGElement>;
+}, keyof IconProps> & IconProps, import("styled-components").FastOmit<Omit<IconProps & import("react").RefAttributes<SVGSVGElement>, "ref"> & {
+    ref?: import("react").Ref<SVGSVGElement>;
+}, keyof IconProps> & IconProps>, never>, Partial<IconProps>>> & string;
+export declare const CaretRight: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<Omit<IconProps & import("react").RefAttributes<SVGSVGElement>, "ref"> & {
+    ref?: import("react").Ref<SVGSVGElement>;
+}, keyof IconProps> & IconProps, import("styled-components").FastOmit<Omit<IconProps & import("react").RefAttributes<SVGSVGElement>, "ref"> & {
+    ref?: import("react").Ref<SVGSVGElement>;
+}, keyof IconProps> & IconProps>, never>, Partial<IconProps>>> & string;
+export declare const RadixNavigationMenuItem: 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 {};

package/dist/src/Navigation/stories/Navigation.appSwitcher.story.d.ts

@@ -1,4 +1,3 @@
-import React from "react";
 declare const _default: {
     title: string;
     parameters: {
@@ -6,7 +5,7 @@ declare const _default: {
     };
 };
 export default _default;
-export declare const AllApps: () => React.JSX.Element;
-export declare const OnlySelectApps: () => React.JSX.Element;
-export declare const WithConditionallyVisibleApps: () => React.JSX.Element;
-export declare const WithAnIndicator: () => React.JSX.Element;
+export declare const AllApps: () => import("react/jsx-runtime").JSX.Element;
+export declare const OnlySelectApps: () => import("react/jsx-runtime").JSX.Element;
+export declare const WithConditionallyVisibleApps: () => import("react/jsx-runtime").JSX.Element;
+export declare const WithAnIndicator: () => import("react/jsx-runtime").JSX.Element;

package/dist/src/Navigation/stories/Navigation.appSwitcher.story.js

@@ -1,4 +1,5 @@
-import React, { useState } from "react";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from "react";
 import useConditionalAutoClick from "../../utils/testing/useConditionalAutoClick";
 import Navigation from "../Navigation";
 import { ApplicationFrame, Page } from "../../Layout";
@@ -25,7 +26,7 @@ export const AllApps = () => {
             when: "absent",
         },
     });
-    return (React.createElement(Navigation, { appSwitcher: {
+    return (_jsx(Navigation, { appSwitcher: {
             apps: {
                 "production-scheduling": {
                     url: "https://nulogy.com/",
@@ -59,7 +60,7 @@ export const OnlySelectApps = () => {
             when: "absent",
         },
     });
-    return (React.createElement(Navigation, { appSwitcher: {
+    return (_jsx(Navigation, { appSwitcher: {
             apps: {
                 "production-scheduling": {
                     url: "https://nulogy.com/",
@@ -82,7 +83,7 @@ export const WithConditionallyVisibleApps = () => {
             when: "absent",
         },
     });
-    return (React.createElement(ApplicationFrame, { navBar: React.createElement(Navigation, { appSwitcher: {
+    return (_jsx(ApplicationFrame, { navBar: _jsx(Navigation, { appSwitcher: {
                 apps: {
                     "production-scheduling": {
                         url: "https://nulogy.com/",
@@ -98,17 +99,7 @@ export const WithConditionallyVisibleApps = () => {
                         visible: isAdmin,
                     },
                 },
-            } }) },
-        React.createElement(Page, { fullHeight: true },
-            React.createElement(Flex, null,
-                React.createElement(Sidebar, { height: "100%", width: "350px", hideCloseButton: true, isOpen: true, title: "Story information", overlay: "hide", top: "64px", bottom: "0px" },
-                    React.createElement(Flex, { flexDirection: "column", gap: "x2" },
-                        React.createElement(Checkbox, { labelText: "User is admin", checked: isAdmin, onChange: () => setIsAdmin(!isAdmin) }),
-                        React.createElement(Text, { fontSize: "small", color: "darkGrey" },
-                            "In this example, the Smart Factory app is only visible to ",
-                            React.createElement("strong", null, "admins"),
-                            ". The app switcher is conditionally rendered based on the user's role."))),
-                React.createElement(Box, { flex: 1 })))));
+            } }), children: _jsx(Page, { fullHeight: true, children: _jsxs(Flex, { children: [_jsx(Sidebar, { height: "100%", width: "350px", hideCloseButton: true, isOpen: true, title: "Story information", overlay: "hide", top: "64px", bottom: "0px", children: _jsxs(Flex, { flexDirection: "column", gap: "x2", children: [_jsx(Checkbox, { labelText: "User is admin", checked: isAdmin, onChange: () => setIsAdmin(!isAdmin) }), _jsxs(Text, { fontSize: "small", color: "darkGrey", children: ["In this example, the Smart Factory app is only visible to ", _jsx("strong", { children: "admins" }), ". The app switcher is conditionally rendered based on the user's role."] })] }) }), _jsx(Box, { flex: 1 })] }) }) }));
 };
 export const WithAnIndicator = () => {
     useConditionalAutoClick({
@@ -118,30 +109,19 @@ export const WithAnIndicator = () => {
             when: "absent",
         },
     });
-    return (React.createElement(ApplicationFrame, { navBar: React.createElement(Navigation, { appSwitcher: {
+    return (_jsx(ApplicationFrame, { navBar: _jsx(Navigation, { appSwitcher: {
                 apps: {
                     "production-scheduling": {
                         url: "https://nulogy.com/",
                     },
                     "smart-factory": {
                         url: "https://nulogy.com/",
-                        indicator: React.createElement(StatusIndicator, { type: "informative" }, "new"),
+                        indicator: _jsx(StatusIndicator, { type: "informative", children: "new" }),
                     },
                     "shop-floor": {
                         url: "https://nulogy.com/",
-                        indicator: (React.createElement(InlineFlex, { alignItems: "center", gap: "x0_25", bg: "lightRed", pl: "x0_5", pr: "x1", borderRadius: "rounded" },
-                            React.createElement(Icon, { icon: "error", size: "x2", color: "red" }),
-                            React.createElement(Text, { fontSize: "smaller", letterSpacing: "0.05em", textTransform: "uppercase", fontWeight: "medium", color: "red" }, "Not available"))),
+                        indicator: (_jsxs(InlineFlex, { alignItems: "center", gap: "x0_25", bg: "lightRed", pl: "x0_5", pr: "x1", borderRadius: "rounded", children: [_jsx(Icon, { icon: "error", size: "x2", color: "red" }), _jsx(Text, { fontSize: "smaller", letterSpacing: "0.05em", textTransform: "uppercase", fontWeight: "medium", color: "red", children: "Not available" })] })),
                     },
                 },
-            } }) },
-        React.createElement(Page, { fullHeight: true },
-            React.createElement(Flex, null,
-                React.createElement(Sidebar, { height: "100%", width: "350px", hideCloseButton: true, isOpen: true, title: "Story information", overlay: "hide", top: "64px", bottom: "0px" },
-                    React.createElement(Flex, { flexDirection: "column", gap: "x2" },
-                        React.createElement(Text, { fontSize: "small", color: "darkGrey" },
-                            "In this example, the Smart Factory app is using a ",
-                            React.createElement(Code, null, "StatusIndicator"),
-                            ", The Shop Floor app is using a custom one."))),
-                React.createElement(Box, { flex: 1 })))));
+            } }), children: _jsx(Page, { fullHeight: true, children: _jsxs(Flex, { children: [_jsx(Sidebar, { height: "100%", width: "350px", hideCloseButton: true, isOpen: true, title: "Story information", overlay: "hide", top: "64px", bottom: "0px", children: _jsx(Flex, { flexDirection: "column", gap: "x2", children: _jsxs(Text, { fontSize: "small", color: "darkGrey", children: ["In this example, the Smart Factory app is using a ", _jsx(Code, { children: "StatusIndicator" }), ", The Shop Floor app is using a custom one."] }) }) }), _jsx(Box, { flex: 1 })] }) }) }));
 };

package/dist/src/Navigation/stories/Navigation.logos.story.d.ts

@@ -1,4 +1,3 @@
-import React from "react";
 declare const _default: {
     title: string;
     parameters: {
@@ -6,16 +5,16 @@ declare const _default: {
     };
 };
 export default _default;
-export declare const PrimaryLogo: () => React.JSX.Element;
-export declare const UsingClientRouting: () => React.JSX.Element;
-export declare const WithANulogyApplicationName: () => React.JSX.Element;
-export declare const SecondaryLogo: () => React.JSX.Element;
-export declare const SecondaryLogoLink: () => React.JSX.Element;
-export declare const WithoutPassingAPrimaryLogo: () => React.JSX.Element;
-export declare const WithoutAPrimaryLogo: () => React.JSX.Element;
-export declare const WithACustomPrimaryLogo: () => React.JSX.Element;
+export declare const PrimaryLogo: () => import("react/jsx-runtime").JSX.Element;
+export declare const UsingClientRouting: () => import("react/jsx-runtime").JSX.Element;
+export declare const WithANulogyApplicationName: () => import("react/jsx-runtime").JSX.Element;
+export declare const SecondaryLogo: () => import("react/jsx-runtime").JSX.Element;
+export declare const SecondaryLogoLink: () => import("react/jsx-runtime").JSX.Element;
+export declare const WithoutPassingAPrimaryLogo: () => import("react/jsx-runtime").JSX.Element;
+export declare const WithoutAPrimaryLogo: () => import("react/jsx-runtime").JSX.Element;
+export declare const WithACustomPrimaryLogo: () => import("react/jsx-runtime").JSX.Element;
 export declare const WithNavigationLogoWrapper: {
-    (): React.JSX.Element;
+    (): import("react/jsx-runtime").JSX.Element;
     story: {
         name: string;
     };