function MainComponent() { const [url, setUrl] = React.useState(''); const [summary, setSummary] = React.useState('ここにスクレイピングしたウェブサイトの要約結果が表示されます。'); const [isLoading, setIsLoading] = React.useState(false); const handleSubmit = async (e)=>{ e.preventDefault(); setIsLoading(true); const summarizedContent = "これは架空の要約です。実際のウェブサイトスクレイピング結果はここに表示されます。"; setSummary(summarizedContent); setIsLoading(false); }; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center min-h-screen bg-[#f0f2f5] p-4", __source: { fileName: "", lineNumber: 13, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-4xl w-full bg-white shadow-lg rounded-lg p-6", __source: { fileName: "", lineNumber: 14, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-bold text-center text-[#333] mb-4 font-roboto", __source: { fileName: "", lineNumber: 15, columnNumber: 9 }, __self: this }, "ウェブサイトをスクレイピングして要約するサービス"), /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmit, __source: { fileName: "", lineNumber: 16, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 17, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "websiteUrl", className: "block text-sm font-medium text-[#666] mb-2 font-roboto", __source: { fileName: "", lineNumber: 18, columnNumber: 13 }, __self: this }, "ウェブサイトのURL"), /*#__PURE__*/ React.createElement("input", { type: "url", id: "websiteUrl", name: "websiteUrl", value: url, onChange: (e)=>setUrl(e.target.value), className: "shadow-sm bg-white border border-[#ddd] rounded-md w-full p-2 text-sm text-[#333]", placeholder: "https://example.com", __source: { fileName: "", lineNumber: 19, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex justify-center", __source: { fileName: "", lineNumber: 21, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("button", { type: "submit", className: "bg-[#007bff] hover:bg-[#0069d9] text-white font-medium rounded-md px-4 py-2", disabled: isLoading, __source: { fileName: "", lineNumber: 22, columnNumber: 13 }, __self: this }, isLoading ? '処理中...' : '要約開始')))), /*#__PURE__*/ React.createElement("div", { className: "max-w-4xl w-full bg-white shadow-lg rounded-lg p-6 mt-8", __source: { fileName: "", lineNumber: 28, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-bold text-center text-[#333] mb-4 font-roboto", __source: { fileName: "", lineNumber: 29, columnNumber: 9 }, __self: this }, "要約結果"), /*#__PURE__*/ React.createElement("p", { className: "text-sm text-[#666] font-roboto", __source: { fileName: "", lineNumber: 30, columnNumber: 9 }, __self: this }, summary))); }