Yehowshua/ZIm
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix storybook (#3379)

Browse source 
This PR fixes storybook and gets it back into a compiling and running
state.

Release Notes:

- N/A
This commit is contained in:
Marshall Bowers 2023-11-21 14:28:00 -05:00 • committed by GitHub
parent 6fe7b22164
commit a94cf54aab
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
15 changed files with 123 additions and 231 deletions
Download patch file Download diff file Expand all files Collapse all files

2
crates/storybook2/src/stories.rs
View file

@ -1,4 +1,3 @@
mod colors;
mod focus;
mod kitchen_sink;
mod picker;
@ -6,7 +5,6 @@ mod scroll;
mod text;
mod z_index;
pub use colors::*;
pub use focus::*;
pub use kitchen_sink::*;
pub use picker::*;

8
crates/storybook2/src/stories/focus.rs
View file

@ -26,7 +26,7 @@ impl FocusStory {
}
}
impl Render<Self> for FocusStory {
impl Render for FocusStory {
type Element = Focusable<Stateful<Div>>;
fn render(&mut self, cx: &mut gpui::ViewContext<Self>) -> Self::Element {
@ -52,10 +52,8 @@ impl Render<Self> for FocusStory {
.on_blur(cx.listener(|_, _, _| println!("Parent blurred")))
.on_focus_in(cx.listener(|_, _, _| println!("Parent focus_in")))
.on_focus_out(cx.listener(|_, _, _| println!("Parent focus_out")))
.on_key_down(
cx.listener(|_, event, phase, _| println!("Key down on parent {:?}", event)),
)
.on_key_up(cx.listener(|_, event, phase, _| println!("Key up on parent {:?}", event)))
.on_key_down(cx.listener(|_, event, _| println!("Key down on parent {:?}", event)))
.on_key_up(cx.listener(|_, event, _| println!("Key up on parent {:?}", event)))
.size_full()
.bg(color_1)
.focus(|style| style.bg(color_2))

10
crates/storybook2/src/stories/kitchen_sink.rs
View file

@ -1,8 +1,10 @@
use crate::{story::Story, story_selector::ComponentStory};
use gpui::{prelude::*, Div, Render, Stateful, View};
use story::Story;
use strum::IntoEnumIterator;
use ui::prelude::*;
use crate::story_selector::ComponentStory;
pub struct KitchenSinkStory;
impl KitchenSinkStory {
@ -19,11 +21,11 @@ impl Render for KitchenSinkStory {
.map(|selector| selector.story(cx))
.collect::<Vec<_>>();
Story::container(cx)
Story::container()
.id("kitchen-sink")
.overflow_y_scroll()
.child(Story::title(cx, "Kitchen Sink"))
.child(Story::label(cx, "Components"))
.child(Story::title("Kitchen Sink"))
.child(Story::label("Components"))
.child(div().flex().flex_col().children(component_stories))
// Add a bit of space at the bottom of the kitchen sink so elements
// don't end up squished right up against the bottom of the screen.

6
crates/storybook2/src/stories/picker.rs
View file

@ -36,7 +36,7 @@ impl Delegate {
}
impl PickerDelegate for Delegate {
type ListItem = Div<Picker<Self>>;
type ListItem = Div;
fn match_count(&self) -> usize {
self.candidates.len()
@ -205,8 +205,8 @@ impl PickerStory {
}
}
impl Render<Self> for PickerStory {
type Element = Div<Self>;
impl Render for PickerStory {
type Element = Div;
fn render(&mut self, cx: &mut gpui::ViewContext<Self>) -> Self::Element {
div()

6
crates/storybook2/src/stories/scroll.rs
View file

@ -10,8 +10,8 @@ impl ScrollStory {
}
}
impl Render<Self> for ScrollStory {
type Element = Stateful<Self, Div<Self>>;
impl Render for ScrollStory {
type Element = Stateful<Div>;
fn render(&mut self, cx: &mut gpui::ViewContext<Self>) -> Self::Element {
let theme = cx.theme();
@ -38,7 +38,7 @@ impl Render<Self> for ScrollStory {
};
div()
.id(id)
.tooltip(move |_, cx| Tooltip::text(format!("{}, {}", row, column), cx))
.tooltip(move |cx| Tooltip::text(format!("{}, {}", row, column), cx))
.bg(bg)
.size(px(100. as f32))
.when(row >= 5 && column >= 5, |d| {

85
crates/storybook2/src/stories/z_index.rs
View file

@ -1,52 +1,49 @@
use gpui::{px, rgb, Div, Hsla, Render, RenderOnce};
use story::Story;
use ui::prelude::*;
use crate::story::Story;
/// A reimplementation of the MDN `z-index` example, found here:
/// [https://developer.mozilla.org/en-US/docs/Web/CSS/z-index](https://developer.mozilla.org/en-US/docs/Web/CSS/z-index).
pub struct ZIndexStory;
impl Render<Self> for ZIndexStory {
type Element = Div<Self>;
impl Render for ZIndexStory {
type Element = Div;
fn render(&mut self, cx: &mut ViewContext<Self>) -> Self::Element {
Story::container(cx)
.child(Story::title(cx, "z-index"))
.child(
div()
.flex()
.child(
div()
.w(px(250.))
.child(Story::label(cx, "z-index: auto"))
.child(ZIndexExample::new(0)),
)
.child(
div()
.w(px(250.))
.child(Story::label(cx, "z-index: 1"))
.child(ZIndexExample::new(1)),
)
.child(
div()
.w(px(250.))
.child(Story::label(cx, "z-index: 3"))
.child(ZIndexExample::new(3)),
)
.child(
div()
.w(px(250.))
.child(Story::label(cx, "z-index: 5"))
.child(ZIndexExample::new(5)),
)
.child(
div()
.w(px(250.))
.child(Story::label(cx, "z-index: 7"))
.child(ZIndexExample::new(7)),
),
)
Story::container().child(Story::title("z-index")).child(
div()
.flex()
.child(
div()
.w(px(250.))
.child(Story::label("z-index: auto"))
.child(ZIndexExample::new(0)),
)
.child(
div()
.w(px(250.))
.child(Story::label("z-index: 1"))
.child(ZIndexExample::new(1)),
)
.child(
div()
.w(px(250.))
.child(Story::label("z-index: 3"))
.child(ZIndexExample::new(3)),
)
.child(
div()
.w(px(250.))
.child(Story::label("z-index: 5"))
.child(ZIndexExample::new(5)),
)
.child(
div()
.w(px(250.))
.child(Story::label("z-index: 7"))
.child(ZIndexExample::new(7)),
),
)
}
}
@ -77,17 +74,17 @@ trait Styles: Styled + Sized {
}
}
impl<V: 'static> Styles for Div<V> {}
impl Styles for Div {}
#[derive(RenderOnce)]
struct ZIndexExample {
z_index: u32,
}
impl<V: 'static> Component<V> for ZIndexExample {
type Rendered = Div<V>;
impl Component for ZIndexExample {
type Rendered = Div;
fn render(self, view: &mut V, cx: &mut ViewContext<V>) -> Self::Rendered {
fn render(self, cx: &mut WindowContext) -> Self::Rendered {
div()
.relative()
.size_full()

1
crates/storybook2/src/story.rs
View file

@ -1 +0,0 @@
pub use ui::Story;

56
crates/storybook2/src/story_selector.rs
View file

@ -8,49 +8,22 @@ use clap::ValueEnum;
use gpui::{AnyView, VisualContext};
use strum::{EnumIter, EnumString, IntoEnumIterator};
use ui::prelude::*;
use ui::{AvatarStory, ButtonStory, DetailsStory, IconStory, InputStory, LabelStory};
use ui::{AvatarStory, ButtonStory, IconStory, InputStory, LabelStory};
#[derive(Debug, PartialEq, Eq, Clone, Copy, strum::Display, EnumString, EnumIter)]
#[strum(serialize_all = "snake_case")]
pub enum ComponentStory {
AssistantPanel,
Avatar,
Breadcrumb,
Buffer,
Button,
ChatPanel,
Checkbox,
CollabPanel,
Colors,
CommandPalette,
ContextMenu,
Copilot,
Details,
Facepile,
Focus,
Icon,
Input,
Keybinding,
Label,
LanguageSelector,
MultiBuffer,
NotificationsPanel,
Palette,
Panel,
ProjectPanel,
Players,
RecentProjects,
Scroll,
Tab,
TabBar,
Terminal,
Text,
ThemeSelector,
TitleBar,
Toast,
Toolbar,
TrafficLights,
Workspace,
ZIndex,
Picker,
}
@ -58,44 +31,17 @@ pub enum ComponentStory {
impl ComponentStory {
pub fn story(&self, cx: &mut WindowContext) -> AnyView {
match self {
Self::AssistantPanel => cx.build_view(|_| ui::AssistantPanelStory).into(),
Self::Avatar => cx.build_view(|_| AvatarStory).into(),
Self::Breadcrumb => cx.build_view(|_| ui::BreadcrumbStory).into(),
Self::Buffer => cx.build_view(|_| ui::BufferStory).into(),
Self::Button => cx.build_view(|_| ButtonStory).into(),
Self::ChatPanel => cx.build_view(|_| ui::ChatPanelStory).into(),
Self::Checkbox => cx.build_view(|_| ui::CheckboxStory).into(),
Self::CollabPanel => cx.build_view(|_| ui::CollabPanelStory).into(),
Self::Colors => cx.build_view(|_| ColorsStory).into(),
Self::CommandPalette => cx.build_view(|_| ui::CommandPaletteStory).into(),
Self::ContextMenu => cx.build_view(|_| ui::ContextMenuStory).into(),
Self::Copilot => cx.build_view(|_| ui::CopilotModalStory).into(),
Self::Details => cx.build_view(|_| DetailsStory).into(),
Self::Facepile => cx.build_view(|_| ui::FacepileStory).into(),
Self::Focus => FocusStory::view(cx).into(),
Self::Icon => cx.build_view(|_| IconStory).into(),
Self::Input => cx.build_view(|_| InputStory).into(),
Self::Keybinding => cx.build_view(|_| ui::KeybindingStory).into(),
Self::Label => cx.build_view(|_| LabelStory).into(),
Self::LanguageSelector => cx.build_view(|_| ui::LanguageSelectorStory).into(),
Self::MultiBuffer => cx.build_view(|_| ui::MultiBufferStory).into(),
Self::NotificationsPanel => cx.build_view(|cx| ui::NotificationsPanelStory).into(),
Self::Palette => cx.build_view(|cx| ui::PaletteStory).into(),
Self::Players => cx.build_view(|_| theme2::PlayerStory).into(),
Self::Panel => cx.build_view(|cx| ui::PanelStory).into(),
Self::ProjectPanel => cx.build_view(|_| ui::ProjectPanelStory).into(),
Self::RecentProjects => cx.build_view(|_| ui::RecentProjectsStory).into(),
Self::Scroll => ScrollStory::view(cx).into(),
Self::Tab => cx.build_view(|_| ui::TabStory).into(),
Self::TabBar => cx.build_view(|_| ui::TabBarStory).into(),
Self::Terminal => cx.build_view(|_| ui::TerminalStory).into(),
Self::Text => TextStory::view(cx).into(),
Self::ThemeSelector => cx.build_view(|_| ui::ThemeSelectorStory).into(),
Self::TitleBar => ui::TitleBarStory::view(cx).into(),
Self::Toast => cx.build_view(|_| ui::ToastStory).into(),
Self::Toolbar => cx.build_view(|_| ui::ToolbarStory).into(),
Self::TrafficLights => cx.build_view(|_| ui::TrafficLightsStory).into(),
Self::Workspace => ui::WorkspaceStory::view(cx).into(),
Self::ZIndex => cx.build_view(|_| ZIndexStory).into(),
Self::Picker => PickerStory::new(cx).into(),
}

10
crates/storybook2/src/storybook2.rs
View file

@ -2,7 +2,6 @@
mod assets;
mod stories;
mod story;
mod story_selector;
use std::sync::Arc;
@ -15,7 +14,6 @@ use gpui::{
use log::LevelFilter;
use settings2::{default_settings, Settings, SettingsStore};
use simplelog::SimpleLogger;
use story_selector::ComponentStory;
use theme2::{ThemeRegistry, ThemeSettings};
use ui::prelude::*;
@ -62,15 +60,13 @@ fn main() {
theme2::init(theme2::LoadThemes::All, cx);
let selector =
story_selector.unwrap_or(StorySelector::Component(ComponentStory::Workspace));
let selector = story_selector.unwrap_or(StorySelector::KitchenSink);
let theme_registry = cx.global::<ThemeRegistry>();
let mut theme_settings = ThemeSettings::get_global(cx).clone();
theme_settings.active_theme = theme_registry.get(&theme_name).unwrap();
ThemeSettings::override_global(theme_settings, cx);
ui::settings::init(cx);
language::init(cx);
editor::init(cx);
@ -105,8 +101,8 @@ impl StoryWrapper {
}
}
impl Render<Self> for StoryWrapper {
type Element = Div<Self>;
impl Render for StoryWrapper {
type Element = Div;
fn render(&mut self, cx: &mut ViewContext<Self>) -> Self::Element {
div()