Built for people who think better out loud.
1<script lang="ts">
2 import type { HTMLFormAttributes } from "svelte/elements";
3 import Button from "./Button.svelte";
4 import Input from "./Input.svelte";
5
6 type Props = HTMLFormAttributes & {
7 placeholder?: string;
8 buttonText?: string;
9 name?: string;
10 };
11
12 let {
13 placeholder = "you@example.com",
14 buttonText = "Sign up",
15 name = "email",
16 ...props
17 }: Props = $props();
18</script>
19
20<form {...props} class="flex flex-row justify-stretch items-stretch gap-1">
21 <Input
22 class=""
23 type="email"
24 {name}
25 {placeholder}
26 required
27 autocomplete="email"
28 />
29 <Button type="submit" class="h-full">{buttonText}</Button>
30</form>