oak-team/oak-gpui
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Extract Story into separate story crate (#3378)

Browse Source 
This PR extracts the `Story` component into a separate `story` crate so
that it can be shared among various crates that define stories.

Release Notes:

- N/A

---------

Co-authored-by: Nate Butler <iamnbutler@gmail.com>
This commit is contained in:
Marshall Bowers
2023-11-21 13:42:00 -05:00
committed by GitHub
co-authored by Nate Butler
parent f4b4bdfd83
commit 1b05aad30c
26 changed files with 309 additions and 316 deletions
Download Patch File Download Diff File Expand all files Collapse all files
crates/ui2/src/components/stories/avatar.rs
+5 -4
View File
@@ -1,7 +1,8 @@
use gpui::{Div, Render};
use story::Story;
use crate::prelude::*;
use crate::{Avatar, Story};
use crate::Avatar;
pub struct AvatarStory;
@@ -9,9 +10,9 @@ impl Render for AvatarStory {
type Element = Div;
fn render(&mut self, cx: &mut ViewContext<Self>) -> Self::Element {
Story::container(cx)
.child(Story::title_for::<Avatar>(cx))
.child(Story::label(cx, "Default"))
Story::container()
.child(Story::title_for::<Avatar>())
.child(Story::label("Default"))
.child(Avatar::new(
"https://avatars.githubusercontent.com/u/1714999?v=4",
))
crates/ui2/src/components/stories/button.rs
+14 -13
View File
@@ -1,8 +1,9 @@
use gpui::{rems, Div, Render};
use story::Story;
use strum::IntoEnumIterator;
use crate::prelude::*;
use crate::{h_stack, v_stack, Button, Icon, IconPosition, Label, Story};
use crate::{h_stack, v_stack, Button, Icon, IconPosition, Label};
pub struct ButtonStory;
@@ -12,15 +13,15 @@ impl Render for ButtonStory {
fn render(&mut self, cx: &mut ViewContext<Self>) -> Self::Element {
let states = InteractionState::iter();
Story::container(cx)
.child(Story::title_for::<Button>(cx))
Story::container()
.child(Story::title_for::<Button>())
.child(
div()
.flex()
.gap_8()
.child(
div()
.child(Story::label(cx, "Ghost (Default)"))
.child(Story::label("Ghost (Default)"))
.child(h_stack().gap_2().children(states.clone().map(|state| {
v_stack()
.gap_1()
@@ -29,7 +30,7 @@ impl Render for ButtonStory {
Button::new("Label").variant(ButtonVariant::Ghost), // .state(state),
)
})))
.child(Story::label(cx, "Ghost – Left Icon"))
.child(Story::label("Ghost – Left Icon"))
.child(h_stack().gap_2().children(states.clone().map(|state| {
v_stack()
.gap_1()
@@ -41,7 +42,7 @@ impl Render for ButtonStory {
.icon_position(IconPosition::Left), // .state(state),
)
})))
.child(Story::label(cx, "Ghost – Right Icon"))
.child(Story::label("Ghost – Right Icon"))
.child(h_stack().gap_2().children(states.clone().map(|state| {
v_stack()
.gap_1()
@@ -56,7 +57,7 @@ impl Render for ButtonStory {
)
.child(
div()
.child(Story::label(cx, "Filled"))
.child(Story::label("Filled"))
.child(h_stack().gap_2().children(states.clone().map(|state| {
v_stack()
.gap_1()
@@ -65,7 +66,7 @@ impl Render for ButtonStory {
Button::new("Label").variant(ButtonVariant::Filled), // .state(state),
)
})))
.child(Story::label(cx, "Filled – Left Button"))
.child(Story::label("Filled – Left Button"))
.child(h_stack().gap_2().children(states.clone().map(|state| {
v_stack()
.gap_1()
@@ -77,7 +78,7 @@ impl Render for ButtonStory {
.icon_position(IconPosition::Left), // .state(state),
)
})))
.child(Story::label(cx, "Filled – Right Button"))
.child(Story::label("Filled – Right Button"))
.child(h_stack().gap_2().children(states.clone().map(|state| {
v_stack()
.gap_1()
@@ -92,7 +93,7 @@ impl Render for ButtonStory {
)
.child(
div()
.child(Story::label(cx, "Fixed With"))
.child(Story::label("Fixed With"))
.child(h_stack().gap_2().children(states.clone().map(|state| {
v_stack()
.gap_1()
@@ -104,7 +105,7 @@ impl Render for ButtonStory {
.width(Some(rems(6.).into())),
)
})))
.child(Story::label(cx, "Fixed With – Left Icon"))
.child(Story::label("Fixed With – Left Icon"))
.child(h_stack().gap_2().children(states.clone().map(|state| {
v_stack()
.gap_1()
@@ -118,7 +119,7 @@ impl Render for ButtonStory {
.width(Some(rems(6.).into())),
)
})))
.child(Story::label(cx, "Fixed With – Right Icon"))
.child(Story::label("Fixed With – Right Icon"))
.child(h_stack().gap_2().children(states.clone().map(|state| {
v_stack()
.gap_1()
@@ -134,7 +135,7 @@ impl Render for ButtonStory {
}))),
),
)
.child(Story::label(cx, "Button with `on_click`"))
.child(Story::label("Button with `on_click`"))
.child(
Button::new("Label")
.variant(ButtonVariant::Ghost)
crates/ui2/src/components/stories/checkbox.rs
+6 -5
View File
@@ -1,7 +1,8 @@
use gpui::{Div, Render, ViewContext};
use story::Story;
use crate::prelude::*;
use crate::{h_stack, Checkbox, Story};
use crate::{h_stack, Checkbox};
pub struct CheckboxStory;
@@ -9,9 +10,9 @@ impl Render for CheckboxStory {
type Element = Div;
fn render(&mut self, cx: &mut ViewContext<Self>) -> Self::Element {
Story::container(cx)
.child(Story::title_for::<Checkbox>(cx))
.child(Story::label(cx, "Default"))
Story::container()
.child(Story::title_for::<Checkbox>())
.child(Story::label("Default"))
.child(
h_stack()
.p_2()
@@ -26,7 +27,7 @@ impl Render for CheckboxStory {
))
.child(Checkbox::new("checkbox-selected", Selection::Selected)),
)
.child(Story::label(cx, "Disabled"))
.child(Story::label("Disabled"))
.child(
h_stack()
.p_2()
crates/ui2/src/components/stories/context_menu.rs
+3 -2
View File
@@ -1,7 +1,8 @@
use gpui::{actions, Action, AnchorCorner, Div, Render, View};
use story::Story;
use crate::prelude::*;
use crate::{menu_handle, ContextMenu, Label, ListItem, Story};
use crate::{menu_handle, ContextMenu, Label, ListItem};
actions!(PrintCurrentDate, PrintBestFood);
@@ -29,7 +30,7 @@ impl Render for ContextMenuStory {
type Element = Div;
fn render(&mut self, cx: &mut ViewContext<Self>) -> Self::Element {
Story::container(cx)
Story::container()
.on_action(|_: &PrintCurrentDate, _| {
println!("printing unix time!");
if let Ok(unix_time) = std::time::UNIX_EPOCH.elapsed() {
crates/ui2/src/components/stories/icon.rs
+5 -4
View File
@@ -1,8 +1,9 @@
use gpui::{Div, Render};
use story::Story;
use strum::IntoEnumIterator;
use crate::prelude::*;
use crate::{Icon, IconElement, Story};
use crate::{Icon, IconElement};
pub struct IconStory;
@@ -12,9 +13,9 @@ impl Render for IconStory {
fn render(&mut self, cx: &mut ViewContext<Self>) -> Self::Element {
let icons = Icon::iter();
Story::container(cx)
.child(Story::title_for::<IconElement>(cx))
.child(Story::label(cx, "All Icons"))
Story::container()
.child(Story::title_for::<IconElement>())
.child(Story::label("All Icons"))
.child(div().flex().gap_3().children(icons.map(IconElement::new)))
}
}
crates/ui2/src/components/stories/input.rs
+5 -4
View File
@@ -1,7 +1,8 @@
use gpui::{Div, Render};
use story::Story;
use crate::prelude::*;
use crate::{Input, Story};
use crate::Input;
pub struct InputStory;
@@ -9,9 +10,9 @@ impl Render for InputStory {
type Element = Div;
fn render(&mut self, cx: &mut ViewContext<Self>) -> Self::Element {
Story::container(cx)
.child(Story::title_for::<Input>(cx))
.child(Story::label(cx, "Default"))
Story::container()
.child(Story::title_for::<Input>())
.child(Story::label("Default"))
.child(div().flex().child(Input::new("Search")))
}
}
crates/ui2/src/components/stories/keybinding.rs
+10 -9
View File
@@ -1,8 +1,9 @@
use gpui::{actions, Div, Render};
use itertools::Itertools;
use story::Story;
use crate::prelude::*;
use crate::{KeyBinding, Story};
use crate::KeyBinding;
pub struct KeybindingStory;
@@ -18,11 +19,11 @@ impl Render for KeybindingStory {
fn render(&mut self, cx: &mut ViewContext<Self>) -> Self::Element {
let all_modifier_permutations = ["ctrl", "alt", "cmd", "shift"].into_iter().permutations(2);
Story::container(cx)
.child(Story::title_for::<KeyBinding>(cx))
.child(Story::label(cx, "Single Key"))
Story::container()
.child(Story::title_for::<KeyBinding>())
.child(Story::label("Single Key"))
.child(KeyBinding::new(binding("Z")))
.child(Story::label(cx, "Single Key with Modifier"))
.child(Story::label("Single Key with Modifier"))
.child(
div()
.flex()
@@ -32,7 +33,7 @@ impl Render for KeybindingStory {
.child(KeyBinding::new(binding("cmd-c")))
.child(KeyBinding::new(binding("shift-c"))),
)
.child(Story::label(cx, "Single Key with Modifier (Permuted)"))
.child(Story::label("Single Key with Modifier (Permuted)"))
.child(
div().flex().flex_col().children(
all_modifier_permutations
@@ -49,11 +50,11 @@ impl Render for KeybindingStory {
}),
),
)
.child(Story::label(cx, "Single Key with All Modifiers"))
.child(Story::label("Single Key with All Modifiers"))
.child(KeyBinding::new(binding("ctrl-alt-cmd-shift-z")))
.child(Story::label(cx, "Chord"))
.child(Story::label("Chord"))
.child(KeyBinding::new(binding("a z")))
.child(Story::label(cx, "Chord with Modifier"))
.child(Story::label("Chord with Modifier"))
.child(KeyBinding::new(binding("ctrl-a shift-z")))
.child(KeyBinding::new(binding("fn-s")))
}
crates/ui2/src/components/stories/label.rs
+6 -5
View File
@@ -1,7 +1,8 @@
use gpui::{Div, Render};
use story::Story;
use crate::prelude::*;
use crate::{HighlightedLabel, Label, Story};
use crate::{HighlightedLabel, Label};
pub struct LabelStory;
@@ -9,11 +10,11 @@ impl Render for LabelStory {
type Element = Div;
fn render(&mut self, cx: &mut ViewContext<Self>) -> Self::Element {
Story::container(cx)
.child(Story::title_for::<Label>(cx))
.child(Story::label(cx, "Default"))
Story::container()
.child(Story::title_for::<Label>())
.child(Story::label("Default"))
.child(Label::new("Hello, world!"))
.child(Story::label(cx, "Highlighted"))
.child(Story::label("Highlighted"))
.child(HighlightedLabel::new(
"Hello, world!",
vec![0, 1, 2, 7, 8, 12],
crates/ui2/src/story.rs
-37
View File
@@ -1,37 +0,0 @@
use gpui::Div;
use crate::prelude::*;
pub struct Story {}
impl Story {
pub fn container(cx: &mut gpui::WindowContext) -> Div {
div()
.size_full()
.flex()
.flex_col()
.pt_2()
.px_4()
.bg(cx.theme().colors().background)
}
pub fn title(cx: &mut WindowContext, title: impl Into<SharedString>) -> impl Element {
div()
.text_xl()
.text_color(cx.theme().colors().text)
.child(title.into())
}
pub fn title_for<T>(cx: &mut WindowContext) -> impl Element {
Self::title(cx, std::any::type_name::<T>())
}
pub fn label(cx: &mut WindowContext, label: impl Into<SharedString>) -> impl Element {
div()
.mt_4()
.mb_2()
.text_xs()
.text_color(cx.theme().colors().text)
.child(label.into())
}
}
crates/ui2/src/ui2.rs
-5
View File
@@ -24,8 +24,3 @@ pub use components::*;
pub use prelude::*;
pub use styled_ext::*;
pub use styles::*;
#[cfg(feature = "stories")]
mod story;
#[cfg(feature = "stories")]
pub use story::*;