Skip to main content

orbital_base_components/form/select/
base.rs

1use leptos::{html, prelude::*};
2
3use crate::form::bind::FormBind;
4use crate::form::field_injection::FieldInjection;
5
6/// Headless native `<select>`.
7#[component(transparent)]
8pub fn BaseSelect(
9    #[prop(optional, into)] class: MaybeProp<String>,
10    #[prop(optional, into)] size: MaybeProp<String>,
11    #[prop(optional, into)] id: MaybeProp<String>,
12    #[prop(optional, into)] name: MaybeProp<String>,
13    #[prop(optional, into)] value: FormBind<String>,
14    #[prop(optional, into)] disabled: Signal<bool>,
15    children: Children,
16) -> impl IntoView {
17    let (id, name) = FieldInjection::use_id_and_name(id, name);
18    let select_ref = NodeRef::<html::Select>::new();
19
20    let value_bind = value.clone();
21    let on_change = move |_| {
22        if let Some(el) = select_ref.get_untracked() {
23            value_bind.set(el.value());
24        }
25    };
26
27    view! {
28        <select
29            class=move || {
30                let mut parts = Vec::new();
31                if let Some(c) = class.get() {
32                    if !c.is_empty() {
33                        parts.push(c);
34                    }
35                }
36                if let Some(c) = size.get() {
37                    if !c.is_empty() {
38                        parts.push(c);
39                    }
40                }
41                parts.join(" ")
42            }
43            id=id
44            name=name
45            disabled=disabled
46            prop:value=move || value.get()
47            on:change=on_change
48            node_ref=select_ref
49        >
50            {children()}
51        </select>
52    }
53}