feat: add separator component

examples/gallery/src/main.rs

@@ -30,6 +30,7 @@ use gpui_native_core::scroll_area::{ScrollArea, ScrollAxes};
 use gpui_native_core::scrollbar::{Scrollbar, ScrollbarVisibility};
 use gpui_native_core::segmented::{Segmented, SegmentedOption};
 use gpui_native_core::select::{Select, SelectOption};
+use gpui_native_core::separator::Separator;
 use gpui_native_core::slider::Slider;
 use gpui_native_core::spinner::{Spinner, SpinnerVariant};
 use gpui_native_core::status_dot::{StatusDot, StatusDotVariant};
@@ -118,6 +119,7 @@ const CATALOG: &[(&str, &[(&str, &str)])] = &[
             ("welcome", "Welcome"),
             ("sidebar", "Sidebar"),
             ("resize-handle", "Resize handle"),
+            ("separator", "Separator"),
         ],
     ),
     ("Theme", &[("theme", "Theme")]),
@@ -673,6 +675,12 @@ impl Gallery {
             }),
             cx,
         );
+        dock.register_panel(
+            PanelDescriptor::new("separator", "Separator", |_, cx| {
+                cx.new(|_| SeparatorDemo).into()
+            }),
+            cx,
+        );
         dock.register_panel(
             PanelDescriptor::new("theme", "Theme", |_, cx| cx.new(|_| ThemeDemo).into()),
             cx,
@@ -1667,6 +1675,37 @@ impl Render for ClipboardDemo {
     }
 }
 
+struct SeparatorDemo;
+
+impl Render for SeparatorDemo {
+    fn render(&mut self, _window: &mut Window, cx: &mut Context<Self>) -> impl IntoElement {
+        let colors = cx.theme().colors;
+
+        ScrollArea::new("separator-demo")
+            .size_full()
+            .p_4()
+            .child(demo_section(
+                "horizontal",
+                colors,
+                v_flex()
+                    .gap_2()
+                    .child(div().text_sm().child("Above the rule"))
+                    .child(Separator::horizontal())
+                    .child(div().text_sm().child("Below the rule")),
+            ))
+            .child(demo_section(
+                "vertical",
+                colors,
+                h_flex()
+                    .gap_3()
+                    .h_8()
+                    .child(div().text_sm().child("Left"))
+                    .child(Separator::vertical())
+                    .child(div().text_sm().child("Right")),
+            ))
+    }
+}
+
 struct BadgeDemo;
 
 impl Render for BadgeDemo {