From 74ac6eb8a301db40ba8febd5490674ae23b8c280 Mon Sep 17 00:00:00 2001 From: Marshall Bowers Date: Mon, 2 Oct 2023 18:59:44 -0400 Subject: [PATCH] Begin building out new `ui` crate in `storybook2` --- Cargo.lock | 3 ++ crates/storybook2/Cargo.toml | 3 ++ crates/storybook2/src/storybook2.rs | 1 + crates/storybook2/src/ui.rs | 6 ++++ crates/storybook2/src/ui/components.rs | 0 crates/storybook2/src/ui/elements.rs | 3 ++ crates/storybook2/src/ui/elements/stack.rs | 31 ++++++++++++++++ crates/storybook2/src/ui/prelude.rs | 1 + crates/storybook2/src/workspace.rs | 41 +++++++++++++++++++--- 9 files changed, 85 insertions(+), 4 deletions(-) create mode 100644 crates/storybook2/src/ui.rs create mode 100644 crates/storybook2/src/ui/components.rs create mode 100644 crates/storybook2/src/ui/elements.rs create mode 100644 crates/storybook2/src/ui/elements/stack.rs create mode 100644 crates/storybook2/src/ui/prelude.rs diff --git a/Cargo.lock b/Cargo.lock index 30b21d5df51f1ae28120285f32e2345f38e31f18..8a6750bcd89c9f76f55fb0b55bea08e73b7771a4 100644 --- a/Cargo.lock +++ b/Cargo.lock @@ -7613,12 +7613,15 @@ version = "0.1.0" dependencies = [ "anyhow", "backtrace-on-stack-overflow", + "clap 4.4.6", "gpui3", + "itertools 0.11.0", "log", "rust-embed", "serde", "settings", "simplelog", + "strum", "theme", "util", ] diff --git a/crates/storybook2/Cargo.toml b/crates/storybook2/Cargo.toml index bd984c54c139aa264070b087f11a61f6bce0cac8..1afcf1e298e47c3a62678282223fbc6ef2d48480 100644 --- a/crates/storybook2/Cargo.toml +++ b/crates/storybook2/Cargo.toml @@ -12,12 +12,15 @@ path = "src/storybook2.rs" anyhow.workspace = true # TODO: Remove after diagnosing stack overflow. backtrace-on-stack-overflow = "0.3.0" +clap = { version = "4.4", features = ["derive", "string"] } gpui3 = { path = "../gpui3" } +itertools = "0.11.0" log.workspace = true rust-embed.workspace = true serde.workspace = true settings = { path = "../settings" } simplelog = "0.9" +strum = { version = "0.25.0", features = ["derive"] } theme = { path = "../theme" } util = { path = "../util" } diff --git a/crates/storybook2/src/storybook2.rs b/crates/storybook2/src/storybook2.rs index 4e93b75ef4d1c1b04f4ae1707e4dad24380e3d0a..6e0974d8a2a88ae4071ab7babcbde5114817a44e 100644 --- a/crates/storybook2/src/storybook2.rs +++ b/crates/storybook2/src/storybook2.rs @@ -7,6 +7,7 @@ use simplelog::SimpleLogger; mod collab_panel; mod theme; mod themes; +mod ui; mod workspace; // gpui2::actions! { diff --git a/crates/storybook2/src/ui.rs b/crates/storybook2/src/ui.rs new file mode 100644 index 0000000000000000000000000000000000000000..ef6bc60aff8fef703cc74567cf33d8dc2e809578 --- /dev/null +++ b/crates/storybook2/src/ui.rs @@ -0,0 +1,6 @@ +pub mod prelude; +mod components; +mod elements; + +pub use components::*; +pub use elements::*; diff --git a/crates/storybook2/src/ui/components.rs b/crates/storybook2/src/ui/components.rs new file mode 100644 index 0000000000000000000000000000000000000000..e69de29bb2d1d6434b8b29ae775ad8c2e48c5391 diff --git a/crates/storybook2/src/ui/elements.rs b/crates/storybook2/src/ui/elements.rs new file mode 100644 index 0000000000000000000000000000000000000000..b21354ddfa7ceb66c02e98657578e662a29e38f9 --- /dev/null +++ b/crates/storybook2/src/ui/elements.rs @@ -0,0 +1,3 @@ +mod stack; + +pub use stack::*; diff --git a/crates/storybook2/src/ui/elements/stack.rs b/crates/storybook2/src/ui/elements/stack.rs new file mode 100644 index 0000000000000000000000000000000000000000..e796297159866fc1ee25d59a87477f98f7d22830 --- /dev/null +++ b/crates/storybook2/src/ui/elements/stack.rs @@ -0,0 +1,31 @@ +use gpui3::{div, Div}; + +use crate::ui::prelude::*; + +pub trait Stack: StyleHelpers { + /// Horizontally stacks elements. + fn h_stack(self) -> Self { + self.flex().flex_row().items_center() + } + + /// Vertically stacks elements. + fn v_stack(self) -> Self { + self.flex().flex_col() + } +} + +impl Stack for Div {} + +/// Horizontally stacks elements. +/// +/// Sets `flex()`, `flex_row()`, `items_center()` +pub fn h_stack() -> Div { + div().h_stack() +} + +/// Vertically stacks elements. +/// +/// Sets `flex()`, `flex_col()` +pub fn v_stack() -> Div { + div().v_stack() +} diff --git a/crates/storybook2/src/ui/prelude.rs b/crates/storybook2/src/ui/prelude.rs new file mode 100644 index 0000000000000000000000000000000000000000..a6243621a67af01edf1e812183b1c950291a92a0 --- /dev/null +++ b/crates/storybook2/src/ui/prelude.rs @@ -0,0 +1 @@ +pub use gpui3::StyleHelpers; diff --git a/crates/storybook2/src/workspace.rs b/crates/storybook2/src/workspace.rs index adc091b4b9047091723dc5819ce5e70feea9a91d..fbe97698e0b3fa6dade311313834fc65c571e037 100644 --- a/crates/storybook2/src/workspace.rs +++ b/crates/storybook2/src/workspace.rs @@ -1,3 +1,4 @@ +use crate::ui::Stack; use crate::{ collab_panel::{collab_panel, CollabPanel}, theme::theme, @@ -27,12 +28,44 @@ impl Workspace { fn render(&mut self, cx: &mut ViewContext) -> impl Element { let theme = rose_pine_dawn(); + div() - .font("Helvetica") - .text_base() .size_full() - .fill(theme.middle.positive.default.background) - .child("Hello world") + .v_stack() + .fill(theme.lowest.base.default.background) + .child( + div() + .size_full() + .flex() + .fill(theme.middle.positive.default.background), + ) + .child( + div() + .size_full() + .h_stack() + .gap_3() + .children((0..4).map(|i| { + div().size_full().flex().fill(gpui3::hsla( + 0. + (i as f32 / 7.), + 0. + (i as f32 / 5.), + 0.5, + 1., + )) + })), + ) + .child( + div() + .size_full() + .flex() + .fill(theme.middle.negative.default.background), + ) + + // div() + // .font("Helvetica") + // .text_base() + // .size_full() + // .fill(theme.middle.positive.default.background) + // .child("Hello world") // TODO: Implement style. //.size_full().fill(gpui3::hsla(0.83, 1., 0.5, 1.))