function MainComponent() { const [keyword, setKeyword] = React.useState(''); const [novel, setNovel] = React.useState(''); const handleSubmit = async (e)=>{ e.preventDefault(); try { const response = await fetch('/api/generate', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ keyword }) }); if (!response.ok) { throw new Error('Network response was not ok'); } const data = await response.json(); setNovel(data.novel); } catch (error) { console.error('There was an error!', error); } }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-gray-100 py-6 flex flex-col justify-center items-center font-noto-sans", __source: { fileName: "", lineNumber: 29, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-4xl font-bold mb-8 text-gray-800", __source: { fileName: "", lineNumber: 30, columnNumber: 7 }, __self: this }, "小説ジェネレーター"), /*#__PURE__*/ React.createElement("div", { className: "bg-white p-8 rounded-lg shadow-md w-full max-w-2xl", __source: { fileName: "", lineNumber: 31, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmit, className: "mb-8", __source: { fileName: "", lineNumber: 32, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 33, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "keyword", className: "block text-gray-700 font-bold mb-2", __source: { fileName: "", lineNumber: 34, columnNumber: 13 }, __self: this }, "キーワード入力フィールド"), /*#__PURE__*/ React.createElement("input", { type: "text", id: "keyword", name: "keyword", value: keyword, onChange: (e)=>setKeyword(e.target.value), className: "w-full px-3 py-2 text-gray-700 border rounded-lg focus:outline-none", placeholder: "小説のテーマやキャラクター名を入力", __source: { fileName: "", lineNumber: 37, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "bg-blue-500 text-white font-bold py-2 px-4 rounded-lg hover:bg-blue-600", __source: { fileName: "", lineNumber: 47, columnNumber: 11 }, __self: this }, "生成ボタン")), novel && /*#__PURE__*/ React.createElement("div", { className: "mt-8", __source: { fileName: "", lineNumber: 55, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold mb-4 text-gray-800", __source: { fileName: "", lineNumber: 56, columnNumber: 13 }, __self: this }, "小説表示エリア"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-700 whitespace-pre-line", __source: { fileName: "", lineNumber: 57, columnNumber: 13 }, __self: this }, novel)))); }