import * as React from "react"; import { TodoData } from "./TodoData"; type Props = { item: TodoData; onCheck: (item: TodoData, checked: boolean) => void; }; export const TodoItem = ({ item, onCheck }: Props) => { return ( <label className="panel-block"> <input type="checkbox" checked={item.done} onChange={(e) => onCheck(item, e.target.checked)} /> <span className={item.done ? "has-text-grey-light" : ""}> {item.text} </span> </label> ); };