More previews (#20329)

Release Notes:

- N/A

crates/ui/src/components/indicator.rs

@@ -12,6 +12,7 @@ enum IndicatorKind {
 #[derive(IntoElement)]
 pub struct Indicator {
     kind: IndicatorKind,
+    border_color: Option<Color>,
     pub color: Color,
 }
 
@@ -19,6 +20,7 @@ impl Indicator {
     pub fn dot() -> Self {
         Self {
             kind: IndicatorKind::Dot,
+            border_color: None,
             color: Color::Default,
         }
     }
@@ -26,6 +28,8 @@ impl Indicator {
     pub fn bar() -> Self {
         Self {
             kind: IndicatorKind::Bar,
+            border_color: None,
+
             color: Color::Default,
         }
     }
@@ -33,6 +37,8 @@ impl Indicator {
     pub fn icon(icon: impl Into<AnyIcon>) -> Self {
         Self {
             kind: IndicatorKind::Icon(icon.into()),
+            border_color: None,
+
             color: Color::Default,
         }
     }
@@ -41,11 +47,25 @@ impl Indicator {
         self.color = color;
         self
     }
+
+    pub fn border_color(mut self, color: Color) -> Self {
+        self.border_color = Some(color);
+        self
+    }
 }
 
 impl RenderOnce for Indicator {
     fn render(self, cx: &mut WindowContext) -> impl IntoElement {
         let container = div().flex_none();
+        let container = if let Some(border_color) = self.border_color {
+            if matches!(self.kind, IndicatorKind::Dot | IndicatorKind::Bar) {
+                container.border_1().border_color(border_color.color(cx))
+            } else {
+                container
+            }
+        } else {
+            container
+        };
 
         match self.kind {
             IndicatorKind::Icon(icon) => container
@@ -63,3 +83,34 @@ impl RenderOnce for Indicator {
         }
     }
 }
+
+impl ComponentPreview for Indicator {
+    fn description() -> impl Into<Option<&'static str>> {
+        "An indicator visually represents a status or state."
+    }
+
+    fn examples() -> Vec<ComponentExampleGroup<Self>> {
+        vec![
+            example_group(
+                "Types",
+                vec![
+                    single_example("Dot", Indicator::dot().color(Color::Info)),
+                    single_example("Bar", Indicator::bar().color(Color::Player(2))),
+                    single_example(
+                        "Icon",
+                        Indicator::icon(Icon::new(IconName::Check).color(Color::Success)),
+                    ),
+                ],
+            ),
+            example_group(
+                "Examples",
+                vec![
+                    single_example("Info", Indicator::dot().color(Color::Info)),
+                    single_example("Success", Indicator::dot().color(Color::Success)),
+                    single_example("Warning", Indicator::dot().color(Color::Warning)),
+                    single_example("Error", Indicator::dot().color(Color::Error)),
+                ],
+            ),
+        ]
+    }
+}