Feature: Portal added for main header.

example/src/index.tsx

@@ -7,6 +7,7 @@ import {
 import moment from "moment";
 import "moment/locale/tr";
 import {
+    Host,
     setupNCoreUIKit
 } from "ncore-ui-kit";
 
@@ -44,7 +45,11 @@ const ContextAPI = () => {
     }
 
     return <NCoreUIKitBase.Provider>
-        <App/>
+        <Host
+            name="main-header"
+        >
+            <App/>
+        </Host>
     </NCoreUIKitBase.Provider>;
 };
 export default ContextAPI;

src/components/mainHeader/index.tsx

@@ -12,11 +12,16 @@ import {
     SafeAreaView
 } from "react-native-safe-area-context";
 import SiteLogo from "../siteLogo";
+import {
+    Portal
+} from "../../helpers/portalize";
 
 const MainHeader = ({
     isWorkWithSafeAreaView = true,
     isWorkWithSeperator = false,
     backgroundColor = "default",
+    portalName = "main-header",
+    isWorkWithPortal = false,
     renderRight: RenderRight,
     renderLeft: RenderLeft,
     siteLogoProps,
@@ -70,27 +75,44 @@ const MainHeader = ({
         </View>;
     };
 
+    const renderContentContainer = () => {
+        if(isWorkWithPortal) {
+            return <Portal
+                name={portalName}
+            >
+                {renderContent()}
+            </Portal>;
+        }
+
+        return renderContent();
+    };
+
     const renderSafeAreaView = () => {
         return <SafeAreaView
             edges={[
                 "top"
             ]}
         >
-            {renderContent()}
+            {renderContentContainer()}
         </SafeAreaView>;
     };
 
-    if(children) {
+    const renderWithChildren = () => {
         return <View
             style={[
                 stylesheet.baseContainer
             ]}
         >
-            {isWorkWithSafeAreaView ? renderSafeAreaView() : renderContent()}
-            {children}
+            {isWorkWithPortal ? children : null}
+            {isWorkWithSafeAreaView ? renderSafeAreaView() : renderContentContainer()}
+            {isWorkWithPortal ? null : children}
         </View>;
+    };
+
+    if(children) {
+        return renderWithChildren();
     }
 
-    return renderContent();
+    return isWorkWithSafeAreaView ? renderSafeAreaView() : renderContentContainer();
 };
 export default MainHeader;

src/components/mainHeader/type.ts

@@ -18,7 +18,9 @@ interface IMainHeader {
     isWorkWithSeperator?: boolean;
     renderRight?: () => ReactNode;
     renderLeft?: () => ReactNode;
+    isWorkWithPortal?: boolean;
     children?: ReactNode;
+    portalName?: string;
 };
 
 export type {