function MainComponent() { const [tasks, setTasks] = React.useState([ { id: 1, text: "タスク１", status: "Doing" }, { id: 2, text: "タスク２", status: "ToDo" } ]); const [taskInput, setTaskInput] = React.useState(""); const [editingTask, setEditingTask] = React.useState(null); const [editingTaskInput, setEditingTaskInput] = React.useState(""); const addTask = ()=>{ if (taskInput.trim() !== "") { setTasks([ ...tasks, { id: Date.now(), text: taskInput, status: "ToDo" } ]); setTaskInput(""); } }; const deleteTask = (id)=>{ setTasks(tasks.filter((task)=>task.id !== id)); }; const editTask = (id)=>{ const task = tasks.find((task)=>task.id === id); setEditingTask(task.id); setEditingTaskInput(task.text); }; const saveTask = (id)=>{ setTasks(tasks.map((task)=>task.id === id ? { ...task, text: editingTaskInput } : task)); setEditingTask(null); setEditingTaskInput(""); }; return /*#__PURE__*/ React.createElement("div", { className: "p-6 font-arial text-[14px]", __source: { fileName: "", lineNumber: 34, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-roboto mb-4", __source: { fileName: "", lineNumber: 35, columnNumber: 7 }, __self: this }, "簡単なToDoリストアプリ"), /*#__PURE__*/ React.createElement("div", { className: "flex mb-4", __source: { fileName: "", lineNumber: 36, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", name: "taskInput", value: taskInput, onChange: (e)=>setTaskInput(e.target.value), className: "w-full h-[40px] p-2 border border-gray-300 rounded", __source: { fileName: "", lineNumber: 37, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("button", { onClick: addTask, className: "h-[40px] bg-[#4CAF50] text-white ml-2 p-2 rounded", __source: { fileName: "", lineNumber: 44, columnNumber: 9 }, __self: this }, "追加")), /*#__PURE__*/ React.createElement("div", { className: "flex flex-col", __source: { fileName: "", lineNumber: 50, columnNumber: 7 }, __self: this }, tasks.map((task)=>/*#__PURE__*/ React.createElement("div", { key: task.id, className: "bg-[#f9f9f9] border border-solid border-[#ddd] p-4 mb-3 rounded", __source: { fileName: "", lineNumber: 52, columnNumber: 11 }, __self: this }, editingTask === task.id ? /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 54, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", name: "editTaskInput", value: editingTaskInput, onChange: (e)=>setEditingTaskInput(e.target.value), className: "w-full h-[40px] p-2 border border-gray-300 rounded mb-2", __source: { fileName: "", lineNumber: 55, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("button", { onClick: ()=>saveTask(task.id), className: "h-[40px] bg-[#4CAF50] text-white p-2 rounded", __source: { fileName: "", lineNumber: 62, columnNumber: 17 }, __self: this }, "保存")) : /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center", __source: { fileName: "", lineNumber: 69, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 70, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "font-roboto text-[14px]", __source: { fileName: "", lineNumber: 71, columnNumber: 19 }, __self: this }, task.text), /*#__PURE__*/ React.createElement("span", { className: "ml-2 text-gray-500 text-[12px]", __source: { fileName: "", lineNumber: 72, columnNumber: 19 }, __self: this }, "(", task.status, ")")), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 74, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>editTask(task.id), className: "h-[40px] bg-[#4CAF50] text-white mr-2 p-2 rounded", __source: { fileName: "", lineNumber: 75, columnNumber: 19 }, __self: this }, "編集"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>deleteTask(task.id), className: "h-[40px] bg-[#f44336] text-white p-2 rounded", __source: { fileName: "", lineNumber: 80, columnNumber: 19 }, __self: this }, "削除"))))))); }