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()
14 .bg(cx.theme().colors().background)
15 .child(Story::title_for::<ListItem>())
16 .child(Story::label("Default"))
17 .child(ListItem::new("hello_world").child("Hello, world!"))
18 .child(Story::label("Inset"))
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"))
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"))
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"))
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"))
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`"))
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`"))
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("With overflowing content in the `end_slot`"))
102 .child(
103 ListItem::new("with_overflowing_content_in_end_slot")
104 .child("An excerpt")
105 .end_slot(Label::new(OVERFLOWING_TEXT).color(Color::Muted)),
106 )
107 .child(Story::label(
108 "`inset` with overflowing content in the `end_slot`",
109 ))
110 .child(
111 ListItem::new("inset_with_overflowing_content_in_end_slot")
112 .inset(true)
113 .child("An excerpt")
114 .end_slot(Label::new(OVERFLOWING_TEXT).color(Color::Muted)),
115 )
116 .child(Story::label(
117 "`inset` with overflowing content in `children` and `end_slot`",
118 ))
119 .child(
120 ListItem::new("inset_with_overflowing_content_in_children_and_end_slot")
121 .inset(true)
122 .child(Label::new(OVERFLOWING_TEXT))
123 .end_slot(Label::new(OVERFLOWING_TEXT).color(Color::Muted)),
124 )
125 }
126}