Todo List

Build a Todo List component where users can:

• Add a new todo item.
• Mark a todo as completed.
• Delete a todo item.
• View the list of all todos.

Requirements

• The component should maintain a list of todos in its state.
• A todo has: id, text, and completed (boolean).
• An input box with placeholder "Enter todo" to type a new todo.
• A button labelled "Add" to add a todo.
• Each todo should display its text and a checkbox to toggle completion.
• Each todo should have a delete button labelled "Delete" to delete a todo.
• Completed todos should appear with a strikethrough style.

Constraints & Edge Cases

• Todo text should not be empty.
• Case-insensitive duplicate entries should be allowed.
• Deleting an item should not affect the remaining list.
• All operations should update the UI immediately.

Reference UI