leptos_use/
use_preferred_contrast.rs

1use crate::use_media_query;
2use leptos::prelude::*;
3use leptos::reactive::wrappers::read::Signal;
4use std::fmt::Display;
5
6/// Reactive [prefers-contrast](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-contrast) media query.
7///
8/// ## Usage
9///
10/// ```
11/// # use leptos::prelude::*;
12/// # use leptos_use::use_preferred_contrast;
13/// #
14/// # #[component]
15/// # fn Demo() -> impl IntoView {
16/// #
17/// let preferred_contrast = use_preferred_contrast();
18/// #
19/// #    view! { }
20/// # }
21/// ```
22///
23/// ## Server-Side Rendering
24///
25/// > Make sure you follow the [instructions in Server-Side Rendering](https://leptos-use.rs/server_side_rendering.html).
26///
27/// On the server this returns a `Signal` that always contains the value `PreferredContrast::NoPreference`.
28///
29/// ## See also
30///
31/// * [`fn@crate::use_media_query`]
32/// * [`fn@crate::use_preferred_dark`]
33/// * [`fn@crate::use_prefers_reduced_motion`]
34pub fn use_preferred_contrast() -> Signal<PreferredContrast> {
35    let is_more = use_media_query("(prefers-contrast: more)");
36    let is_less = use_media_query("(prefers-contrast: less)");
37    let is_custom = use_media_query("(prefers-contrast: custom)");
38
39    Signal::derive(move || {
40        if is_more.get() {
41            PreferredContrast::More
42        } else if is_less.get() {
43            PreferredContrast::Less
44        } else if is_custom.get() {
45            PreferredContrast::Custom
46        } else {
47            PreferredContrast::NoPreference
48        }
49    })
50}
51
52/// Return value for [`use_preferred_contrast`]
53#[derive(Debug, Clone, Copy, PartialEq, Eq, Default)]
54pub enum PreferredContrast {
55    More,
56    Less,
57    Custom,
58    #[default]
59    NoPreference,
60}
61impl Display for PreferredContrast {
62    fn fmt(&self, f: &mut std::fmt::Formatter<'_>) -> std::fmt::Result {
63        match self {
64            PreferredContrast::More => write!(f, "more"),
65            PreferredContrast::Less => write!(f, "less"),
66            PreferredContrast::Custom => write!(f, "custom"),
67            PreferredContrast::NoPreference => write!(f, "no-preference"),
68        }
69    }
70}
leptos_use/use_preferred_contrast.rs

leptos_use/
use_preferred_contrast.rs
