Files
create-glstack/template/apps/<@if(eq(context.project.frontend,"svelte-kit"))>web/src/lib/components/todos/CreateTodo.svelte
2026-04-16 13:35:26 +02:00

26 lines
910 B
Svelte

<script lang="ts">
import type { Todo, ExtractPayload } from "@<@var(context.project.name)>/rpc";
import Input from "$lib/components/ui/input/input.svelte";
import Button from "$lib/components/ui/button/button.svelte"
import * as Field from "$lib/components/ui/field/index"
import { getTodoCollection } from "$lib/todocollectionscontext";
const todoCollection = getTodoCollection();
let todo = $state<ExtractPayload<Todo>>({id: crypto.randomUUID() ,task: "",done:false})
let create = () => {
todoCollection.insert(todo)
todo = { id: crypto.randomUUID(), task: "", done:false }
}
</script>
<div class="flex flex-col items-center justify-center">
<Field.FieldGroup class="w-50">
<Field.Field>
<Field.Label>
Todo
</Field.Label>
<Input bind:value={todo.task}/>
</Field.Field>
<Button variant="outline" onclick={create} > Create </Button>
</Field.FieldGroup>
</div>