Input

Text input. Requires the user to type something. If autocomplete is desired, use Combobox instead.

Bog standard input element.

PropTypeDescription
labelstringInput label
namestringRequired Input name attribute
idstringHTML id attribute
bind:groupanyTwo-way binding for the state
valueanyThe value for this input
<script lang="ts">
import Input from '../components/input.svelte';

let value = '';
</script>

<Input name="name" label="Text input" type="text" bind:value />

Examples

Number

<script lang="ts">
import Input from '../components/input.svelte';

let value = 0;
</script>

<Input name="digit" label="Number input" type="number" min="0" max="100" bind:value />

Email

<script lang="ts">
import Input from '../components/input.svelte';

let value = '';
</script>

<Input name="email" label="Email input" type="email" bind:value />

Password

<script lang="ts">
import Input from '../components/input.svelte';

let value = '';
</script>

<Input name="password" label="Password input" type="password" bind:value />

Date

<script lang="ts">
import Input from '../components/input.svelte';

let value = '';
</script>

<Input name="date" label="Date input" type="date" bind:value />