function MainComponent() { const [csvData, setCsvData] = React.useState([]); const handleFileUpload = (event)=>{ const file = event.target.files[0]; const reader = new FileReader(); reader.onload = function(e) { const text = e.target.result; const rows = text.split('\n').map((row)=>row.split(',')); setCsvData(rows); }; reader.readAsText(file); }; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center p-4", __source: { fileName: "", lineNumber: 18, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 19, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "csvFile", className: "block text-sm font-semibold text-gray-700", __source: { fileName: "", lineNumber: 20, columnNumber: 9 }, __self: this }, "CSVファイルを選択:"), /*#__PURE__*/ React.createElement("input", { type: "file", id: "csvFile", name: "csvFile", accept: ".csv", className: "mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm", onChange: handleFileUpload, __source: { fileName: "", lineNumber: 21, columnNumber: 9 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mt-8 w-full overflow-x-auto", __source: { fileName: "", lineNumber: 23, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("table", { className: "w-full whitespace-no-wrap", __source: { fileName: "", lineNumber: 24, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("thead", { __source: { fileName: "", lineNumber: 25, columnNumber: 11 }, __self: this }, csvData.length > 0 && /*#__PURE__*/ React.createElement("tr", { className: "text-left font-semibold", __source: { fileName: "", lineNumber: 27, columnNumber: 15 }, __self: this }, csvData[0].map((header, index)=>/*#__PURE__*/ React.createElement("th", { key: index, className: "px-6 pt-6 pb-4", __source: { fileName: "", lineNumber: 29, columnNumber: 19 }, __self: this }, header)))), /*#__PURE__*/ React.createElement("tbody", { __source: { fileName: "", lineNumber: 34, columnNumber: 11 }, __self: this }, csvData.slice(1).map((row, rowIndex)=>/*#__PURE__*/ React.createElement("tr", { key: rowIndex, __source: { fileName: "", lineNumber: 36, columnNumber: 15 }, __self: this }, row.map((cell, cellIndex)=>/*#__PURE__*/ React.createElement("td", { key: cellIndex, className: "border-t px-6 pt-4 pb-2", __source: { fileName: "", lineNumber: 38, columnNumber: 19 }, __self: this }, cell)))))))); }