diff --git a/crates/storybook2/src/stories/elements.rs b/crates/storybook2/src/stories/elements.rs index 4922869fb3..5579cff93e 100644 --- a/crates/storybook2/src/stories/elements.rs +++ b/crates/storybook2/src/stories/elements.rs @@ -1,2 +1,3 @@ +pub mod avatar; pub mod icon; pub mod label; diff --git a/crates/storybook2/src/stories/elements/avatar.rs b/crates/storybook2/src/stories/elements/avatar.rs new file mode 100644 index 0000000000..0d1fff568f --- /dev/null +++ b/crates/storybook2/src/stories/elements/avatar.rs @@ -0,0 +1,33 @@ +use std::marker::PhantomData; + +use crate::ui::prelude::*; +use crate::ui::Avatar; + +use crate::story::Story; + +#[derive(Element)] +pub struct AvatarStory { + state_type: PhantomData, +} + +impl AvatarStory { + pub fn new() -> Self { + Self { + state_type: PhantomData, + } + } + + fn render(&mut self, cx: &mut ViewContext) -> impl Element { + Story::container(cx) + .child(Story::title_for::<_, Avatar>(cx)) + .child(Story::label(cx, "Default")) + .child(Avatar::new( + "https://avatars.githubusercontent.com/u/1714999?v=4", + )) + .child(Story::label(cx, "Rounded rectangle")) + .child( + Avatar::new("https://avatars.githubusercontent.com/u/1714999?v=4") + .shape(Shape::RoundedRectangle), + ) + } +} diff --git a/crates/storybook2/src/story_selector.rs b/crates/storybook2/src/story_selector.rs index e390801b35..ac3d359da3 100644 --- a/crates/storybook2/src/story_selector.rs +++ b/crates/storybook2/src/story_selector.rs @@ -12,6 +12,7 @@ use crate::ui::prelude::*; #[derive(Debug, PartialEq, Eq, Clone, Copy, strum::Display, EnumString, EnumIter)] #[strum(serialize_all = "snake_case")] pub enum ElementStory { + Avatar, Icon, Label, } @@ -21,6 +22,7 @@ impl ElementStory { use crate::stories::elements; match self { + Self::Avatar => elements::avatar::AvatarStory::new().into_any(), Self::Icon => elements::icon::IconStory::new().into_any(), Self::Label => elements::label::LabelStory::new().into_any(), } diff --git a/crates/storybook2/src/ui/elements.rs b/crates/storybook2/src/ui/elements.rs index c42a91a48f..9b60d3d40f 100644 --- a/crates/storybook2/src/ui/elements.rs +++ b/crates/storybook2/src/ui/elements.rs @@ -1,7 +1,9 @@ +mod avatar; mod icon; mod label; mod stack; +pub use avatar::*; pub use icon::*; pub use label::*; pub use stack::*; diff --git a/crates/storybook2/src/ui/elements/avatar.rs b/crates/storybook2/src/ui/elements/avatar.rs new file mode 100644 index 0000000000..e86a0e1710 --- /dev/null +++ b/crates/storybook2/src/ui/elements/avatar.rs @@ -0,0 +1,44 @@ +use std::marker::PhantomData; + +use gpui3::{img, ArcCow}; + +use crate::theme::theme; +use crate::ui::prelude::*; + +#[derive(Element, Clone)] +pub struct Avatar { + state_type: PhantomData, + src: ArcCow<'static, str>, + shape: Shape, +} + +impl Avatar { + pub fn new(src: impl Into>) -> Self { + Self { + state_type: PhantomData, + src: src.into(), + shape: Shape::Circle, + } + } + + pub fn shape(mut self, shape: Shape) -> Self { + self.shape = shape; + self + } + + fn render(&mut self, cx: &mut ViewContext) -> impl Element { + let theme = theme(cx); + + let mut img = img(); + + if self.shape == Shape::Circle { + img = img.rounded_full(); + } else { + img = img.rounded_md(); + } + + img.uri(self.src.clone()) + .size_4() + .fill(theme.middle.warning.default.foreground) + } +} diff --git a/crates/storybook2/src/ui/prelude.rs b/crates/storybook2/src/ui/prelude.rs index 646567fa73..65b2f50647 100644 --- a/crates/storybook2/src/ui/prelude.rs +++ b/crates/storybook2/src/ui/prelude.rs @@ -3,3 +3,12 @@ pub use gpui3::{ }; pub use crate::ui::{HackyChildren, HackyChildrenPayload}; + +use strum::EnumIter; + +#[derive(Debug, Default, PartialEq, Eq, PartialOrd, Ord, Hash, Clone, Copy, EnumIter)] +pub enum Shape { + #[default] + Circle, + RoundedRectangle, +}