From a02d80671596b4cfa8afea1a8e7b5294faf46318 Mon Sep 17 00:00:00 2001
From: Marshall Bowers <elliott.codes@gmail.com>
Date: Mon, 30 Oct 2023 17:31:15 -0400
Subject: [PATCH] Add a story showcasing the color scales

---
 crates/storybook2/src/stories.rs        |  2 ++
 crates/storybook2/src/stories/colors.rs | 28 +++++++++++++++++++++++++
 crates/storybook2/src/story_selector.rs |  2 ++
 crates/theme2/src/default.rs            |  5 ++---
 crates/theme2/src/scale.rs              |  9 ++++----
 crates/theme2/src/theme2.rs             |  2 ++
 6 files changed, 40 insertions(+), 8 deletions(-)
 create mode 100644 crates/storybook2/src/stories/colors.rs

diff --git a/crates/storybook2/src/stories.rs b/crates/storybook2/src/stories.rs
index 2517522bc39f7c1207449272c6a574e983397fe3..3d8a332fb93b16ae8480acd32e97bbd4a0c5ab25 100644
--- a/crates/storybook2/src/stories.rs
+++ b/crates/storybook2/src/stories.rs
@@ -1,9 +1,11 @@
+mod colors;
 mod focus;
 mod kitchen_sink;
 mod scroll;
 mod text;
 mod z_index;
 
+pub use colors::*;
 pub use focus::*;
 pub use kitchen_sink::*;
 pub use scroll::*;
diff --git a/crates/storybook2/src/stories/colors.rs b/crates/storybook2/src/stories/colors.rs
new file mode 100644
index 0000000000000000000000000000000000000000..a0a06200859dbba43e7f34de33032a3e56d453f1
--- /dev/null
+++ b/crates/storybook2/src/stories/colors.rs
@@ -0,0 +1,28 @@
+use ui::prelude::*;
+
+use crate::story::Story;
+
+#[derive(Component)]
+pub struct ColorsStory;
+
+impl ColorsStory {
+    fn render<V: 'static>(self, _view: &mut V, cx: &mut ViewContext<V>) -> impl Component<V> {
+        let color_scales = theme2::default_color_scales();
+
+        Story::container(cx)
+            .child(Story::title(cx, "Colors"))
+            .child(
+                div()
+                    .id("colors")
+                    .flex()
+                    .flex_col()
+                    .overflow_y_scroll()
+                    .text_color(gpui2::white())
+                    .children(color_scales.into_iter().map(|(name, scale)| {
+                        div().child(name.to_string()).child(div().flex().children(
+                            (1..=12).map(|step| div().flex().size_4().bg(scale.step(cx, step))),
+                        ))
+                    })),
+            )
+    }
+}
diff --git a/crates/storybook2/src/story_selector.rs b/crates/storybook2/src/story_selector.rs
index d6ff77c5c1c4ff183e4921ecc53ac7761e59dadd..737f28bda29f10fe5cf992084f7119888281bbf6 100644
--- a/crates/storybook2/src/story_selector.rs
+++ b/crates/storybook2/src/story_selector.rs
@@ -14,6 +14,7 @@ use ui::prelude::*;
 pub enum ElementStory {
     Avatar,
     Button,
+    Colors,
     Details,
     Focus,
     Icon,
@@ -29,6 +30,7 @@ impl ElementStory {
         match self {
             Self::Avatar => { cx.build_view(|cx| (), |_, _| ui::AvatarStory.render()) }.into_any(),
             Self::Button => { cx.build_view(|cx| (), |_, _| ui::ButtonStory.render()) }.into_any(),
+            Self::Colors => { cx.build_view(|cx| (), |_, _| ColorsStory.render()) }.into_any(),
             Self::Details => {
                 { cx.build_view(|cx| (), |_, _| ui::DetailsStory.render()) }.into_any()
             }
diff --git a/crates/theme2/src/default.rs b/crates/theme2/src/default.rs
index e3a0527f110697867f82053c24ae2262f0b566d3..41d408f9802a154dee267900fb162d96e7789311 100644
--- a/crates/theme2/src/default.rs
+++ b/crates/theme2/src/default.rs
@@ -1,6 +1,5 @@
-use std::collections::HashMap;
-
 use gpui2::Rgba;
+use indexmap::IndexMap;
 
 use crate::scale::{ColorScaleName, ColorScaleSet, ColorScales};
 
@@ -35,7 +34,7 @@ impl From<DefaultColorScaleSet> for ColorScaleSet {
 pub fn default_color_scales() -> ColorScales {
     use ColorScaleName::*;
 
-    HashMap::from_iter([
+    IndexMap::from_iter([
         (Gray, gray().into()),
         (Mauve, mauve().into()),
         (Slate, slate().into()),
diff --git a/crates/theme2/src/scale.rs b/crates/theme2/src/scale.rs
index 3aea4762285e66394c3f1ef455b9661e74a3a689..ba37924375131cec7b0ff59b3e4f7c4256c03e05 100644
--- a/crates/theme2/src/scale.rs
+++ b/crates/theme2/src/scale.rs
@@ -1,6 +1,5 @@
-use std::collections::HashMap;
-
 use gpui2::{AppContext, Hsla};
+use indexmap::IndexMap;
 
 use crate::{theme, Appearance};
 
@@ -87,7 +86,7 @@ impl std::fmt::Display for ColorScaleName {
 
 pub type ColorScale = [Hsla; 12];
 
-pub type ColorScales = HashMap<ColorScaleName, ColorScaleSet>;
+pub type ColorScales = IndexMap<ColorScaleName, ColorScaleSet>;
 
 /// A one-based step in a [`ColorScale`].
 pub type ColorScaleStep = usize;
@@ -146,7 +145,7 @@ impl ColorScaleSet {
         }
     }
 
-    pub fn step(self, cx: &AppContext, step: ColorScaleStep) -> Hsla {
+    pub fn step(&self, cx: &AppContext, step: ColorScaleStep) -> Hsla {
         let appearance = Self::current_appearance(cx);
 
         match appearance {
@@ -155,7 +154,7 @@ impl ColorScaleSet {
         }
     }
 
-    pub fn step_alpha(self, cx: &AppContext, step: ColorScaleStep) -> Hsla {
+    pub fn step_alpha(&self, cx: &AppContext, step: ColorScaleStep) -> Hsla {
         let appearance = Self::current_appearance(cx);
         match appearance {
             Appearance::Light => self.light_alpha(step),
diff --git a/crates/theme2/src/theme2.rs b/crates/theme2/src/theme2.rs
index 66d70296d25579310ee4576efc8614e72f915b50..9425593070b57f391208fdca2b70dfd111544717 100644
--- a/crates/theme2/src/theme2.rs
+++ b/crates/theme2/src/theme2.rs
@@ -4,7 +4,9 @@ mod scale;
 mod settings;
 mod themes;
 
+pub use default::*;
 pub use registry::*;
+pub use scale::*;
 pub use settings::*;
 
 use gpui2::{AppContext, HighlightStyle, Hsla, SharedString};