ui_storybook/components/primitives/
device_icons.rs

1//! Lucide-style SVG icons for capture-source rows (camera, mic,
2//! system audio). Paint with `currentColor` and stroke at 1.75 so
3//! they read as outlined glyphs inside the small device tiles.
4//! Path data copied verbatim from upstream lucide.
5
6use leptos::prelude::*;
7
8/// Lucide `camera` — camera capture source.
9#[component]
10pub fn Camera(#[prop(optional)] size: Option<u16>) -> impl IntoView {
11    let size = size.unwrap_or(18);
12    view! {
13        <svg
14            class="lucide lucide-camera"
15            width=size
16            height=size
17            viewBox="0 0 24 24"
18            fill="none"
19            stroke="currentColor"
20            stroke-width="1.75"
21            stroke-linecap="round"
22            stroke-linejoin="round"
23            aria-hidden="true"
24        >
25            <path d="M14.5 4h-5L7 7H4a2 2 0 0 0-2 2v9a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2h-3l-2.5-3z" />
26            <circle cx="12" cy="13" r="3" />
27        </svg>
28    }
29}
30
31/// Lucide `mic` — microphone capture source.
32#[component]
33pub fn Mic(#[prop(optional)] size: Option<u16>) -> impl IntoView {
34    let size = size.unwrap_or(18);
35    view! {
36        <svg
37            class="lucide lucide-mic"
38            width=size
39            height=size
40            viewBox="0 0 24 24"
41            fill="none"
42            stroke="currentColor"
43            stroke-width="1.75"
44            stroke-linecap="round"
45            stroke-linejoin="round"
46            aria-hidden="true"
47        >
48            <path d="M12 19v3" />
49            <path d="M19 10v2a7 7 0 0 1-14 0v-2" />
50            <rect width="6" height="13" x="9" y="2" rx="3" />
51        </svg>
52    }
53}
54
55/// Lucide `volume-2` — system-audio source.
56#[component]
57pub fn Volume2(#[prop(optional)] size: Option<u16>) -> impl IntoView {
58    let size = size.unwrap_or(18);
59    view! {
60        <svg
61            class="lucide lucide-volume-2"
62            width=size
63            height=size
64            viewBox="0 0 24 24"
65            fill="none"
66            stroke="currentColor"
67            stroke-width="1.75"
68            stroke-linecap="round"
69            stroke-linejoin="round"
70            aria-hidden="true"
71        >
72            <path d="M11 4.702a.705.705 0 0 0-1.203-.498L6.413 7.587A1.4 1.4 0 0 1 5.416 8H3a1 1 0 0 0-1 1v6a1 1 0 0 0 1 1h2.416a1.4 1.4 0 0 1 .997.413l3.383 3.384A.705.705 0 0 0 11 19.298z" />
73            <path d="M16 9a5 5 0 0 1 0 6" />
74            <path d="M19.364 18.364a9 9 0 0 0 0-12.728" />
75        </svg>
76    }
77}
ui_storybook/components/primitives/device_icons.rs

ui_storybook/components/primitives/
device_icons.rs
