1use gpui::Render;
2use story::Story;
3
4use crate::{prelude::*, Avatar};
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, cx: &mut ViewContext<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(
89 ListItem::new("with_on_click")
90 .child("Click me")
91 .on_click(|_event, _cx| {
92 println!("Clicked!");
93 }),
94 )
95 .child(Story::label("With `on_secondary_mouse_down`"))
96 .child(
97 ListItem::new("with_on_secondary_mouse_down")
98 .child("Right click me")
99 .on_secondary_mouse_down(|_event, _cx| {
100 println!("Right mouse down!");
101 }),
102 )
103 .child(Story::label("With overflowing content in the `end_slot`"))
104 .child(
105 ListItem::new("with_overflowing_content_in_end_slot")
106 .child("An excerpt")
107 .end_slot(Label::new(OVERFLOWING_TEXT).color(Color::Muted)),
108 )
109 .child(Story::label(
110 "`inset` with overflowing content in the `end_slot`",
111 ))
112 .child(
113 ListItem::new("inset_with_overflowing_content_in_end_slot")
114 .inset(true)
115 .child("An excerpt")
116 .end_slot(Label::new(OVERFLOWING_TEXT).color(Color::Muted)),
117 )
118 .child(Story::label(
119 "`inset` with overflowing content in `children` and `end_slot`",
120 ))
121 .child(
122 ListItem::new("inset_with_overflowing_content_in_children_and_end_slot")
123 .inset(true)
124 .child(Label::new(OVERFLOWING_TEXT))
125 .end_slot(Label::new(OVERFLOWING_TEXT).color(Color::Muted)),
126 )
127 }
128}