function MainComponent() { const handlePreviousDay = ()=>{ window.location.search = "?day=previous"; }; const handleNextDay = ()=>{ window.location.search = "?day=next"; }; const handleGoBack = ()=>{ window.history.back(); }; const [images, setImages] = React.useState({ breakfast: null, lunch: null, dinner: null, snack: null, other: null }); const handleImageChange = (e)=>{ const { name, files } = e.target; if (files && files[0]) { const reader = new FileReader(); reader.onload = ()=>{ setImages((prev)=>({ ...prev, [name]: reader.result })); }; reader.readAsDataURL(files[0]); } }; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center p-4 bg-[#f0f0f0]", __source: { fileName: "", lineNumber: 28, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 29, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-center font-roboto text-xl", __source: { fileName: "", lineNumber: 30, columnNumber: 9 }, __self: this }, "食事記録アプリ"), /*#__PURE__*/ React.createElement("div", { id: "dateDisplay", className: "text-center font-roboto mb-2", __source: { fileName: "", lineNumber: 31, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "flex space-x-2 mb-4", __source: { fileName: "", lineNumber: 32, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: handleGoBack, className: "px-4 py-2 rounded bg-gray-300 font-roboto", __source: { fileName: "", lineNumber: 33, columnNumber: 11 }, __self: this }, "戻る"), /*#__PURE__*/ React.createElement("button", { onClick: handlePreviousDay, className: "px-4 py-2 rounded bg-gray-300 font-roboto", __source: { fileName: "", lineNumber: 34, columnNumber: 11 }, __self: this }, "前の日"), /*#__PURE__*/ React.createElement("button", { onClick: handleNextDay, className: "px-4 py-2 rounded bg-gray-300 font-roboto", __source: { fileName: "", lineNumber: 35, columnNumber: 11 }, __self: this }, "次の日")), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-4", __source: { fileName: "", lineNumber: 37, columnNumber: 9 }, __self: this }, [ "breakfast", "lunch", "dinner", "snack", "other" ].map((meal)=>/*#__PURE__*/ React.createElement("div", { key: meal, className: "flex flex-col items-center", __source: { fileName: "", lineNumber: 39, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: meal, className: "font-roboto mb-2", __source: { fileName: "", lineNumber: 40, columnNumber: 15 }, __self: this }, meal === 'breakfast' && '朝食', meal === 'lunch' && '昼食', meal === 'dinner' && '夕食', meal === 'snack' && 'おやつ', meal === 'other' && 'その他'), /*#__PURE__*/ React.createElement("input", { type: "file", id: meal, name: meal, accept: "image/*", onChange: handleImageChange, __source: { fileName: "", lineNumber: 47, columnNumber: 15 }, __self: this }), images[meal] && /*#__PURE__*/ React.createElement("img", { src: images[meal], alt: meal, className: "mt-2 w-[150px] h-[150px] object-cover", __source: { fileName: "", lineNumber: 48, columnNumber: 32 }, __self: this })))))); }