@dnanpm/styleguide 3.2.0 → 3.3.1

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

@@ -2,6 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+var icons = require('@dnanpm/icons');
 var React = require('react');
 var reactSpring = require('react-spring');
 var styled = require('../../../themes/styled.js');
@@ -9,9 +10,6 @@ var theme = require('../../../themes/theme.js');
 var navigation = require('../../../themes/themeComponents/navigation.js');
 var styledUtils = require('../../../utils/styledUtils.js');
 var Icon = require('../../Icon/Icon.js');
-require('tslib');
-var hlChevronLeft = require('../../Icons/hlChevronLeft.js');
-var hlChevronRight = require('../../Icons/hlChevronRight.js');
 var MobileMenuContext = require('../context/MobileMenuContext.js');
 var NavContext = require('../context/NavContext.js');
 var globalNavStyles = require('../globalNavStyles.js');
@@ -24,9 +22,9 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
 const MobileMenuWrapper = styled["default"].div `
     width: ${100 * navigation.menuLevelsAmount}%;
-`;
-const mobileMenuWithRibbon = `calc(100vh - ${navigation.mobileNavMaxHeight} - ${navigation.ribbonHeight})`;
-const mobileMenuNoRibbon = `calc(100vh - ${navigation.mobileNavMaxHeight})`;
+`;
+const mobileMenuWithRibbon = `calc(100vh - ${navigation.mobileNavMaxHeight} - ${navigation.ribbonHeight})`;
+const mobileMenuNoRibbon = `calc(100vh - ${navigation.mobileNavMaxHeight})`;
 const MobileMenuContainer = styled["default"].div `
     width: 100%;
     position: absolute;
@@ -43,8 +41,8 @@ const MobileMenuContainer = styled["default"].div `
         max-height: ${mobileMenuWithRibbon};
         height: ${mobileMenuWithRibbon};
     `};
-`;
-const MenuLinkBackLink = styled["default"](globalNavStyles.MenuLink) ``;
+`;
+const MenuLinkBackLink = styled["default"](globalNavStyles.MenuLink) ``;
 const MobileMenu = styled["default"].div `
     background: ${theme["default"].color.background.white.default};
     ${globalNavStyles.MenuList} {
@@ -98,98 +96,98 @@ const MobileMenu = styled["default"].div `
     ${globalNavStyles.MenuLink}:hover {
         cursor: pointer;
     }
-`;
-const MenuItemBackLink = ({ currentLevel }) => {
-    const { handleNavMenuClick, lang, menuLevel: { scrollPosition }, level1Items, level2Items, getBackLink, } = React.useContext(NavContext["default"]);
-    const levels = {
-        level1Items,
-        level2Items,
-    };
-    const menuElementLevel = `level${currentLevel - 1}Items`;
-    const menuElements = levels[menuElementLevel];
-    const mobileMenuBackClick = (e) => {
-        e.preventDefault();
-        handleNavMenuClick(null, `level${currentLevel - 1}Mobile`);
-    };
-    const tabNavigationDisabled = scrollPosition !== currentLevel - 1;
-    const backLink = getBackLink(menuElements, currentLevel - 1);
-    return (React__default["default"].createElement(globalNavStyles.MenuItem, { key: `back-${backLink.id}`, "data-testid": `mobile-nav-menu-backlink-level-${currentLevel}` },
-        React__default["default"].createElement(MenuLinkBackLink, { role: "menuitem", as: "button", onClick: mobileMenuBackClick, tabIndex: tabNavigationDisabled ? -1 : undefined },
-            React__default["default"].createElement(Icon["default"], { icon: hlChevronLeft["default"], size: "1rem" }),
-            backLink.titles[lang])));
-};
-const CreateSubMenuItem = ({ menuItem, currentLevel, itemIndex }) => {
-    var _a;
-    const { handleNavMenuClick, menuLevel: { scrollPosition }, lang, currentUrl, } = React.useContext(NavContext["default"]);
-    const { mobileMenuRef } = React.useContext(MobileMenuContext["default"]);
-    const hasChildren = (_a = menuItem === null || menuItem === void 0 ? void 0 : menuItem.pages) === null || _a === void 0 ? void 0 : _a.length;
-    const indexLevel = currentLevel - 1;
-    const tabNavigationDisabled = () => scrollPosition !== indexLevel;
-    const menuUrl = menuItem.urls[lang] || '';
-    const mobileMenuClick = (element) => (e) => {
-        var _a;
-        if (typeof ((_a = mobileMenuRef === null || mobileMenuRef === void 0 ? void 0 : mobileMenuRef.current) === null || _a === void 0 ? void 0 : _a.scroll) === 'function') {
-            mobileMenuRef.current.scroll({
-                top: 0,
-                left: 0,
-                behavior: 'smooth',
-            });
-        }
-        e.preventDefault();
-        handleNavMenuClick(element.id, `level${currentLevel}Mobile`);
-    };
-    if (hasChildren && currentLevel < 3) {
-        return (React__default["default"].createElement(globalNavStyles.MenuItem, { key: menuItem.id, "aria-haspopup": "true", "data-testid": `mobile-menu-level-${currentLevel}-link-${itemIndex + 1}`, isActive: LinkModifier.isSelected(currentUrl, menuUrl) },
-            React__default["default"].createElement(globalNavStyles.MenuLink, { as: "button", onClick: mobileMenuClick(menuItem), role: "menuitem", tabIndex: tabNavigationDisabled() ? -1 : undefined },
-                menuItem.titles[lang],
-                React__default["default"].createElement(Icon["default"], { icon: hlChevronRight["default"], size: "1rem" }))));
-    }
-    return (React__default["default"].createElement(globalNavStyles.MenuItem, { key: menuItem.id, role: "menuitem", "data-testid": `mobile-menu-level-${currentLevel}-link-${itemIndex + 1}`, isActive: LinkModifier.isSelected(currentUrl, menuUrl, true) },
-        React__default["default"].createElement(LinkModifier["default"], { menuItem: menuItem, tabIndex: tabNavigationDisabled() })));
-};
-const SubMenuMobile = ({ currentLevel, menuItem }) => {
-    const navElements = menuItem.pages;
-    if (!navElements.length) {
-        return null;
-    }
-    return (React__default["default"].createElement(React__default["default"].Fragment, null,
-        currentLevel > 1 && React__default["default"].createElement(MenuItemBackLink, { currentLevel: currentLevel }),
-        navElements.map((subMenuItem, index) => (React__default["default"].createElement(CreateSubMenuItem, { menuItem: subMenuItem, currentLevel: currentLevel, key: subMenuItem.id, itemIndex: index })))));
-};
-const NavigationMenuMobile = () => {
-    const { items, menuLevel, level1Items, level2Items } = React.useContext(NavContext["default"]);
-    const { mainNavigation } = items;
-    if (!(mainNavigation === null || mainNavigation === void 0 ? void 0 : mainNavigation.pages.length)) {
-        return null;
-    }
-    return (React__default["default"].createElement(React__default["default"].Fragment, null,
-        React__default["default"].createElement(globalNavStyles.MenuList, { role: "menu", "aria-hidden": menuLevel.scrollPosition !== 0, "aria-disabled": menuLevel.scrollPosition !== 0, "data-testid": "mobile-nav-menu-level-1", isInView: menuLevel.scrollPosition === 0 },
-            React__default["default"].createElement(SubMenuMobile, { currentLevel: 1, menuItem: mainNavigation }),
-            React__default["default"].createElement(globalNavStyles.MenuItem, { key: "business-item", "aria-hidden": menuLevel.scrollPosition !== 0, role: "menuitem" },
-                React__default["default"].createElement(BusinessMenu["default"], null))),
-        menuLevel.level1Mobile !== null && (React__default["default"].createElement(globalNavStyles.MenuList, { role: "menu", "aria-hidden": menuLevel.scrollPosition !== 1, "aria-disabled": menuLevel.scrollPosition !== 1, "data-testid": "mobile-nav-menu-level-2", isInView: menuLevel.scrollPosition === 1 },
-            React__default["default"].createElement(SubMenuMobile, { currentLevel: 2, menuItem: level1Items[menuLevel.level1Mobile] }))),
-        menuLevel.level2Mobile !== null && (React__default["default"].createElement(globalNavStyles.MenuList, { role: "menu", "aria-hidden": menuLevel.scrollPosition !== 2, "aria-disabled": menuLevel.scrollPosition !== 2, "data-testid": "mobile-nav-menu-level-3", isInView: menuLevel.scrollPosition === 2 },
-            React__default["default"].createElement(SubMenuMobile, { currentLevel: 3, menuItem: level2Items[menuLevel.level2Mobile] })))));
-};
-const RenderMobileMenu = () => {
-    const { menuLevel, isMobileMenuOpen } = React.useContext(NavContext["default"]);
-    const mobileMenuRef = React.useRef(null);
-    const slidingMenuAnimation = reactSpring.useSpring({
-        transform: `translateX(${(menuLevel.scrollPosition / navigation.menuLevelsAmount) * -100}%)`,
-    });
-    const mobileMenuContext = React.useMemo(() => ({
-        mobileMenuRef,
-    }), [mobileMenuRef]);
-    if (!isMobileMenuOpen) {
-        return null;
-    }
-    return (React__default["default"].createElement(MobileMenuContainer, { ref: mobileMenuRef },
-        React__default["default"].createElement(MobileMenuContext["default"].Provider, { value: mobileMenuContext },
-            React__default["default"].createElement(MobileMenu, null,
-                React__default["default"].createElement(MobileMenuWrapper, null,
-                    React__default["default"].createElement(reactSpring.animated.div, { style: slidingMenuAnimation },
-                        React__default["default"].createElement(NavigationMenuMobile, null)))))));
+`;
+const MenuItemBackLink = ({ currentLevel }) => {
+    const { handleNavMenuClick, lang, menuLevel: { scrollPosition }, level1Items, level2Items, getBackLink, } = React.useContext(NavContext["default"]);
+    const levels = {
+        level1Items,
+        level2Items,
+    };
+    const menuElementLevel = `level${currentLevel - 1}Items`;
+    const menuElements = levels[menuElementLevel];
+    const mobileMenuBackClick = (e) => {
+        e.preventDefault();
+        handleNavMenuClick(null, `level${currentLevel - 1}Mobile`);
+    };
+    const tabNavigationDisabled = scrollPosition !== currentLevel - 1;
+    const backLink = getBackLink(menuElements, currentLevel - 1);
+    return (React__default["default"].createElement(globalNavStyles.MenuItem, { key: `back-${backLink.id}`, "data-testid": `mobile-nav-menu-backlink-level-${currentLevel}` },
+        React__default["default"].createElement(MenuLinkBackLink, { role: "menuitem", as: "button", onClick: mobileMenuBackClick, tabIndex: tabNavigationDisabled ? -1 : undefined },
+            React__default["default"].createElement(Icon["default"], { icon: icons.ChevronLeft, size: "1rem" }),
+            backLink.titles[lang])));
+};
+const CreateSubMenuItem = ({ menuItem, currentLevel, itemIndex }) => {
+    var _a;
+    const { handleNavMenuClick, menuLevel: { scrollPosition }, lang, currentUrl, } = React.useContext(NavContext["default"]);
+    const { mobileMenuRef } = React.useContext(MobileMenuContext["default"]);
+    const hasChildren = (_a = menuItem === null || menuItem === void 0 ? void 0 : menuItem.pages) === null || _a === void 0 ? void 0 : _a.length;
+    const indexLevel = currentLevel - 1;
+    const tabNavigationDisabled = () => scrollPosition !== indexLevel;
+    const menuUrl = menuItem.urls[lang] || '';
+    const mobileMenuClick = (element) => (e) => {
+        var _a;
+        if (typeof ((_a = mobileMenuRef === null || mobileMenuRef === void 0 ? void 0 : mobileMenuRef.current) === null || _a === void 0 ? void 0 : _a.scroll) === 'function') {
+            mobileMenuRef.current.scroll({
+                top: 0,
+                left: 0,
+                behavior: 'smooth',
+            });
+        }
+        e.preventDefault();
+        handleNavMenuClick(element.id, `level${currentLevel}Mobile`);
+    };
+    if (hasChildren && currentLevel < 3) {
+        return (React__default["default"].createElement(globalNavStyles.MenuItem, { key: menuItem.id, "aria-haspopup": "true", "data-testid": `mobile-menu-level-${currentLevel}-link-${itemIndex + 1}`, isActive: LinkModifier.isSelected(currentUrl, menuUrl) },
+            React__default["default"].createElement(globalNavStyles.MenuLink, { as: "button", onClick: mobileMenuClick(menuItem), role: "menuitem", tabIndex: tabNavigationDisabled() ? -1 : undefined },
+                menuItem.titles[lang],
+                React__default["default"].createElement(Icon["default"], { icon: icons.ChevronRight, size: "1rem" }))));
+    }
+    return (React__default["default"].createElement(globalNavStyles.MenuItem, { key: menuItem.id, role: "menuitem", "data-testid": `mobile-menu-level-${currentLevel}-link-${itemIndex + 1}`, isActive: LinkModifier.isSelected(currentUrl, menuUrl, true) },
+        React__default["default"].createElement(LinkModifier["default"], { menuItem: menuItem, tabIndex: tabNavigationDisabled() })));
+};
+const SubMenuMobile = ({ currentLevel, menuItem }) => {
+    const navElements = menuItem.pages;
+    if (!navElements.length) {
+        return null;
+    }
+    return (React__default["default"].createElement(React__default["default"].Fragment, null,
+        currentLevel > 1 && React__default["default"].createElement(MenuItemBackLink, { currentLevel: currentLevel }),
+        navElements.map((subMenuItem, index) => (React__default["default"].createElement(CreateSubMenuItem, { menuItem: subMenuItem, currentLevel: currentLevel, key: subMenuItem.id, itemIndex: index })))));
+};
+const NavigationMenuMobile = () => {
+    const { items, menuLevel, level1Items, level2Items } = React.useContext(NavContext["default"]);
+    const { mainNavigation } = items;
+    if (!(mainNavigation === null || mainNavigation === void 0 ? void 0 : mainNavigation.pages.length)) {
+        return null;
+    }
+    return (React__default["default"].createElement(React__default["default"].Fragment, null,
+        React__default["default"].createElement(globalNavStyles.MenuList, { role: "menu", "aria-hidden": menuLevel.scrollPosition !== 0, "aria-disabled": menuLevel.scrollPosition !== 0, "data-testid": "mobile-nav-menu-level-1", isInView: menuLevel.scrollPosition === 0 },
+            React__default["default"].createElement(SubMenuMobile, { currentLevel: 1, menuItem: mainNavigation }),
+            React__default["default"].createElement(globalNavStyles.MenuItem, { key: "business-item", "aria-hidden": menuLevel.scrollPosition !== 0, role: "menuitem" },
+                React__default["default"].createElement(BusinessMenu["default"], null))),
+        menuLevel.level1Mobile !== null && (React__default["default"].createElement(globalNavStyles.MenuList, { role: "menu", "aria-hidden": menuLevel.scrollPosition !== 1, "aria-disabled": menuLevel.scrollPosition !== 1, "data-testid": "mobile-nav-menu-level-2", isInView: menuLevel.scrollPosition === 1 },
+            React__default["default"].createElement(SubMenuMobile, { currentLevel: 2, menuItem: level1Items[menuLevel.level1Mobile] }))),
+        menuLevel.level2Mobile !== null && (React__default["default"].createElement(globalNavStyles.MenuList, { role: "menu", "aria-hidden": menuLevel.scrollPosition !== 2, "aria-disabled": menuLevel.scrollPosition !== 2, "data-testid": "mobile-nav-menu-level-3", isInView: menuLevel.scrollPosition === 2 },
+            React__default["default"].createElement(SubMenuMobile, { currentLevel: 3, menuItem: level2Items[menuLevel.level2Mobile] })))));
+};
+const RenderMobileMenu = () => {
+    const { menuLevel, isMobileMenuOpen } = React.useContext(NavContext["default"]);
+    const mobileMenuRef = React.useRef(null);
+    const slidingMenuAnimation = reactSpring.useSpring({
+        transform: `translateX(${(menuLevel.scrollPosition / navigation.menuLevelsAmount) * -100}%)`,
+    });
+    const mobileMenuContext = React.useMemo(() => ({
+        mobileMenuRef,
+    }), [mobileMenuRef]);
+    if (!isMobileMenuOpen) {
+        return null;
+    }
+    return (React__default["default"].createElement(MobileMenuContainer, { ref: mobileMenuRef },
+        React__default["default"].createElement(MobileMenuContext["default"].Provider, { value: mobileMenuContext },
+            React__default["default"].createElement(MobileMenu, null,
+                React__default["default"].createElement(MobileMenuWrapper, null,
+                    React__default["default"].createElement(reactSpring.animated.div, { style: slidingMenuAnimation },
+                        React__default["default"].createElement(NavigationMenuMobile, null)))))));
 };
 
 exports["default"] = RenderMobileMenu;

package/build/cjs/components/MainNavigation/ChildComponents/PageSearch.d.ts

@@ -1,6 +1,6 @@
-import React from 'react';
-interface PageSearchProps {
-    searchLabel?: string;
-}
-declare const PageSearch: ({ searchLabel }: PageSearchProps) => React.JSX.Element;
-export default PageSearch;
+import React from 'react';
+interface PageSearchProps {
+    searchLabel?: string;
+}
+declare const PageSearch: ({ searchLabel }: PageSearchProps) => React.JSX.Element;
+export default PageSearch;

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

@@ -2,10 +2,9 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+var icons = require('@dnanpm/icons');
 var React = require('react');
 var Icon = require('../../Icon/Icon.js');
-require('tslib');
-var hlMagnifyingGlass = require('../../Icons/hlMagnifyingGlass.js');
 var NavContext = require('../context/NavContext.js');
 var MainNavTooltipMenu = require('./MainNavTooltipMenu.js');
 
@@ -13,12 +12,12 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-const PageSearch = ({ searchLabel }) => {
-    const globalStateString = 'search';
-    const { navZIndex, searchComponent: SearchComponent } = React.useContext(NavContext["default"]);
-    return (React__default["default"].createElement(MainNavTooltipMenu["default"], { zIndex: navZIndex + 1, tooltipRight: "0", contentComponent: SearchComponent, contentWidth: "100%", globalStateString: globalStateString, fullWidthDesktop: true, closeWhenTagClicked: ['a'] },
-        React__default["default"].createElement(Icon["default"], { icon: hlMagnifyingGlass["default"], size: "2rem" }),
-        React__default["default"].createElement("span", null, searchLabel)));
+const PageSearch = ({ searchLabel }) => {
+    const globalStateString = 'search';
+    const { navZIndex, searchComponent: SearchComponent } = React.useContext(NavContext["default"]);
+    return (React__default["default"].createElement(MainNavTooltipMenu["default"], { zIndex: navZIndex + 1, tooltipRight: "0", contentComponent: SearchComponent, contentWidth: "100%", globalStateString: globalStateString, fullWidthDesktop: true, closeWhenTagClicked: ['a'] },
+        React__default["default"].createElement(Icon["default"], { icon: icons.Search, size: "2rem" }),
+        React__default["default"].createElement("span", null, searchLabel)));
 };
 
 exports["default"] = PageSearch;

package/build/cjs/components/MainNavigation/ChildComponents/Ribbon.d.ts

@@ -1,13 +1,13 @@
-import React from 'react';
-import type { LangProps } from '../../../types/language';
-export interface RibbonDataProps {
-    ribbonLink: LangProps;
-    ribbonIcon: string;
-    ribbonTexts: LangProps;
-}
-interface Props {
-    ribbonData: RibbonDataProps[];
-    lang?: string;
-}
-declare const Ribbon: ({ ribbonData, lang }: Props) => React.JSX.Element;
-export default Ribbon;
+import React from 'react';
+import type { LangProps } from '../../../types/language';
+export interface RibbonDataProps {
+    ribbonLink: LangProps;
+    ribbonIcon: string;
+    ribbonTexts: LangProps;
+}
+interface Props {
+    ribbonData: RibbonDataProps[];
+    lang?: string;
+}
+declare const Ribbon: ({ ribbonData, lang }: Props) => React.JSX.Element;
+export default Ribbon;

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

@@ -19,7 +19,7 @@ const RibbonContainer = styled["default"].div `
         background: ${theme["default"].color.background.sand.E01};
         display: block;
     `};
-`;
+`;
 const RibbonItems = styled["default"].div `
     max-width: 1290px;
     height: ${navigation.ribbonHeight};
@@ -28,7 +28,7 @@ const RibbonItems = styled["default"].div `
     display: flex;
     justify-content: center;
     align-items: center;
-`;
+`;
 const RibbonColumn = styled["default"].div `
     flex: 1 1 auto;
     display: flex;
@@ -61,14 +61,14 @@ const RibbonColumn = styled["default"].div `
             text-decoration: underline;
         }
     }
-`;
-const Ribbon = ({ ribbonData, lang = 'fi' }) => (React__default["default"].createElement(RibbonContainer, null,
-    React__default["default"].createElement(RibbonItems, null, ribbonData.map(ribbon => (React__default["default"].createElement(RibbonColumn, { key: `ribbon-${ribbon.ribbonIcon}` },
-        ribbon.ribbonLink[lang] && (React__default["default"].createElement("a", { href: ribbon.ribbonLink[lang] },
-            React__default["default"].createElement(Icon["default"], { name: ribbon.ribbonIcon, size: "1rem" }),
-            React__default["default"].createElement("span", null, ribbon.ribbonTexts[lang]))),
-        !ribbon.ribbonLink[lang] && (React__default["default"].createElement(React__default["default"].Fragment, null,
-            React__default["default"].createElement(Icon["default"], { name: ribbon.ribbonIcon, size: "1rem" }),
+`;
+const Ribbon = ({ ribbonData, lang = 'fi' }) => (React__default["default"].createElement(RibbonContainer, null,
+    React__default["default"].createElement(RibbonItems, null, ribbonData.map(ribbon => (React__default["default"].createElement(RibbonColumn, { key: `ribbon-${ribbon.ribbonIcon}` },
+        ribbon.ribbonLink[lang] && (React__default["default"].createElement("a", { href: ribbon.ribbonLink[lang] },
+            React__default["default"].createElement(Icon["default"], { name: ribbon.ribbonIcon, size: "1rem" }),
+            React__default["default"].createElement("span", null, ribbon.ribbonTexts[lang]))),
+        !ribbon.ribbonLink[lang] && (React__default["default"].createElement(React__default["default"].Fragment, null,
+            React__default["default"].createElement(Icon["default"], { name: ribbon.ribbonIcon, size: "1rem" }),
             React__default["default"].createElement("span", null, ribbon.ribbonTexts[lang])))))))));
 
 exports["default"] = Ribbon;

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

@@ -1,35 +1,35 @@
-import type { ReactNode } from 'react';
-import React from 'react';
-import type { RibbonDataProps } from './ChildComponents/Ribbon';
-import type { GlobalNavItems } from './types/globalNavProps';
-export interface MainNavigationProps {
-    /** Allows to pass a custom className */
-    className?: string;
-    items?: GlobalNavItems;
-    language?: string;
-    zIndex?: number;
-    search?: boolean;
-    searchText?: string;
-    searchComponent?: ReactNode | boolean;
-    minicart?: boolean;
-    minicartText?: string;
-    minicartAmount?: number;
-    minicartComponent?: ReactNode | boolean;
-    showMinicart?: boolean;
-    showLoginTooltip?: boolean;
-    login?: boolean;
-    loginText?: string;
-    loginComponent?: ReactNode | boolean;
-    isLoggedIn?: boolean;
-    collapseSize?: number;
-    languageSelector?: boolean;
-    nextJSLinkComponent: ReactNode | boolean;
-    ribbon?: boolean;
-    ribbonData?: RibbonDataProps[];
-    currentUrl?: string;
-    notificationText?: string;
-}
-/** @visibleName Main Navigation */
-declare const MainNavigation: ({ items, language, zIndex, languageSelector, search, searchText, searchComponent, minicart, minicartText, minicartComponent, minicartAmount, showMinicart, showLoginTooltip, login, loginText, loginComponent, isLoggedIn, collapseSize, nextJSLinkComponent, ribbon, ribbonData, className, currentUrl, notificationText, }: MainNavigationProps) => React.JSX.Element;
-/** @component */
-export default MainNavigation;
+import type { ReactNode } from 'react';
+import React from 'react';
+import type { RibbonDataProps } from './ChildComponents/Ribbon';
+import type { GlobalNavItems } from './types/globalNavProps';
+export interface MainNavigationProps {
+    /** Allows to pass a custom className */
+    className?: string;
+    items?: GlobalNavItems;
+    language?: string;
+    zIndex?: number;
+    search?: boolean;
+    searchText?: string;
+    searchComponent?: ReactNode | boolean;
+    minicart?: boolean;
+    minicartText?: string;
+    minicartAmount?: number;
+    minicartComponent?: ReactNode | boolean;
+    showMinicart?: boolean;
+    showLoginTooltip?: boolean;
+    login?: boolean;
+    loginText?: string;
+    loginComponent?: ReactNode | boolean;
+    isLoggedIn?: boolean;
+    collapseSize?: number;
+    languageSelector?: boolean;
+    nextJSLinkComponent: ReactNode | boolean;
+    ribbon?: boolean;
+    ribbonData?: RibbonDataProps[];
+    currentUrl?: string;
+    notificationText?: string;
+}
+/** @visibleName Main Navigation */
+declare const MainNavigation: ({ items, language, zIndex, languageSelector, search, searchText, searchComponent, minicart, minicartText, minicartComponent, minicartAmount, showMinicart, showLoginTooltip, login, loginText, loginComponent, isLoggedIn, collapseSize, nextJSLinkComponent, ribbon, ribbonData, className, currentUrl, notificationText, }: MainNavigationProps) => React.JSX.Element;
+/** @component */
+export default MainNavigation;