Skip to main content

euv_ui/component/input/view/
fn.rs

1use super::*;
2
3/// A custom input component with label and event handling.
4///
5/// Internally binds `onfocus` and `onblur` so that mobile virtual keyboards
6/// never obscure the field. The handler reads `--euv-keyboard-height`
7/// (provided by the Tauri host / page-level bridge) and scrolls the input
8/// above the IME with a 12px gap. The label is optional — leave it empty to
9/// render an input without a label.
10///
11/// # Arguments
12///
13/// - `VirtualNode<EuvInputProps>` - The props node containing id, label, placeholder, value, autocomplete, etc.
14///
15/// # Returns
16///
17/// - `VirtualNode` - A labeled input element.
18#[component]
19pub fn euv_input(node: VirtualNode<EuvInputProps>) -> VirtualNode {
20    let EuvInputProps {
21        id,
22        name,
23        label: label_text,
24        input_type,
25        placeholder,
26        value,
27        autocomplete,
28        oninput,
29        class,
30    }: EuvInputProps = node.try_get_props().unwrap_or_default();
31    let effective_name: &'static str = if name.is_empty() { id } else { name };
32    let effective_type: &'static str = if input_type.is_empty() {
33        "text"
34    } else {
35        input_type
36    };
37    let effective_class: Css = if class.get_name().is_empty() {
38        c_euv_input().clone()
39    } else {
40        class
41    };
42    html! {
43        div {
44            class: c_euv_input_wrapper()
45            if { !label_text.is_empty() } {
46                label {
47                    for: id
48                    class: c_form_label()
49                    label_text
50                }
51            }
52            input {
53                id: id
54                name: effective_name
55                type: effective_type
56                placeholder: placeholder
57                value: value
58                autocomplete: autocomplete
59                class: effective_class
60                oninput: oninput
61                onfocus: UseEuvInput::on_focus_scroll_into_view()
62                onblur: UseEuvInput::on_blur_restore_height()
63            }
64        }
65    }
66}