Input
A field that captures single-line text or data input from the user.
| Property | Description | Type |
|---|---|---|
label | Adds a label above the input element. | string |
placeholder | Provides a subtle hint within the input. Useful to communicate the proper formatting required. | string |
name | Provides the name attribute to the input html element. | string |
disabled | Prevents interaction. | boolean |
required | Makes the input a required field and styles the label with a red asterisk. | boolean |
expanded | Allows the input to stretch to full width. | boolean |
error | Adds an error message below the input. | string |
hint | Adds a hint below the input. | string |
align | Aligns the text within the input. | start | end |
value | Current text. Use bind:value to read and update it. | string |
type | The input type, such as text, email, password or number. Defaults to text. | string |
autocomplete | Whether the browser may autofill the field. | on | off |
slot="prefix" | Content shown inside the field before the text, such as an icon or a unit. | slot |
slot="suffix" | Content shown inside the field after the text, such as a unit. | slot |
on:change | Fires when the value is committed (on blur or Enter). | event |
on:keydown | Fires for each key press while the field is focused. | event |