function MainComponent() { const [posts, setPosts] = React.useState([ { title: "サンプル投稿タイトル1", content: "これはサンプル投稿内容です。" }, { title: "サンプル投稿タイトル2", content: "これもサンプル投稿内容です。" } ]); const [form, setForm] = React.useState({ title: "", content: "" }); const handleChange = (e)=>{ const { name, value } = e.target; setForm({ ...form, [name]: value }); }; const handleSubmit = (e)=>{ e.preventDefault(); setPosts([ ...posts, form ]); setForm({ title: "", content: "" }); }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-[#f0f0f0] p-4 font-roboto", __source: { fileName: "", lineNumber: 21, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "container mx-auto", __source: { fileName: "", lineNumber: 22, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-3xl font-bold mb-4", __source: { fileName: "", lineNumber: 23, columnNumber: 9 }, __self: this }, "掲示板サイト"), /*#__PURE__*/ React.createElement("div", { className: "bg-white shadow-md rounded-lg p-6 mb-4", __source: { fileName: "", lineNumber: 24, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-semibold mb-4", __source: { fileName: "", lineNumber: 25, columnNumber: 11 }, __self: this }, "新しい投稿を作成する"), /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmit, __source: { fileName: "", lineNumber: 26, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 27, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", name: "title", value: form.title, onChange: handleChange, placeholder: "タイトル", className: "w-full p-2 border border-gray-300 rounded", __source: { fileName: "", lineNumber: 28, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 37, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("textarea", { name: "content", value: form.content, onChange: handleChange, placeholder: "内容", rows: "4", className: "w-full p-2 border border-gray-300 rounded", __source: { fileName: "", lineNumber: 38, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "bg-[#000] text-white p-2 rounded", __source: { fileName: "", lineNumber: 47, columnNumber: 13 }, __self: this }, "投稿する"))), /*#__PURE__*/ React.createElement("div", { className: "bg-white shadow-md rounded-lg p-6", __source: { fileName: "", lineNumber: 52, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-semibold mb-4", __source: { fileName: "", lineNumber: 53, columnNumber: 11 }, __self: this }, "投稿一覧"), posts.map((post, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: "mb-4", __source: { fileName: "", lineNumber: 55, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-lg font-semibold", __source: { fileName: "", lineNumber: 56, columnNumber: 15 }, __self: this }, post.title), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 57, columnNumber: 15 }, __self: this }, post.content)))))); }