Input
A form input field styled with the lily token set.
<script lang="ts">
import { Input } from "$lib/components/ui/input";
</script>
<Input type="email" placeholder="you@example.com" class="max-w-xs" />Installation
Install the lily base and `utils` (run once per project).
npx lily-svelte@latest initCopy the input source from the registry into $lib/components/ui/input.
Usage
<script lang="ts">
import { Input } from '$lib/components/ui/input';
</script>
<Input type="email" placeholder="you@example.com" />With a label
<script lang="ts">
import { Input } from '$lib/components/ui/input';
import { Label } from '$lib/components/ui/label';
</script>
<div class="flex flex-col gap-2">
<Label for="email">Email</Label>
<Input id="email" type="email" placeholder="you@example.com" />
</div>Disabled
<Input placeholder="Disabled" disabled />