euv-ui 0.10.0

Reusable UI component library for the euv framework, providing buttons, cards, modals, inputs, and more.
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

use crate::*;

/// A custom input component with label and event handling.
///
/// Internally binds `onfocus` and `onblur` so that mobile virtual keyboards
/// never obscure the field. The label is optional — leave it empty to render
/// an input without a label.
///
/// # Arguments
///
/// - `VirtualNode<EuvInputProps>` - The props node containing id, label, placeholder, value, autocomplete, etc.
///
/// # Returns
///
/// - `VirtualNode` - A labeled input element.
#[component]
pub fn euv_input(node: VirtualNode<EuvInputProps>) -> VirtualNode {
    let EuvInputProps {
        id,
        name,
        label: label_text,
        input_type,
        placeholder,
        value,
        autocomplete,
        oninput,
        class,
    }: EuvInputProps = node.try_get_props().unwrap_or_default();
    let effective_name: &'static str = if name.is_empty() { id } else { name };
    let effective_type: &'static str = if input_type.is_empty() {
        "text"
    } else {
        input_type
    };
    let effective_class: Css = if class.get_name().is_empty() {
        c_euv_input().clone()
    } else {
        class
    };
    html! {
        div {
            class: c_euv_input_wrapper()
            if { !label_text.is_empty() } {
                label {
                    for: id
                    class: c_form_label()
                    label_text
                }
            }
            input {
                id: id
                name: effective_name
                type: effective_type
                placeholder: placeholder
                value: value
                autocomplete: autocomplete
                class: effective_class
                oninput: oninput
                onfocus: UseEuvInput::on_focus_scroll_into_view()
                onblur: UseEuvInput::on_blur_restore_height()
            }
        }
    }
}