function NoteInputArea({ note, setNote }) { return /*#__PURE__*/ React.createElement("textarea", { name: "note", value: note, onChange: (e)=>setNote(e.target.value), className: "w-full md:w-[500px] h-[150px] p-2 border border-gray-300 rounded-md mb-4", placeholder: "ここにノートを書いて下さい...", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }); } function NoteInputAreaStory() { const [note, setNote] = React.useState(''); return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 17, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(NoteInputArea, { note: note, setNote: setNote, __source: { fileName: "", lineNumber: 18, columnNumber: 7 }, __self: this })); } function MainComponent() { const [note, setNote] = React.useState(''); const [notes, setNotes] = React.useState([]); const handleSubmit = (e)=>{ e.preventDefault(); if (note.trim()) { setNotes([ ...notes, note ]); setNote(''); } }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-gray-100 p-8 font-sans", __source: { fileName: "", lineNumber: 14, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white p-6 rounded-lg shadow-lg", __source: { fileName: "", lineNumber: 15, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-3xl font-bold mb-6 text-center", __source: { fileName: "", lineNumber: 16, columnNumber: 9 }, __self: this }, "ノートツール"), /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmit, className: "flex flex-col items-center", __source: { fileName: "", lineNumber: 17, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement(NoteInputArea, { note: note, setNote: setNote, __source: { fileName: "", lineNumber: 18, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "bg-blue-500 text-white px-4 py-2 rounded-md", __source: { fileName: "", lineNumber: 19, columnNumber: 11 }, __self: this }, "追加")), /*#__PURE__*/ React.createElement("div", { className: "mt-8", __source: { fileName: "", lineNumber: 21, columnNumber: 9 }, __self: this }, notes.map((note, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: "bg-gray-200 p-4 mb-2 rounded-md", __source: { fileName: "", lineNumber: 23, columnNumber: 13 }, __self: this }, note))))); }