Input
Displays a form input field
Interactive-mode
Examples
Default
Disabled
With placeholder
API
The element family below can be composed together. Click an element to jump to its properties.
| Element | Purpose |
|---|---|
| Input | Single-line text input with Blok's border, focus ring, and aria-invalid destructive styling. Supports two-way binding via @bind-Value. |
Input
Single-line text input with Blok's border, focus ring, and aria-invalid destructive styling. Supports two-way binding via @bind-Value.
| Property | Type | Required | Description |
|---|---|---|---|
| Type | string | Native <input> type attribute. Default: "text". Pass e.g. "email", "password", "number". | |
| Value | string? | Two-way bindable current value. | |
| ValueChanged | EventCallback<string?> | Invoked on input. Pair with Value via @bind-Value. | |
| Placeholder | string? | Placeholder text shown when the value is empty. | |
| Disabled | bool | When true, disables the input. Default: false. | |
| ClassName | string? | Extra CSS classes appended to the <input>. | |
| AdditionalAttributes | Dictionary<string, object>? | Captured unmatched attributes (e.g. id, name, aria-invalid), forwarded to the <input>. |