function TodoItem({ id, title, dueDate, completed, onToggleComplete }) { return /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-4 p-4 bg-white rounded-lg shadow", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "checkbox", checked: completed, onChange: ()=>onToggleComplete(id), className: "w-5 h-5 border-2 border-gray-300 rounded cursor-pointer", __source: { fileName: "", lineNumber: 4, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "flex-1", __source: { fileName: "", lineNumber: 10, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: `text-lg ${completed ? "line-through text-gray-500" : "text-gray-800"}`, __source: { fileName: "", lineNumber: 11, columnNumber: 9 }, __self: this }, title), /*#__PURE__*/ React.createElement("p", { className: "text-sm text-gray-600", __source: { fileName: "", lineNumber: 16, columnNumber: 9 }, __self: this }, "期限: ", dueDate))); } function TodoItemStory() { const [todos, setTodos] = React.useState([ { id: 1, title: "企画書を作成する", dueDate: "2025-01-15", completed: false }, { id: 2, title: "クライアントミーティング", dueDate: "2025-01-20", completed: true }, { id: 3, title: "プレゼン資料の準備", dueDate: "2025-01-25", completed: false } ]); const handleToggleComplete = (id)=>{ setTodos(todos.map((todo)=>todo.id === id ? { ...todo, completed: !todo.completed } : todo)); }; return /*#__PURE__*/ React.createElement("div", { className: "space-y-4 p-6 bg-gray-100", __source: { fileName: "", lineNumber: 53, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold mb-6", __source: { fileName: "", lineNumber: 54, columnNumber: 7 }, __self: this }, "Todoアイテムの表示例"), todos.map((todo)=>/*#__PURE__*/ React.createElement(TodoItem, { key: todo.id, ...todo, onToggleComplete: handleToggleComplete, __source: { fileName: "", lineNumber: 56, columnNumber: 9 }, __self: this }))); } function MainComponent() { const [formData, setFormData] = React.useState({ name: "", email: "", bio: "", avatar: null }); const [message, setMessage] = React.useState(""); const [loading, setLoading] = React.useState(false); const [upload, { loading: uploadLoading }] = useUpload(); const handleInputChange = (e)=>{ const { name, value } = e.target; setFormData((prev)=>({ ...prev, [name]: value })); }; const handleFileChange = async (e)=>{ if (e.target.files && e.target.files[0]) { const file = e.target.files[0]; const { url, error } = await upload({ file }); if (error) { setMessage("画像のアップロードに失敗しました"); return; } setFormData((prev)=>({ ...prev, avatar: url })); } }; const handleSubmit = async (e)=>{ e.preventDefault(); setLoading(true); setMessage(""); try { const response = await fetch("/api/profile/update", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify(formData) }); const data = await response.json(); if (data.error) { setMessage(data.error); } else { setMessage("プロフィールを更新しました"); } } catch (error) { setMessage("エラーが発生しました"); } finally{ setLoading(false); } }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-gray-100 flex flex-col items-center justify-center", __source: { fileName: "", lineNumber: 66, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-4xl font-bold mb-4", __source: { fileName: "", lineNumber: 67, columnNumber: 7 }, __self: this }, "プロフィール編集"), /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmit, className: "w-[300px] bg-white p-6 rounded shadow", __source: { fileName: "", lineNumber: 68, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 72, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium mb-2", __source: { fileName: "", lineNumber: 73, columnNumber: 11 }, __self: this }, "名前"), /*#__PURE__*/ React.createElement("input", { type: "text", name: "name", value: formData.name, onChange: handleInputChange, className: "w-full p-2 border border-gray-300 rounded", __source: { fileName: "", lineNumber: 74, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 83, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium mb-2", __source: { fileName: "", lineNumber: 84, columnNumber: 11 }, __self: this }, "メールアドレス"), /*#__PURE__*/ React.createElement("input", { type: "email", name: "email", value: formData.email, onChange: handleInputChange, className: "w-full p-2 border border-gray-300 rounded", __source: { fileName: "", lineNumber: 87, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 96, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium mb-2", __source: { fileName: "", lineNumber: 97, columnNumber: 11 }, __self: this }, "自己紹介"), /*#__PURE__*/ React.createElement("textarea", { name: "bio", value: formData.bio, onChange: handleInputChange, className: "w-full p-2 border border-gray-300 rounded", rows: "3", __source: { fileName: "", lineNumber: 98, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 107, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium mb-2", __source: { fileName: "", lineNumber: 108, columnNumber: 11 }, __self: this }, "プロフィール画像"), /*#__PURE__*/ React.createElement("input", { type: "file", accept: "image/*", onChange: handleFileChange, className: "w-full p-2 border border-gray-300 rounded", __source: { fileName: "", lineNumber: 111, columnNumber: 11 }, __self: this })), message && /*#__PURE__*/ React.createElement("div", { className: "mb-4 p-2 bg-blue-100 text-blue-700 rounded", __source: { fileName: "", lineNumber: 120, columnNumber: 11 }, __self: this }, message), /*#__PURE__*/ React.createElement("button", { type: "submit", disabled: loading || uploadLoading, className: "w-full py-2 bg-blue-600 text-white rounded hover:bg-blue-700 disabled:bg-blue-300", __source: { fileName: "", lineNumber: 125, columnNumber: 9 }, __self: this }, loading || uploadLoading ? "更新中..." : "更新する"))); }