material-ui-rs 0.5.3

A Material3 inspired theme for `iced`
Documentation 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90

use super::*;

#[test]
fn primary_tab_active_style_uses_primary_tokens() {
    let theme = Theme::Light;
    let colors = theme.colors();
    let style = tab_style(&theme, Status::Active, Variant::Primary, true);

    assert_eq!(
        style.background,
        Some(Background::Color(colors.surface.color))
    );
    assert_eq!(style.text_color, colors.primary.color);
    assert_eq!(style.shadow.offset.y, 0.0);
}

#[test]
fn inactive_tabs_use_on_surface_variant_until_interaction() {
    let theme = Theme::Light;
    let colors = theme.colors();
    let active = tab_style(&theme, Status::Active, Variant::Secondary, false);
    let hovered = tab_style(&theme, Status::Hovered, Variant::Secondary, false);

    assert_eq!(active.text_color, colors.surface.text_variant);
    assert_eq!(hovered.text_color, colors.surface.text);
    assert_eq!(
        hovered.background,
        Some(Background::Color(mix(
            colors.surface.color,
            colors.surface.text,
            tokens::component::secondary_tab::HOVER_STATE_LAYER_OPACITY
        )))
    );
}

#[test]
fn indicator_uses_primary_shape_and_secondary_square_shape() {
    let primary = indicator_radius(Variant::Primary);
    assert_eq!(
        primary.top_left,
        tokens::component::primary_tab::ACTIVE_INDICATOR_SHAPE_TOP
    );
    assert_eq!(primary.bottom_left, 0.0);
    assert_eq!(
        indicator_radius(Variant::Secondary),
        Radius::new(tokens::component::secondary_tab::ACTIVE_INDICATOR_SHAPE)
    );
}

#[test]
fn inactive_indicator_is_transparent_but_keeps_height() {
    let theme = Theme::Light;
    let style = indicator_style(&theme, Variant::Primary, false);

    assert_eq!(
        style.background,
        Some(Background::Color(Color::TRANSPARENT))
    );
    assert_eq!(
        Variant::Primary.indicator_height(),
        tokens::component::primary_tab::ACTIVE_INDICATOR_HEIGHT
    );
}

#[test]
fn tab_state_animates_indicator_with_material_timing() {
    let now = Instant::now();
    let mut state = State::new(0);

    state.select(2, now, Variant::Primary);

    assert_eq!(state.selected_index(), 2);
    assert_eq!(state.indicator_position.to, 2.0);

    let _ = state.advance(now + duration_ms(125));
    assert!(state.indicator_position() > 0.0);
    assert!(state.indicator_position() < 2.0);

    let _ = state.advance(now + duration_ms(250));
    assert_eq!(state.indicator_position(), 2.0);
}

#[test]
fn moving_indicator_width_matches_primary_inset_and_secondary_full_width() {
    assert_eq!(
        moving_indicator_width(Variant::Primary, 120.0),
        120.0 - tokens::component::primary_tab::HORIZONTAL_SPACE * 2.0
    );
    assert_eq!(moving_indicator_width(Variant::Secondary, 120.0), 120.0);
}