Todo Item

A single todo item with toggle, inline edit, and delete actions.

bun x bosia@latest add todo/todo-item

Renders a single todo with toggle (complete/incomplete), inline editing on double-click, and a delete button. Uses form actions (?/toggle, ?/update, ?/delete).

Props

Prop Type Default
todo Todo

The Todo type is defined in the todo feature (src/features/todo/types.ts).

Usage

<script lang="ts">
	import { TodoItem } from "$lib/components/todo";
	import type { Todo } from "$lib/features/todo/types";

	let { todo }: { todo: Todo } = $props();
</script>

<TodoItem {todo} />