Bugfix: Seperator problems fixed.

example/src/navigation/index.tsx

@@ -9,7 +9,8 @@ import {
     NCoreUIKitEmbeddedMenu,
     NCoreUIKitLocalize,
     NCoreUIKitTheme,
-    MainHeader
+    MainHeader,
+    NCoreUIKitMenu
 } from "ncore-ui-kit";
 import {
     NavigationContainer,
@@ -98,6 +99,35 @@ const RootNav = () => {
             id: "main-menu"
         });
 
+        NCoreUIKitMenu.load({
+            navigation: navigation as unknown as NCoreUIKit.Navigation,
+            customBackgroundColor: "#444",
+            seperatorProps: {
+                customColor: "white"
+            },
+            isCollapse: false,
+            glassEffect: 5,
+            siteLogoProps: {
+                titleCustomColor: "turkish",
+                isShowIcon: false,
+                titleKey: "menu"
+            },
+            buttons: [
+                {
+                    redirectMain: "Home",
+                    isUseLocalize: true,
+                    title: "home",
+                    icon: ({
+                        color
+                    }) => <HomeIcon
+                        color={color}
+                    />
+                }
+            ],
+            isAutoClosed: true,
+            id: "main-menu"
+        });
+
         NCoreUIKitEmbeddedMenu.addEventListener("state", updateStorage);
     }, []);
 

example/src/pages/home/index.tsx

@@ -7,7 +7,9 @@ import {
 } from "react-native";
 import stylesheet from "./stylesheet";
 import {
+    Button,
     NCoreUIKitLocalize,
+    NCoreUIKitMenu,
     NCoreUIKitTheme,
     PageContainer,
     Text
@@ -51,6 +53,14 @@ const Home = () => {
             }
         }}
     >
+        <Button
+            title="open"
+            onPress={() => {
+                NCoreUIKitMenu.open({
+                    id: "main-menu"
+                });
+            }}
+        />
         <View
             style={{
                 justifyContent: "center",

src/components/menu/index.tsx

@@ -288,6 +288,7 @@ const Menu: RefForwardingComponent<IMenuRef, IMenuProps> = ({
             />
             <Seperator
                 {...seperatorProps}
+                length="100%"
                 style={[
                     seperatorProps?.style,
                     stylesheet.seperator,

src/components/seperator/stylesheet.ts

@@ -43,28 +43,28 @@ export const useStyles = ({
         } as Mutable<TextStyle>
     };
 
-    if(length !== undefined) {
-        if(direction === "horizontal") {
-            styles.container.width = length;
-        } else {
-            styles.container.height = length;
-        }
-    }
-
     if(direction === "horizontal") {
         styles.container.flexDirection = "row";
         styles.container.width = "90%";
 
-        styles.indicator.height = borders.line;
+        styles.indicator.height = borders.seperator;
         styles.indicator.width = "100%";
     } else {
         styles.container.flexDirection = "column";
         styles.container.height = "90%";
 
-        styles.indicator.width = borders.line;
+        styles.indicator.width = borders.seperator;
         styles.indicator.height = "100%";
     }
 
+    if(length !== undefined) {
+        if(direction === "horizontal") {
+            styles.container.width = length;
+        } else {
+            styles.container.height = length;
+        }
+    }
+
     return styles;
 };
 export default stylesheet;

src/components/seperator/type.ts

@@ -8,8 +8,8 @@ export type SeperatorDynamicStyle = {
     colors: NCoreUIKit.ActivePalette["colors"];
     spaces: NCoreUIKit.ActivePalette["spaces"];
     direction?: SeperatorDirectionType;
+    length?: number | string;
     customColor?: string;
-    length?: number;
 };
 
 export type SeperatorDirectionType = "horizontal" | "vertical";
@@ -18,9 +18,9 @@ interface ISeperatorProps {
     color?: keyof NCoreUIKit.BorderContentColors;
     direction?: SeperatorDirectionType;
     style?: SvgProps["style"];
+    length?: number | string;
     isShowTitle?: boolean;
     customColor?: string;
-    length?: number;
     title?: string;
 }
 export type {

src/variants/themes/default.json

@@ -47,6 +47,7 @@
             "required": 4
         },
         "borders": {
+            "seperator": 1,
             "subtract": 3,
             "line": 2
         },