feat(mobileNavigation): added a parameter for the portal in mobile navigation (#1132)

* feat(mobileNavigation): added a parameter for the portal in mobile navigation

* fix(stories): resolve conflicts

* fix(mobile-navigation): fixed component logic

* fix(navigation): updated props

Author: ReFFaT

src/navigation/components/MobileNavigation/MobileNavigation.tsx

@@ -16,6 +16,7 @@ export const MobileNavigation: React.FC<MobileNavigationProps> = ({
     isOpened,
     topItems,
     bottomItems,
+    portalContainer,
     ...props
 }) => {
     const [isMounted, setIsMounted] = React.useState(false);
@@ -27,7 +28,7 @@ export const MobileNavigation: React.FC<MobileNavigationProps> = ({
     }
 
     return (
-        <Portal>
+        <Portal container={portalContainer?.current ?? undefined}>
             <Foldable key={topItems?.length} className={b()} isOpened={Boolean(isOpened)}>
                 <div className={b('wrapper')}>
                     {topItems && (

src/navigation/components/Navigation/Navigation.tsx

@@ -15,9 +15,15 @@ const b = block('navigation');
 export interface NavigationComponentProps extends ClassNameProps {
     logo: ThemedNavigationLogoData;
     data: HeaderData;
+    mobilePortalContainer?: React.RefObject<HTMLElement>;
 }
 
-export const Navigation: React.FC<NavigationComponentProps> = ({data, logo, className}) => {
+export const Navigation: React.FC<NavigationComponentProps> = ({
+    data,
+    logo,
+    className,
+    mobilePortalContainer,
+}) => {
     const {
         leftItems,
         rightItems,
@@ -56,6 +62,7 @@ export const Navigation: React.FC<NavigationComponentProps> = ({data, logo, clas
                                 isOpened={isSidebarOpened}
                                 activeItemId={activeItemId}
                                 onActiveItemChange={onActiveItemChange}
+                                portalContainer={mobilePortalContainer}
                             />
                         </OutsideClick>
                     </nav>

src/navigation/models.ts

@@ -73,6 +73,7 @@ export interface MobileNavigationProps extends ClassNameProps, ActiveItemProps {
     isOpened?: boolean;
     topItems?: NavigationItemModel[];
     bottomItems?: NavigationItemModel[];
+    portalContainer?: React.RefObject<HTMLElement>;
 }
 
 export interface NavigationProps extends MobileMenuButtonProps, ActiveItemProps {