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

gpui: Add a standard text example (#30747)

Browse source 
This is a dumb first pass at a standard text example. We'll use this to
start digging in to some text/scale rendering issues.

There will be a ton of follow-up features to this, but starting simple.

Release Notes:

- N/A
This commit is contained in:
Nate Butler 2025-05-16 17:35:44 +02:00 • committed by GitHub
parent 9dabf491f0
commit e26620d1cf
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
30 changed files with 606 additions and 362 deletions
Download patch file Download diff file Expand all files Collapse all files

4
crates/ui/src/components/stories/context_menu.rs
View file

@ -26,8 +26,8 @@ fn build_menu(
pub struct ContextMenuStory;
impl Render for ContextMenuStory {
fn render(&mut self, _window: &mut Window, _cx: &mut Context<Self>) -> impl IntoElement {
Story::container()
fn render(&mut self, _window: &mut Window, cx: &mut Context<Self>) -> impl IntoElement {
Story::container(cx)
.on_action(|_: &PrintCurrentDate, _, _| {
println!("printing unix time!");
if let Ok(unix_time) = std::time::UNIX_EPOCH.elapsed() {

6
crates/ui/src/components/stories/disclosure.rs
View file

@ -7,9 +7,9 @@ use crate::prelude::*;
pub struct DisclosureStory;
impl Render for DisclosureStory {
fn render(&mut self, _window: &mut Window, _cx: &mut Context<Self>) -> impl IntoElement {
Story::container()
.child(Story::title_for::<Disclosure>())
fn render(&mut self, _window: &mut Window, cx: &mut Context<Self>) -> impl IntoElement {
Story::container(cx)
.child(Story::title_for::<Disclosure>(cx))
.child(Story::label("Toggled"))
.child(Disclosure::new("toggled", true))
.child(Story::label("Not Toggled"))

6
crates/ui/src/components/stories/icon_button.rs
View file

@ -7,7 +7,7 @@ use crate::{IconButtonShape, Tooltip, prelude::*};
pub struct IconButtonStory;
impl Render for IconButtonStory {
fn render(&mut self, _window: &mut Window, _cx: &mut Context<Self>) -> impl IntoElement {
fn render(&mut self, _window: &mut Window, cx: &mut Context<Self>) -> impl IntoElement {
let default_button = StoryItem::new(
"Default",
IconButton::new("default_icon_button", IconName::Hash),
@ -113,8 +113,8 @@ impl Render for IconButtonStory {
selected_with_tooltip_button,
];
Story::container()
.child(Story::title_for::<IconButton>())
Story::container(cx)
.child(Story::title_for::<IconButton>(cx))
.child(StorySection::new().children(buttons))
.child(
StorySection::new().child(StoryItem::new(

28
crates/ui/src/components/stories/keybinding.rs
View file

@ -15,11 +15,11 @@ impl Render for KeybindingStory {
fn render(&mut self, _window: &mut Window, cx: &mut Context<Self>) -> impl IntoElement {
let all_modifier_permutations = ["ctrl", "alt", "cmd", "shift"].into_iter().permutations(2);
Story::container()
.child(Story::title_for::<KeyBinding>())
.child(Story::label("Single Key"))
Story::container(cx)
.child(Story::title_for::<KeyBinding>(cx))
.child(Story::label("Single Key", cx))
.child(KeyBinding::new(binding("Z"), cx))
.child(Story::label("Single Key with Modifier"))
.child(Story::label("Single Key with Modifier", cx))
.child(
div()
.flex()
@ -29,7 +29,7 @@ impl Render for KeybindingStory {
.child(KeyBinding::new(binding("cmd-c"), cx))
.child(KeyBinding::new(binding("shift-c"), cx)),
)
.child(Story::label("Single Key with Modifier (Permuted)"))
.child(Story::label("Single Key with Modifier (Permuted)", cx))
.child(
div().flex().flex_col().children(
all_modifier_permutations
@ -46,33 +46,33 @@ impl Render for KeybindingStory {
}),
),
)
.child(Story::label("Single Key with All Modifiers"))
.child(Story::label("Single Key with All Modifiers", cx))
.child(KeyBinding::new(binding("ctrl-alt-cmd-shift-z"), cx))
.child(Story::label("Chord"))
.child(Story::label("Chord", cx))
.child(KeyBinding::new(binding("a z"), cx))
.child(Story::label("Chord with Modifier"))
.child(Story::label("Chord with Modifier", cx))
.child(KeyBinding::new(binding("ctrl-a shift-z"), cx))
.child(KeyBinding::new(binding("fn-s"), cx))
.child(Story::label("Single Key with All Modifiers (Linux)"))
.child(Story::label("Single Key with All Modifiers (Linux)", cx))
.child(
KeyBinding::new(binding("ctrl-alt-cmd-shift-z"), cx)
.platform_style(PlatformStyle::Linux),
)
.child(Story::label("Chord (Linux)"))
.child(Story::label("Chord (Linux)", cx))
.child(KeyBinding::new(binding("a z"), cx).platform_style(PlatformStyle::Linux))
.child(Story::label("Chord with Modifier (Linux)"))
.child(Story::label("Chord with Modifier (Linux)", cx))
.child(
KeyBinding::new(binding("ctrl-a shift-z"), cx).platform_style(PlatformStyle::Linux),
)
.child(KeyBinding::new(binding("fn-s"), cx).platform_style(PlatformStyle::Linux))
.child(Story::label("Single Key with All Modifiers (Windows)"))
.child(Story::label("Single Key with All Modifiers (Windows)", cx))
.child(
KeyBinding::new(binding("ctrl-alt-cmd-shift-z"), cx)
.platform_style(PlatformStyle::Windows),
)
.child(Story::label("Chord (Windows)"))
.child(Story::label("Chord (Windows)", cx))
.child(KeyBinding::new(binding("a z"), cx).platform_style(PlatformStyle::Windows))
.child(Story::label("Chord with Modifier (Windows)"))
.child(Story::label("Chord with Modifier (Windows)", cx))
.child(
KeyBinding::new(binding("ctrl-a shift-z"), cx)
.platform_style(PlatformStyle::Windows),

10
crates/ui/src/components/stories/list.rs
View file

@ -7,17 +7,17 @@ use crate::{ListHeader, ListSeparator, ListSubHeader, prelude::*};
pub struct ListStory;
impl Render for ListStory {
fn render(&mut self, _window: &mut Window, _cx: &mut Context<Self>) -> impl IntoElement {
Story::container()
.child(Story::title_for::<List>())
.child(Story::label("Default"))
fn render(&mut self, _window: &mut Window, cx: &mut Context<Self>) -> impl IntoElement {
Story::container(cx)
.child(Story::title_for::<List>(cx))
.child(Story::label("Default", cx))
.child(
List::new()
.child(ListItem::new("apple").child("Apple"))
.child(ListItem::new("banana").child("Banana"))
.child(ListItem::new("cherry").child("Cherry")),
)
.child(Story::label("With sections"))
.child(Story::label("With sections", cx))
.child(
List::new()
.header(ListHeader::new("Produce"))

14
crates/ui/src/components/stories/list_header.rs
View file

@ -7,20 +7,20 @@ use crate::{IconName, ListHeader};
pub struct ListHeaderStory;
impl Render for ListHeaderStory {
fn render(&mut self, _window: &mut Window, _cx: &mut Context<Self>) -> impl IntoElement {
Story::container()
.child(Story::title_for::<ListHeader>())
.child(Story::label("Default"))
fn render(&mut self, _window: &mut Window, cx: &mut Context<Self>) -> impl IntoElement {
Story::container(cx)
.child(Story::title_for::<ListHeader>(cx))
.child(Story::label("Default", cx))
.child(ListHeader::new("Section 1"))
.child(Story::label("With left icon"))
.child(Story::label("With left icon", cx))
.child(ListHeader::new("Section 2").start_slot(Icon::new(IconName::Bell)))
.child(Story::label("With left icon and meta"))
.child(Story::label("With left icon and meta", cx))
.child(
ListHeader::new("Section 3")
.start_slot(Icon::new(IconName::BellOff))
.end_slot(IconButton::new("action_1", IconName::Bolt)),
)
.child(Story::label("With multiple meta"))
.child(Story::label("With multiple meta", cx))
.child(
ListHeader::new("Section 4")
.end_slot(IconButton::new("action_1", IconName::Bolt))

27
crates/ui/src/components/stories/list_item.rs
View file

@ -10,12 +10,12 @@ pub struct ListItemStory;
impl Render for ListItemStory {
fn render(&mut self, _: &mut Window, cx: &mut Context<Self>) -> impl IntoElement {
Story::container()
Story::container(cx)
.bg(cx.theme().colors().background)
.child(Story::title_for::<ListItem>())
.child(Story::label("Default"))
.child(Story::title_for::<ListItem>(cx))
.child(Story::label("Default", cx))
.child(ListItem::new("hello_world").child("Hello, world!"))
.child(Story::label("Inset"))
.child(Story::label("Inset", cx))
.child(
ListItem::new("inset_list_item")
.inset(true)
@ -31,7 +31,7 @@ impl Render for ListItemStory {
.color(Color::Muted),
),
)
.child(Story::label("With start slot icon"))
.child(Story::label("With start slot icon", cx))
.child(
ListItem::new("with start slot_icon")
.child("Hello, world!")
@ -41,7 +41,7 @@ impl Render for ListItemStory {
.color(Color::Muted),
),
)
.child(Story::label("With start slot avatar"))
.child(Story::label("With start slot avatar", cx))
.child(
ListItem::new("with_start slot avatar")
.child("Hello, world!")
@ -49,7 +49,7 @@ impl Render for ListItemStory {
"https://avatars.githubusercontent.com/u/1714999?v=4",
)),
)
.child(Story::label("With end slot"))
.child(Story::label("With end slot", cx))
.child(
ListItem::new("with_left_avatar")
.child("Hello, world!")
@ -57,7 +57,7 @@ impl Render for ListItemStory {
"https://avatars.githubusercontent.com/u/1714999?v=4",
)),
)
.child(Story::label("With end hover slot"))
.child(Story::label("With end hover slot", cx))
.child(
ListItem::new("with_end_hover_slot")
.child("Hello, world!")
@ -84,13 +84,13 @@ impl Render for ListItemStory {
"https://avatars.githubusercontent.com/u/1714999?v=4",
)),
)
.child(Story::label("With `on_click`"))
.child(Story::label("With `on_click`", cx))
.child(ListItem::new("with_on_click").child("Click me").on_click(
|_event, _window, _cx| {
println!("Clicked!");
},
))
.child(Story::label("With `on_secondary_mouse_down`"))
.child(Story::label("With `on_secondary_mouse_down`", cx))
.child(
ListItem::new("with_on_secondary_mouse_down")
.child("Right click me")
@ -98,7 +98,10 @@ impl Render for ListItemStory {
println!("Right mouse down!");
}),
)
.child(Story::label("With overflowing content in the `end_slot`"))
.child(Story::label(
"With overflowing content in the `end_slot`",
cx,
))
.child(
ListItem::new("with_overflowing_content_in_end_slot")
.child("An excerpt")
@ -106,6 +109,7 @@ impl Render for ListItemStory {
)
.child(Story::label(
"`inset` with overflowing content in the `end_slot`",
cx,
))
.child(
ListItem::new("inset_with_overflowing_content_in_end_slot")
@ -115,6 +119,7 @@ impl Render for ListItemStory {
)
.child(Story::label(
"`inset` with overflowing content in `children` and `end_slot`",
cx,
))
.child(
ListItem::new("inset_with_overflowing_content_in_children_and_end_slot")

20
crates/ui/src/components/stories/tab.rs
View file

@ -9,12 +9,12 @@ use crate::{Indicator, Tab};
pub struct TabStory;
impl Render for TabStory {
fn render(&mut self, _window: &mut Window, _cx: &mut Context<Self>) -> impl IntoElement {
Story::container()
.child(Story::title_for::<Tab>())
.child(Story::label("Default"))
fn render(&mut self, _window: &mut Window, cx: &mut Context<Self>) -> impl IntoElement {
Story::container(cx)
.child(Story::title_for::<Tab>(cx))
.child(Story::label("Default", cx))
.child(h_flex().child(Tab::new("tab_1").child("Tab 1")))
.child(Story::label("With indicator"))
.child(Story::label("With indicator", cx))
.child(
h_flex().child(
Tab::new("tab_1")
@ -22,7 +22,7 @@ impl Render for TabStory {
.child("Tab 1"),
),
)
.child(Story::label("With close button"))
.child(Story::label("With close button", cx))
.child(
h_flex().child(
Tab::new("tab_1")
@ -37,13 +37,13 @@ impl Render for TabStory {
.child("Tab 1"),
),
)
.child(Story::label("List of tabs"))
.child(Story::label("List of tabs", cx))
.child(
h_flex()
.child(Tab::new("tab_1").child("Tab 1"))
.child(Tab::new("tab_2").child("Tab 2")),
)
.child(Story::label("List of tabs with first tab selected"))
.child(Story::label("List of tabs with first tab selected", cx))
.child(
h_flex()
.child(
@ -64,7 +64,7 @@ impl Render for TabStory {
)
.child(Tab::new("tab_4").position(TabPosition::Last).child("Tab 4")),
)
.child(Story::label("List of tabs with last tab selected"))
.child(Story::label("List of tabs with last tab selected", cx))
.child(
h_flex()
.child(
@ -89,7 +89,7 @@ impl Render for TabStory {
.child("Tab 4"),
),
)
.child(Story::label("List of tabs with second tab selected"))
.child(Story::label("List of tabs with second tab selected", cx))
.child(
h_flex()
.child(

8
crates/ui/src/components/stories/tab_bar.rs
View file

@ -6,7 +6,7 @@ use crate::{Tab, TabBar, TabPosition, prelude::*};
pub struct TabBarStory;
impl Render for TabBarStory {
fn render(&mut self, _window: &mut Window, _cx: &mut Context<Self>) -> impl IntoElement {
fn render(&mut self, _window: &mut Window, cx: &mut Context<Self>) -> impl IntoElement {
let tab_count = 20;
let selected_tab_index = 3;
@ -31,9 +31,9 @@ impl Render for TabBarStory {
})
.collect::<Vec<_>>();
Story::container()
.child(Story::title_for::<TabBar>())
.child(Story::label("Default"))
Story::container(cx)
.child(Story::title_for::<TabBar>(cx))
.child(Story::label("Default", cx))
.child(
h_flex().child(
TabBar::new("tab_bar_1")

6
crates/ui/src/components/stories/toggle_button.rs
View file

@ -6,9 +6,9 @@ use crate::{ToggleButton, prelude::*};
pub struct ToggleButtonStory;
impl Render for ToggleButtonStory {
fn render(&mut self, _window: &mut Window, _cx: &mut Context<Self>) -> impl IntoElement {
Story::container()
.child(Story::title_for::<ToggleButton>())
fn render(&mut self, _window: &mut Window, cx: &mut Context<Self>) -> impl IntoElement {
Story::container(cx)
.child(Story::title_for::<ToggleButton>(cx))
.child(
StorySection::new().child(
StoryItem::new(