function MainComponent() { const [audioFile, setAudioFile] = React.useState(null); const [transcript, setTranscript] = React.useState(""); const [isLoading, setIsLoading] = React.useState(false); const handleFileChange = (e)=>{ setAudioFile(e.target.files[0]); }; const handleSubmit = async (e)=>{ e.preventDefault(); setIsLoading(true); try { const response = await fetch('/integrations/transcribe-audio-2/listen', { method: 'POST', body: audioFile, headers: { 'Content-Type': audioFile.type } }); const data = await response.json(); const transcribedText = data.results.channels[0].alternatives[0].transcript; setTranscript(transcribedText); } catch (error) { console.error('音声の文字起こしエラー:', error); } setIsLoading(false); }; return /*#__PURE__*/ React.createElement("div", { className: "bg-[#f9f9f9] min-h-screen font-noto-sans", __source: { fileName: "", lineNumber: 34, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("main", { className: "container mx-auto px-4 py-12", __source: { fileName: "", lineNumber: 37, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("section", { className: "mb-16", __source: { fileName: "", lineNumber: 40, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-4xl font-bold mb-8 text-center", __source: { fileName: "", lineNumber: 41, columnNumber: 11 }, __self: this }, "音声をテキストに変換"), /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmit, className: "max-w-xl mx-auto", __source: { fileName: "", lineNumber: 42, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-6", __source: { fileName: "", lineNumber: 43, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "audio", className: "block mb-2 font-bold text-lg", __source: { fileName: "", lineNumber: 44, columnNumber: 15 }, __self: this }, "音声ファイルを選択"), /*#__PURE__*/ React.createElement("input", { type: "file", id: "audio", name: "audio", accept: "audio/*", onChange: handleFileChange, className: "w-full px-4 py-3 rounded-lg border-2 border-gray-200 focus:outline-none focus:border-[#333]", required: true, __source: { fileName: "", lineNumber: 45, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("button", { type: "submit", disabled: isLoading, className: "bg-[#333] text-white text-lg font-bold px-8 py-3 rounded-lg hover:bg-[#555] transition duration-300 disabled:opacity-50 disabled:cursor-not-allowed", __source: { fileName: "", lineNumber: 55, columnNumber: 13 }, __self: this }, isLoading ? '変換中...' : '変換')), transcript && /*#__PURE__*/ React.createElement("div", { className: "mt-8", __source: { fileName: "", lineNumber: 64, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-2xl font-bold mb-4", __source: { fileName: "", lineNumber: 65, columnNumber: 15 }, __self: this }, "変換結果:"), /*#__PURE__*/ React.createElement("p", { className: "text-lg whitespace-pre-wrap", __source: { fileName: "", lineNumber: 66, columnNumber: 15 }, __self: this }, transcript))), /*#__PURE__*/ React.createElement("section", { __source: { fileName: "", lineNumber: 71, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-4xl font-bold mb-8 text-center", __source: { fileName: "", lineNumber: 72, columnNumber: 11 }, __self: this }, "お問い合わせ")))); }