shadow-design 0.1.0

Modular, high-performance UI component library for Dioxus 0.7 applications
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

use dioxus::prelude::*;

/// Varianti di animazione per componenti interattivi, toast, modali e dialoghi.
#[derive(Clone, Copy, PartialEq, Debug, Default)]
pub enum AnimationVariant {
    #[default]
    FadeIn,
    FadeOut,
    SlideInRight,
    SlideInLeft,
    SlideInBottom,
    SlideInTop,
    ScaleIn,
    ModalEnter,
    ToastEnter,
    ToastExit,
    DropdownEnter,
    DrawerSlideLeft,
    DrawerSlideRight,
    PulseGlow,
    TactilePress,
    Spin,
    Indeterminate,
}

impl AnimationVariant {
    pub fn classes(&self) -> &'static str {
        match self {
            AnimationVariant::FadeIn => "animate-fade-in",
            AnimationVariant::FadeOut => "animate-fade-out",
            AnimationVariant::SlideInRight => "animate-slide-in-right",
            AnimationVariant::SlideInLeft => "animate-slide-in-left",
            AnimationVariant::SlideInBottom => "animate-slide-in-bottom",
            AnimationVariant::SlideInTop => "animate-slide-in-top",
            AnimationVariant::ScaleIn => "animate-scale-in",
            AnimationVariant::ModalEnter => "animate-modal-enter",
            AnimationVariant::ToastEnter => "animate-toast-enter",
            AnimationVariant::ToastExit => "animate-toast-exit",
            AnimationVariant::DropdownEnter => "animate-dropdown-enter",
            AnimationVariant::DrawerSlideLeft => "animate-drawer-slide-left",
            AnimationVariant::DrawerSlideRight => "animate-drawer-slide-right",
            AnimationVariant::PulseGlow => "animate-pulse-glow",
            AnimationVariant::TactilePress => "tactile-press select-none cursor-pointer",
            AnimationVariant::Spin => "animate-spin",
            AnimationVariant::Indeterminate => "animate-indeterminate",
        }
    }
}

/// Helper di transizione e animazione per Dioxus.
#[component]
pub fn Transition(
    #[props(default)] variant: AnimationVariant,
    #[props(default)] class: String,
    children: Element,
) -> Element {
    let anim_class = variant.classes();
    rsx! {
        div {
            class: "{anim_class} {class}",
            {children}
        }
    }
}

/// Costanti e classi standard di animazione esposte dalla libreria.
pub struct Animations;

impl Animations {
    pub const FADE_IN: &'static str = "animate-fade-in";
    pub const FADE_OUT: &'static str = "animate-fade-out";
    pub const SLIDE_IN_RIGHT: &'static str = "animate-slide-in-right";
    pub const SLIDE_IN_LEFT: &'static str = "animate-slide-in-left";
    pub const SLIDE_IN_BOTTOM: &'static str = "animate-slide-in-bottom";
    pub const SLIDE_IN_TOP: &'static str = "animate-slide-in-top";
    pub const SCALE_IN: &'static str = "animate-scale-in";
    pub const TOAST_ENTER: &'static str = "animate-toast-enter";
    pub const TOAST_EXIT: &'static str = "animate-toast-exit";
    pub const MODAL_ENTER: &'static str = "animate-modal-enter";
    pub const DRAWER_LEFT: &'static str = "animate-drawer-slide-left";
    pub const DRAWER_RIGHT: &'static str = "animate-drawer-slide-right";
    pub const DROPDOWN_ENTER: &'static str = "animate-dropdown-enter";
    pub const PULSE_GLOW: &'static str = "animate-pulse-glow";
    pub const SPIN: &'static str = "animate-spin";
    pub const INDETERMINATE: &'static str = "animate-indeterminate";
    pub const TACTILE: &'static str = "tactile-press";
}