function PdfUploadField({ onFileUpload }) { return /*#__PURE__*/ React.createElement("input", { type: "file", accept: "application/pdf", onChange: onFileUpload, className: "mb-4 p-2 border rounded font-roboto", name: "pdf-upload", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }); } function PdfUploadFieldStory() { const handleFileUpload = (event)=>{ console.log(event.target.files[0]); }; return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 19, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(PdfUploadField, { onFileUpload: handleFileUpload, __source: { fileName: "", lineNumber: 20, columnNumber: 7 }, __self: this })); } function MainComponent() { const [extractedText, setExtractedText] = React.useState(''); const handleFileUpload = async (event)=>{ const file = event.target.files[0]; if (!file) return; const reader = new FileReader(); reader.onload = ()=>{ const typedArray = new Uint8Array(reader.result); // Use pdf.js or another library to extract text from PDF here and set it to extractedText // For the sake of example, let's just set a placeholder text setExtractedText('This is the extracted text from the PDF.'); }; reader.readAsArrayBuffer(file); }; const displayText = extractedText ? extractedText : "Upload a PDF to extract text."; return /*#__PURE__*/ React.createElement("div", { className: "p-4 font-roboto", __source: { fileName: "", lineNumber: 21, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-bold mb-4", __source: { fileName: "", lineNumber: 22, columnNumber: 7 }, __self: this }, "PDFテキスト抽出"), /*#__PURE__*/ React.createElement(PdfUploadField, { onFileUpload: handleFileUpload, __source: { fileName: "", lineNumber: 23, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "border p-4 mt-4 rounded bg-gray-100", __source: { fileName: "", lineNumber: 24, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-semibold mb-2", __source: { fileName: "", lineNumber: 25, columnNumber: 9 }, __self: this }, "抽出されたテキスト:"), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 26, columnNumber: 9 }, __self: this }, displayText))); } function StoryComponent() { return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 33, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement(MainComponent, { __source: { fileName: "", lineNumber: 33, columnNumber: 16 }, __self: this })); }