function FullWidthFileInput({ name }) { return /*#__PURE__*/ React.createElement("input", { type: "file", name: name, className: "w-full border border-gray-300 p-2 rounded", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }); } function FullWidthFileInputStory() { return /*#__PURE__*/ React.createElement("div", { className: "p-4", __source: { fileName: "", lineNumber: 13, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(FullWidthFileInput, { name: "image", __source: { fileName: "", lineNumber: 14, columnNumber: 7 }, __self: this })); } function MainComponent() { const [image, setImage] = React.useState(null); const [ocrData, setOcrData] = React.useState(null); const handleImageUpload = async (e)=>{ e.preventDefault(); const file = e.target.elements.image.files[0]; if (file) { const reader = new FileReader(); reader.onloadend = async ()=>{ const base64 = reader.result; setImage(base64); const simulatedOcrData = await simulateOcr(base64); setOcrData(simulatedOcrData); }; reader.readAsDataURL(file); } }; const simulateOcr = async (imageData)=>{ return new Promise((resolve)=>{ setTimeout(()=>{ resolve({ text: "Example text from OCR", objects: [ "object1", "object2" ] }); }, 2000); }); }; const handlePowerpointExport = ()=>{ if (ocrData) { const pptContent = `Text: ${ocrData.text}, Objects: ${ocrData.objects.join(", ")}`; alert(pptContent); } }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen flex flex-col items-center justify-center bg-gray-100", __source: { fileName: "", lineNumber: 40, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white p-8 rounded-lg shadow-lg w-[90%] md:w-[500px]", __source: { fileName: "", lineNumber: 41, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-sans mb-4 text-center text-gray-700", __source: { fileName: "", lineNumber: 42, columnNumber: 9 }, __self: this }, "画像をアップロード"), /*#__PURE__*/ React.createElement("form", { onSubmit: handleImageUpload, __source: { fileName: "", lineNumber: 43, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 44, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement(FullWidthFileInput, { name: "image", __source: { fileName: "", lineNumber: 45, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "w-full bg-blue-500 text-white p-2 rounded", __source: { fileName: "", lineNumber: 47, columnNumber: 11 }, __self: this }, "アップロード")), image && /*#__PURE__*/ React.createElement("div", { className: "mt-4", __source: { fileName: "", lineNumber: 50, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: image, alt: "アップロードされた画像", className: "w-full h-[200px] object-contain", __source: { fileName: "", lineNumber: 51, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("button", { onClick: handlePowerpointExport, className: "w-full bg-green-500 text-white p-2 rounded mt-2", __source: { fileName: "", lineNumber: 52, columnNumber: 13 }, __self: this }, "パワポを出力")))); }