Component Form

Form

A composite that gathers values + errors across its child fields and submits them in one on_submit callback.

use yororen_ui::headless::form::form;
use yororen_ui::headless::label::label;
use yororen_ui::headless::text_input::text_input;

form("login", cx)
    .value("email", self.email.clone())
    .error("email", self.email_error.clone())
    .on_submit({
        let entity = cx.entity();
        move |values, _, cx| {
            entity.update(cx, |s, _| {
                s.email = values.get("email").cloned().unwrap_or_default();
                s.submitted = true;
            });
        }
    })
    .submit("Sign in")
    .child(text_input("email-field").placeholder("you@example.com").render(cx, window))
    .child(label("email-hint", "Use your work email.", cx).render(cx))
    .render(cx)

Props

Method	Purpose
value(field, v)	Set the current value of field (a SharedString-able name).
error(field, e)	Set the current error message for field.
on_submit(closure)	Fn(HashMap<String, String>, &mut Window, &mut App) + 'static + Send + Sync. Fired when the form submits with the merged field values.
submit(label)	Add an auto-rendered submit button with the given label (added to the form's children).
submit_button(cx)	Returns Option<AnyElement> — a handle to the submit button (for focus control).
trigger_submit(w, cx)	Programmatically submit (e.g. from a keyboard shortcut).
child(el)	Add a field component (text input, select, label, …) to the body.

The parent view owns values + errors (typically as HashMap<String, String>). on_submit receives a fresh hashmap gathered from the children's state at submit time.

.render(cx) returns Stateful<Div>. No state entity.

See also: TextInput, Modal, FormField.