1use gpui::Render;
2use story::Story;
3
4use crate::{Avatar, prelude::*};
5use crate::{IconName, ListItem};
6
7const OVERFLOWING_TEXT: &str = "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean mauris ligula, luctus vel dignissim eu, vestibulum sed libero. Sed at convallis velit.";
8
9pub struct ListItemStory;
10
11impl Render for ListItemStory {
12 fn render(&mut self, _: &mut Window, cx: &mut Context<Self>) -> impl IntoElement {
13 Story::container(cx)
14 .bg(cx.theme().colors().background)
15 .child(Story::title_for::<ListItem>(cx))
16 .child(Story::label("Default", cx))
17 .child(ListItem::new("hello_world").child("Hello, world!"))
18 .child(Story::label("Inset", cx))
19 .child(
20 ListItem::new("inset_list_item")
21 .inset(true)
22 .start_slot(
23 Icon::new(IconName::Bell)
24 .size(IconSize::Small)
25 .color(Color::Muted),
26 )
27 .child("Hello, world!")
28 .end_slot(
29 Icon::new(IconName::Bell)
30 .size(IconSize::Small)
31 .color(Color::Muted),
32 ),
33 )
34 .child(Story::label("With start slot icon", cx))
35 .child(
36 ListItem::new("with start slot_icon")
37 .child("Hello, world!")
38 .start_slot(
39 Icon::new(IconName::Bell)
40 .size(IconSize::Small)
41 .color(Color::Muted),
42 ),
43 )
44 .child(Story::label("With start slot avatar", cx))
45 .child(
46 ListItem::new("with_start slot avatar")
47 .child("Hello, world!")
48 .start_slot(Avatar::new(
49 "https://avatars.githubusercontent.com/u/1714999?v=4",
50 )),
51 )
52 .child(Story::label("With end slot", cx))
53 .child(
54 ListItem::new("with_left_avatar")
55 .child("Hello, world!")
56 .end_slot(Avatar::new(
57 "https://avatars.githubusercontent.com/u/1714999?v=4",
58 )),
59 )
60 .child(Story::label("With end hover slot", cx))
61 .child(
62 ListItem::new("with_end_hover_slot")
63 .child("Hello, world!")
64 .end_slot(
65 h_flex()
66 .gap_2()
67 .child(Avatar::new(
68 "https://avatars.githubusercontent.com/u/1789?v=4",
69 ))
70 .child(Avatar::new(
71 "https://avatars.githubusercontent.com/u/1789?v=4",
72 ))
73 .child(Avatar::new(
74 "https://avatars.githubusercontent.com/u/1789?v=4",
75 ))
76 .child(Avatar::new(
77 "https://avatars.githubusercontent.com/u/1789?v=4",
78 ))
79 .child(Avatar::new(
80 "https://avatars.githubusercontent.com/u/1789?v=4",
81 )),
82 )
83 .end_hover_slot(Avatar::new(
84 "https://avatars.githubusercontent.com/u/1714999?v=4",
85 )),
86 )
87 .child(Story::label("With `on_click`", cx))
88 .child(ListItem::new("with_on_click").child("Click me").on_click(
89 |_event, _window, _cx| {
90 println!("Clicked!");
91 },
92 ))
93 .child(Story::label("With `on_secondary_mouse_down`", cx))
94 .child(
95 ListItem::new("with_on_secondary_mouse_down")
96 .child("Right click me")
97 .on_secondary_mouse_down(|_event, _window, _cx| {
98 println!("Right mouse down!");
99 }),
100 )
101 .child(Story::label(
102 "With overflowing content in the `end_slot`",
103 cx,
104 ))
105 .child(
106 ListItem::new("with_overflowing_content_in_end_slot")
107 .child("An excerpt")
108 .end_slot(Label::new(OVERFLOWING_TEXT).color(Color::Muted)),
109 )
110 .child(Story::label(
111 "`inset` with overflowing content in the `end_slot`",
112 cx,
113 ))
114 .child(
115 ListItem::new("inset_with_overflowing_content_in_end_slot")
116 .inset(true)
117 .child("An excerpt")
118 .end_slot(Label::new(OVERFLOWING_TEXT).color(Color::Muted)),
119 )
120 .child(Story::label(
121 "`inset` with overflowing content in `children` and `end_slot`",
122 cx,
123 ))
124 .child(
125 ListItem::new("inset_with_overflowing_content_in_children_and_end_slot")
126 .inset(true)
127 .child(Label::new(OVERFLOWING_TEXT))
128 .end_slot(Label::new(OVERFLOWING_TEXT).color(Color::Muted)),
129 )
130 }
131}