@dnanpm/styleguide 3.3.0 → 3.3.1

package/build/cjs/components/MainNavigation/MainNavigation.js

@@ -24,17 +24,17 @@ const GlobalStyle = styled.createGlobalStyle `
     body.overflow-hidden {
         overflow: hidden;
     }
-`;
-// detect common touch screen devices
-const isIosDevice = () => {
-    const validate = /iPad|iPhone|iPod|iPad Simulator|iPhone Simulator/i;
-    if (typeof navigator !== 'undefined' && typeof window !== 'undefined') {
-        return (validate.test(navigator.userAgent) &&
-            !window.MSStream);
-    }
-    return false;
-};
-const iosDevice = isIosDevice();
+`;
+// detect common touch screen devices
+const isIosDevice = () => {
+    const validate = /iPad|iPhone|iPod|iPad Simulator|iPhone Simulator/i;
+    if (typeof navigator !== 'undefined' && typeof window !== 'undefined') {
+        return (validate.test(navigator.userAgent) &&
+            !window.MSStream);
+    }
+    return false;
+};
+const iosDevice = isIosDevice();
 const fadeIn = styled.keyframes `
     0% {
         opacity: 0;
@@ -48,23 +48,23 @@ const fadeIn = styled.keyframes `
         opacity: 1;
         transform: translateY(0px);
     }
-`;
-const preventBodyScroll = () => {
-    const { scrollY } = window;
-    document.body.style.position = 'fixed';
-    document.body.style.top = `-${scrollY}px`;
-};
-const resumeBodyScroll = () => {
-    const scrollY = document.body.style.top;
-    document.body.style.position = '';
-    document.body.style.top = '';
-    // if the call to close overlay is done multiple times, scroll only the first time
-    if (scrollY) {
-        setTimeout(() => {
-            window.scrollTo(0, parseInt(scrollY, 10) * -1);
-        });
-    }
-};
+`;
+const preventBodyScroll = () => {
+    const { scrollY } = window;
+    document.body.style.position = 'fixed';
+    document.body.style.top = `-${scrollY}px`;
+};
+const resumeBodyScroll = () => {
+    const scrollY = document.body.style.top;
+    document.body.style.position = '';
+    document.body.style.top = '';
+    // if the call to close overlay is done multiple times, scroll only the first time
+    if (scrollY) {
+        setTimeout(() => {
+            window.scrollTo(0, parseInt(scrollY, 10) * -1);
+        });
+    }
+};
 const PageOverlay = styled["default"].div `
     position: fixed;
     animation: ${fadeIn} 0.2s ease-in-out;
@@ -74,14 +74,14 @@ const PageOverlay = styled["default"].div `
     height: 100%;
     background: ${theme["default"].color.background.plum.default + theme["default"].color.transparency.T10};
     z-index: ${({ navZIndex }) => navZIndex - 1};
-`;
-const scrollThreshold = 82;
-const checkThreshold = (prevPos, currPos) => {
-    if (prevPos >= currPos) {
-        return prevPos - currPos > scrollThreshold;
-    }
-    return currPos - prevPos > scrollThreshold;
-};
+`;
+const scrollThreshold = 82;
+const checkThreshold = (prevPos, currPos) => {
+    if (prevPos >= currPos) {
+        return prevPos - currPos > scrollThreshold;
+    }
+    return currPos - prevPos > scrollThreshold;
+};
 const GlobalNavigationContainer = styled["default"].nav `
     z-index: ${({ navZIndex }) => navZIndex};
     position: relative;
@@ -92,12 +92,12 @@ const GlobalNavigationContainer = styled["default"].nav `
     width: 100%;
     background-color: ${theme["default"].color.background.white.default};
     color: ${theme["default"].color.text.black};
-    top: ${({ menuLevel, tooltipMenuActive }) => (menuLevel === null || menuLevel === void 0 ? void 0 : menuLevel.hideOnScroll) && !(menuLevel === null || menuLevel === void 0 ? void 0 : menuLevel.level1) && !tooltipMenuActive
-    ? `calc(-${navigation.desktopNavMaxHeight} - ${navigation.ribbonHeight})`
+    top: ${({ menuLevel, tooltipMenuActive }) => (menuLevel === null || menuLevel === void 0 ? void 0 : menuLevel.hideOnScroll) && !(menuLevel === null || menuLevel === void 0 ? void 0 : menuLevel.level1) && !tooltipMenuActive
+    ? `calc(-${navigation.desktopNavMaxHeight} - ${navigation.ribbonHeight})`
     : '0px'} !important;
     transition: top 0.2s ease-in-out;
     box-sizing: border-box;
-`;
+`;
 const NavigationWrapper = styled["default"].div `
     display: flex;
     width: 100%;
@@ -107,210 +107,210 @@ const NavigationWrapper = styled["default"].div `
     @media (min-width: ${p => p.collapseSize + 1}px) {
         height: ${navigation.desktopNavMaxHeight};
     }
-`;
-let previousValue = false;
-const isStickySupported = typeof CSS !== 'undefined' &&
-    typeof CSS.supports !== 'undefined' &&
-    (CSS.supports('position', 'sticky') || CSS.supports('position', '-webkit-sticky'));
-const initiateScrollToHeader = (componentRef) => {
-    if ((componentRef === null || componentRef === void 0 ? void 0 : componentRef.current) && isStickySupported && typeof window !== 'undefined') {
-        window.scrollTo({ top: componentRef.current.offsetTop, left: 0 });
-    }
-};
-/** @visibleName Main Navigation */
-const MainNavigation = ({ items = {}, language = 'fi', zIndex = 1030, languageSelector = false, search = true, searchText = 'Haku', searchComponent = false, minicart = true, minicartText = 'Ostoskori', minicartComponent = false, minicartAmount = 0, showMinicart = false, showLoginTooltip = false, login = true, loginText = 'Kirjaudu', loginComponent, isLoggedIn = false, collapseSize = 767, nextJSLinkComponent = false, ribbon = true, ribbonData, className, currentUrl = '', notificationText = '', }) => {
-    const { isMobile } = useWindowSize["default"](collapseSize);
-    const props = {
-        items,
-        language,
-        zIndex,
-        search,
-        searchText,
-        minicart,
-        minicartText,
-        minicartComponent,
-        minicartAmount,
-        showMinicart,
-        showLoginTooltip,
-        login,
-        loginText,
-        loginComponent,
-        isLoggedIn,
-        searchComponent,
-        collapseSize,
-        languageSelector,
-        nextJSLinkComponent,
-        ribbonData,
-        notificationText,
-    };
-    const navigationEl = React.useRef(null);
-    const key = ramda.prop('id');
-    // Index & memoize menu levels
-    const level1 = React.useMemo(() => { var _a, _b; return (_b = (_a = items.mainNavigation) === null || _a === void 0 ? void 0 : _a.pages) !== null && _b !== void 0 ? _b : []; }, [items.mainNavigation]);
-    const level1Items = React.useMemo(() => ramda.indexBy(key, level1), [level1, key]);
-    const level2 = React.useMemo(() => level1.map(item => ramda.indexBy(key, item.pages)), [level1, key]);
-    const level2Items = Object.assign({}, ...level2);
-    // All states to for handling menus
-    const [isMobileMenuOpen, setIsMobileMenuOpen] = React.useState(false);
-    const [menuLevel, setMenuLevel] = React.useState({
-        level1: null,
-        animate1: true,
-        level2: null,
-        animate2: true,
-        level1Mobile: null,
-        level2Mobile: null,
-        scrollPosition: 0,
-        hideOnScroll: false,
-    });
-    const [lang] = React.useState(language);
-    // As scroll position cannot be always retained, close mobile menu when orientation changes
-    const initRotation = () => {
-        setIsMobileMenuOpen(false);
-    };
-    React.useEffect(() => {
-        if (iosDevice && isMobileMenuOpen) {
-            window.addEventListener('orientationchange', initRotation, false);
-            preventBodyScroll();
-        }
-        if (iosDevice && !isMobileMenuOpen) {
-            window.removeEventListener('orientationchange', initRotation, false);
-            resumeBodyScroll();
-        }
-        return () => {
-            window.removeEventListener('orientationchange', initRotation, false);
-            resumeBodyScroll();
-        };
-    }, [isMobileMenuOpen]);
-    const [tooltipItems, setTooltipItems] = React.useState(React.useMemo(() => ({
-        minicart: false,
-        login: false,
-        search: false,
-    }), []));
-    const tooltipMenuActive = tooltipItems.minicart || tooltipItems.login || tooltipItems.search;
-    const freezeOverflow = isMobileMenuOpen || (tooltipMenuActive && isMobile);
-    const isPageOverlay = tooltipMenuActive || menuLevel.level1 || menuLevel.level2;
-    React.useEffect(() => {
-        const bodyClasses = ['overflow-shown', 'overflow-hidden'];
-        document.body.classList.remove(...bodyClasses);
-        document.body.classList.add(bodyClasses[Number(Boolean(freezeOverflow))]);
-    }, [freezeOverflow]);
-    const navigationContext = React.useMemo(() => {
-        const handleNavMenuClick = (newValue, updatedLevel) => {
-            let clickedItself = false;
-            switch (updatedLevel) {
-                case 'level1':
-                    clickedItself = newValue === menuLevel.level1;
-                    setMenuLevel(Object.assign(Object.assign({}, menuLevel), { level1: !clickedItself ? newValue : null, animate1: !clickedItself, level2: null, animate2: true }));
-                    break;
-                case 'level2':
-                    clickedItself = newValue === menuLevel.level2;
-                    setMenuLevel(Object.assign(Object.assign({}, menuLevel), { level2: newValue !== menuLevel.level2 ? newValue : null, animate1: false, animate2: !clickedItself }));
-                    break;
-                case 'level1Mobile':
-                    setMenuLevel(Object.assign(Object.assign({}, menuLevel), { level1Mobile: newValue || menuLevel.level1Mobile, scrollPosition: newValue ? 1 : 0 }));
-                    break;
-                case 'level2Mobile':
-                    setMenuLevel(Object.assign(Object.assign({}, menuLevel), { level2Mobile: newValue || menuLevel.level2Mobile, scrollPosition: newValue ? 2 : 1 }));
-                    break;
-            }
-        };
-        const resetMenuEvents = () => {
-            setMenuLevel({
-                level2: null,
-                animate2: true,
-                level1: null,
-                animate1: true,
-                level1Mobile: null,
-                level2Mobile: null,
-                scrollPosition: 0,
-                hideOnScroll: false,
-            });
-            if (isMobileMenuOpen) {
-                setIsMobileMenuOpen(false);
-            }
-            setTooltipItems({
-                minicart: false,
-                login: false,
-                search: false,
-            });
-        };
-        const handleToggleClick = () => {
-            resetMenuEvents();
-            initiateScrollToHeader(navigationEl);
-            setIsMobileMenuOpen(!isMobileMenuOpen);
-        };
-        const getBackLink = (menuElements, i) => {
-            const idValue = menuLevel[`level${i}Mobile`];
-            return menuElements[idValue];
-        };
-        // Resets menu states when menu content alters between mobile and desktop
-        const menuChanged = previousValue !== isMobile;
-        if (menuChanged) {
-            resetMenuEvents();
-            previousValue = isMobile;
-        }
-        return {
-            lang,
-            navZIndex: zIndex,
-            menuLevel,
-            handleNavMenuClick,
-            getBackLink,
-            isMobileMenu: isMobile,
-            items,
-            level1Items,
-            level2Items,
-            resetMenuEvents,
-            handleToggleClick,
-            isMobileMenuOpen,
-            nextJSLinkComponent,
-            loginComponent,
-            isLoggedIn,
-            collapseSize,
-            tooltipItems,
-            setTooltipItems,
-            minicartComponent,
-            showMinicart,
-            showLoginTooltip,
-            searchComponent,
-            currentUrl,
-        };
-    }, [
-        isMobile,
-        lang,
-        zIndex,
-        menuLevel,
-        items,
-        level1Items,
-        level2Items,
-        isMobileMenuOpen,
-        nextJSLinkComponent,
-        loginComponent,
-        isLoggedIn,
-        collapseSize,
-        tooltipItems,
-        minicartComponent,
-        showMinicart,
-        showLoginTooltip,
-        searchComponent,
-        currentUrl,
-    ]);
-    useScrollPosition["default"](({ prevPos, currPos }) => {
-        const overThreshold = checkThreshold(prevPos.y, currPos.y);
-        const isShow = currPos.y < prevPos.y;
-        if (isShow !== menuLevel.hideOnScroll && overThreshold && !menuLevel.level1) {
-            setMenuLevel(Object.assign(Object.assign({}, menuLevel), { animate1: false, animate2: false, hideOnScroll: isShow }));
-        }
-    }, undefined, false, 200);
-    return (React__default["default"].createElement(React__default["default"].Fragment, null,
-        isPageOverlay && React__default["default"].createElement(PageOverlay, { "data-testid": "navigation-overlay", navZIndex: zIndex }),
-        React__default["default"].createElement(GlobalNavigationContainer, { className: className, ref: navigationEl, collapseSize: collapseSize, menuLevel: menuLevel, "data-testid": "main-navigation", navZIndex: zIndex, tooltipMenuActive: tooltipMenuActive },
-            React__default["default"].createElement(NavContext["default"].Provider, { value: navigationContext },
-                React__default["default"].createElement(GlobalStyle, null),
-                !items.mainNavigation && notificationText && (React__default["default"].createElement(Notification["default"], { type: "info" }, notificationText)),
-                ribbon && ribbonData && React__default["default"].createElement(Ribbon["default"], { ribbonData: ribbonData, lang: language }),
-                React__default["default"].createElement(NavigationWrapper, { collapseSize: collapseSize },
-                    React__default["default"].createElement(HeaderNavigationElements["default"], { navElementProps: props }),
-                    isMobile && React__default["default"].createElement(MobileMenu["default"], null))))));
+`;
+let previousValue = false;
+const isStickySupported = typeof CSS !== 'undefined' &&
+    typeof CSS.supports !== 'undefined' &&
+    (CSS.supports('position', 'sticky') || CSS.supports('position', '-webkit-sticky'));
+const initiateScrollToHeader = (componentRef) => {
+    if ((componentRef === null || componentRef === void 0 ? void 0 : componentRef.current) && isStickySupported && typeof window !== 'undefined') {
+        window.scrollTo({ top: componentRef.current.offsetTop, left: 0 });
+    }
+};
+/** @visibleName Main Navigation */
+const MainNavigation = ({ items = {}, language = 'fi', zIndex = 1030, languageSelector = false, search = true, searchText = 'Haku', searchComponent = false, minicart = true, minicartText = 'Ostoskori', minicartComponent = false, minicartAmount = 0, showMinicart = false, showLoginTooltip = false, login = true, loginText = 'Kirjaudu', loginComponent, isLoggedIn = false, collapseSize = 767, nextJSLinkComponent = false, ribbon = true, ribbonData, className, currentUrl = '', notificationText = '', }) => {
+    const { isMobile } = useWindowSize["default"](collapseSize);
+    const props = {
+        items,
+        language,
+        zIndex,
+        search,
+        searchText,
+        minicart,
+        minicartText,
+        minicartComponent,
+        minicartAmount,
+        showMinicart,
+        showLoginTooltip,
+        login,
+        loginText,
+        loginComponent,
+        isLoggedIn,
+        searchComponent,
+        collapseSize,
+        languageSelector,
+        nextJSLinkComponent,
+        ribbonData,
+        notificationText,
+    };
+    const navigationEl = React.useRef(null);
+    const key = ramda.prop('id');
+    // Index & memoize menu levels
+    const level1 = React.useMemo(() => { var _a, _b; return (_b = (_a = items.mainNavigation) === null || _a === void 0 ? void 0 : _a.pages) !== null && _b !== void 0 ? _b : []; }, [items.mainNavigation]);
+    const level1Items = React.useMemo(() => ramda.indexBy(key, level1), [level1, key]);
+    const level2 = React.useMemo(() => level1.map(item => ramda.indexBy(key, item.pages)), [level1, key]);
+    const level2Items = Object.assign({}, ...level2);
+    // All states to for handling menus
+    const [isMobileMenuOpen, setIsMobileMenuOpen] = React.useState(false);
+    const [menuLevel, setMenuLevel] = React.useState({
+        level1: null,
+        animate1: true,
+        level2: null,
+        animate2: true,
+        level1Mobile: null,
+        level2Mobile: null,
+        scrollPosition: 0,
+        hideOnScroll: false,
+    });
+    const [lang] = React.useState(language);
+    // As scroll position cannot be always retained, close mobile menu when orientation changes
+    const initRotation = () => {
+        setIsMobileMenuOpen(false);
+    };
+    React.useEffect(() => {
+        if (iosDevice && isMobileMenuOpen) {
+            window.addEventListener('orientationchange', initRotation, false);
+            preventBodyScroll();
+        }
+        if (iosDevice && !isMobileMenuOpen) {
+            window.removeEventListener('orientationchange', initRotation, false);
+            resumeBodyScroll();
+        }
+        return () => {
+            window.removeEventListener('orientationchange', initRotation, false);
+            resumeBodyScroll();
+        };
+    }, [isMobileMenuOpen]);
+    const [tooltipItems, setTooltipItems] = React.useState(React.useMemo(() => ({
+        minicart: false,
+        login: false,
+        search: false,
+    }), []));
+    const tooltipMenuActive = tooltipItems.minicart || tooltipItems.login || tooltipItems.search;
+    const freezeOverflow = isMobileMenuOpen || (tooltipMenuActive && isMobile);
+    const isPageOverlay = tooltipMenuActive || menuLevel.level1 || menuLevel.level2;
+    React.useEffect(() => {
+        const bodyClasses = ['overflow-shown', 'overflow-hidden'];
+        document.body.classList.remove(...bodyClasses);
+        document.body.classList.add(bodyClasses[Number(Boolean(freezeOverflow))]);
+    }, [freezeOverflow]);
+    const navigationContext = React.useMemo(() => {
+        const handleNavMenuClick = (newValue, updatedLevel) => {
+            let clickedItself = false;
+            switch (updatedLevel) {
+                case 'level1':
+                    clickedItself = newValue === menuLevel.level1;
+                    setMenuLevel(Object.assign(Object.assign({}, menuLevel), { level1: !clickedItself ? newValue : null, animate1: !clickedItself, level2: null, animate2: true }));
+                    break;
+                case 'level2':
+                    clickedItself = newValue === menuLevel.level2;
+                    setMenuLevel(Object.assign(Object.assign({}, menuLevel), { level2: newValue !== menuLevel.level2 ? newValue : null, animate1: false, animate2: !clickedItself }));
+                    break;
+                case 'level1Mobile':
+                    setMenuLevel(Object.assign(Object.assign({}, menuLevel), { level1Mobile: newValue || menuLevel.level1Mobile, scrollPosition: newValue ? 1 : 0 }));
+                    break;
+                case 'level2Mobile':
+                    setMenuLevel(Object.assign(Object.assign({}, menuLevel), { level2Mobile: newValue || menuLevel.level2Mobile, scrollPosition: newValue ? 2 : 1 }));
+                    break;
+            }
+        };
+        const resetMenuEvents = () => {
+            setMenuLevel({
+                level2: null,
+                animate2: true,
+                level1: null,
+                animate1: true,
+                level1Mobile: null,
+                level2Mobile: null,
+                scrollPosition: 0,
+                hideOnScroll: false,
+            });
+            if (isMobileMenuOpen) {
+                setIsMobileMenuOpen(false);
+            }
+            setTooltipItems({
+                minicart: false,
+                login: false,
+                search: false,
+            });
+        };
+        const handleToggleClick = () => {
+            resetMenuEvents();
+            initiateScrollToHeader(navigationEl);
+            setIsMobileMenuOpen(!isMobileMenuOpen);
+        };
+        const getBackLink = (menuElements, i) => {
+            const idValue = menuLevel[`level${i}Mobile`];
+            return menuElements[idValue];
+        };
+        // Resets menu states when menu content alters between mobile and desktop
+        const menuChanged = previousValue !== isMobile;
+        if (menuChanged) {
+            resetMenuEvents();
+            previousValue = isMobile;
+        }
+        return {
+            lang,
+            navZIndex: zIndex,
+            menuLevel,
+            handleNavMenuClick,
+            getBackLink,
+            isMobileMenu: isMobile,
+            items,
+            level1Items,
+            level2Items,
+            resetMenuEvents,
+            handleToggleClick,
+            isMobileMenuOpen,
+            nextJSLinkComponent,
+            loginComponent,
+            isLoggedIn,
+            collapseSize,
+            tooltipItems,
+            setTooltipItems,
+            minicartComponent,
+            showMinicart,
+            showLoginTooltip,
+            searchComponent,
+            currentUrl,
+        };
+    }, [
+        isMobile,
+        lang,
+        zIndex,
+        menuLevel,
+        items,
+        level1Items,
+        level2Items,
+        isMobileMenuOpen,
+        nextJSLinkComponent,
+        loginComponent,
+        isLoggedIn,
+        collapseSize,
+        tooltipItems,
+        minicartComponent,
+        showMinicart,
+        showLoginTooltip,
+        searchComponent,
+        currentUrl,
+    ]);
+    useScrollPosition["default"](({ prevPos, currPos }) => {
+        const overThreshold = checkThreshold(prevPos.y, currPos.y);
+        const isShow = currPos.y < prevPos.y;
+        if (isShow !== menuLevel.hideOnScroll && overThreshold && !menuLevel.level1) {
+            setMenuLevel(Object.assign(Object.assign({}, menuLevel), { animate1: false, animate2: false, hideOnScroll: isShow }));
+        }
+    }, undefined, false, 200);
+    return (React__default["default"].createElement(React__default["default"].Fragment, null,
+        isPageOverlay && React__default["default"].createElement(PageOverlay, { "data-testid": "navigation-overlay", navZIndex: zIndex }),
+        React__default["default"].createElement(GlobalNavigationContainer, { className: className, ref: navigationEl, collapseSize: collapseSize, menuLevel: menuLevel, "data-testid": "main-navigation", navZIndex: zIndex, tooltipMenuActive: tooltipMenuActive },
+            React__default["default"].createElement(NavContext["default"].Provider, { value: navigationContext },
+                React__default["default"].createElement(GlobalStyle, null),
+                !items.mainNavigation && notificationText && (React__default["default"].createElement(Notification["default"], { type: "info" }, notificationText)),
+                ribbon && ribbonData && React__default["default"].createElement(Ribbon["default"], { ribbonData: ribbonData, lang: language }),
+                React__default["default"].createElement(NavigationWrapper, { collapseSize: collapseSize },
+                    React__default["default"].createElement(HeaderNavigationElements["default"], { navElementProps: props }),
+                    isMobile && React__default["default"].createElement(MobileMenu["default"], null))))));
 };
 
 exports["default"] = MainNavigation;

package/build/cjs/components/MainNavigation/context/MobileMenuContext.d.ts

@@ -1,6 +1,6 @@
-import type { RefObject } from 'react';
-interface MobileMenuContextProps {
-    mobileMenuRef: RefObject<HTMLElement> | null;
-}
-declare const MobileMenuContext: import("react").Context<MobileMenuContextProps>;
-export default MobileMenuContext;
+import type { RefObject } from 'react';
+interface MobileMenuContextProps {
+    mobileMenuRef: RefObject<HTMLElement> | null;
+}
+declare const MobileMenuContext: import("react").Context<MobileMenuContextProps>;
+export default MobileMenuContext;

package/build/cjs/components/MainNavigation/context/MobileMenuContext.js

@@ -4,8 +4,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 
-const MobileMenuContext = React.createContext({
-    mobileMenuRef: null,
+const MobileMenuContext = React.createContext({
+    mobileMenuRef: null,
 });
 
 exports["default"] = MobileMenuContext;

package/build/cjs/components/MainNavigation/context/NavContext.d.ts

@@ -1,29 +1,29 @@
-import type { Dispatch, ReactNode, SetStateAction } from 'react';
-import type { GlobalNavItems, MenuLevelItem, MenuStates, MenuTooltipItems, MobileMenuLevel } from '../types/globalNavProps';
-export interface NavContextProps {
-    collapseSize: number;
-    currentUrl: string;
-    getBackLink: (menuElements: MenuLevelItem[], i: number) => MenuLevelItem;
-    handleNavMenuClick: (id: string | null, level: string) => void;
-    handleToggleClick: () => void;
-    isLoggedIn: boolean;
-    isMobileMenu: boolean;
-    isMobileMenuOpen: boolean;
-    items: GlobalNavItems;
-    level1Items: MobileMenuLevel;
-    level2Items: MobileMenuLevel;
-    lang: string;
-    loginComponent?: ReactNode | boolean | undefined;
-    menuLevel: MenuStates;
-    minicartComponent?: ReactNode | boolean | undefined;
-    navZIndex: number;
-    nextJSLinkComponent: ReactNode | boolean;
-    resetMenuEvents: () => void;
-    searchComponent?: ReactNode | boolean | undefined;
-    setTooltipItems: Dispatch<SetStateAction<MenuTooltipItems>>;
-    showLoginTooltip: boolean;
-    showMinicart: boolean;
-    tooltipItems: MenuTooltipItems;
-}
-declare const NavContext: import("react").Context<NavContextProps>;
-export default NavContext;
+import type { Dispatch, ReactNode, SetStateAction } from 'react';
+import type { GlobalNavItems, MenuLevelItem, MenuStates, MenuTooltipItems, MobileMenuLevel } from '../types/globalNavProps';
+export interface NavContextProps {
+    collapseSize: number;
+    currentUrl: string;
+    getBackLink: (menuElements: MenuLevelItem[], i: number) => MenuLevelItem;
+    handleNavMenuClick: (id: string | null, level: string) => void;
+    handleToggleClick: () => void;
+    isLoggedIn: boolean;
+    isMobileMenu: boolean;
+    isMobileMenuOpen: boolean;
+    items: GlobalNavItems;
+    level1Items: MobileMenuLevel;
+    level2Items: MobileMenuLevel;
+    lang: string;
+    loginComponent?: ReactNode | boolean | undefined;
+    menuLevel: MenuStates;
+    minicartComponent?: ReactNode | boolean | undefined;
+    navZIndex: number;
+    nextJSLinkComponent: ReactNode | boolean;
+    resetMenuEvents: () => void;
+    searchComponent?: ReactNode | boolean | undefined;
+    setTooltipItems: Dispatch<SetStateAction<MenuTooltipItems>>;
+    showLoginTooltip: boolean;
+    showMinicart: boolean;
+    tooltipItems: MenuTooltipItems;
+}
+declare const NavContext: import("react").Context<NavContextProps>;
+export default NavContext;