input: How do you receive user input?

Editing a task title supplies a new value. A changed field, successful validation and saved resource are different states. An explicit binding or action and write permission connect editing to business data.

Start with these properties

The top-level type: "input" selects the node kind. props.type selects its input form, such as a text field. label tells the person what the field is for. placeholder is a hint while the field is empty, not a saved value. The example separately uses state.value for the current input value.

change expresses an input change. The example connects it to validation; passing validation does not establish that the value was saved to a business resource.

Read a structural example

From the source registry. This is structural reading material, not a live demo; referenced resources and actions require an application.

{
  "id": "email-input",
  "type": "input",
  "props": {
    "type": "text",
    "label": "Email",
    "placeholder": "you@example.com"
  },
  "state": {
    "value": ""
  },
  "events": {
    "change": {
      "exec": "/form/.actions/validate",
      "args": {
        "field": "email"
      }
    }
  }
}

This example shows the connection structure: it supplies the field name email but does not show how the new input value reaches validation. A working form must also supply the event data or value binding expected by that action. The empty state.value is the initial value, not a claim that the field stays empty.

Read the event connection as well as the field: change invokes /form/.actions/validate. This example shows validation, not a save action. A control’s value and the value stored in a business resource are not automatically the same.

Read the input reference.