function MainComponent({ data }) { const TableRows = data.map((row, index)=>/*#__PURE__*/ React.createElement("tr", { key: index, className: "border-b", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, row.map((cell, cellIndex)=>/*#__PURE__*/ React.createElement("td", { key: cellIndex, className: "px-6 py-4 whitespace-nowrap text-sm text-gray-500", __source: { fileName: "", lineNumber: 5, columnNumber: 9 }, __self: this }, cell)))); return /*#__PURE__*/ React.createElement("div", { className: "overflow-x-auto bg-white rounded-lg shadow overflow-y-auto relative", __source: { fileName: "", lineNumber: 11, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("table", { className: "border-collapse table-auto w-full whitespace-no-wrap bg-white table-striped relative", __source: { fileName: "", lineNumber: 12, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("thead", { __source: { fileName: "", lineNumber: 13, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("tr", { className: "text-left", __source: { fileName: "", lineNumber: 14, columnNumber: 11 }, __self: this }, data[0]?.map((header, index)=>/*#__PURE__*/ React.createElement("th", { key: index, className: "bg-blue-500 text-white p-2", __source: { fileName: "", lineNumber: 16, columnNumber: 15 }, __self: this }, header)))), /*#__PURE__*/ React.createElement("tbody", { __source: { fileName: "", lineNumber: 20, columnNumber: 9 }, __self: this }, TableRows))); } function StoryComponent() { const sampleData1 = [ [ "ID", "名前", "メール", "年齢", "国" ], [ "1", "ジョン・ドー", "john@example.com", "28", "USA" ], [ "2", "ジェーン・スミス", "jane@example.com", "32", "カナダ" ], [ "3", "サム・ジョンソン", "sam@example.com", "45", "ドイツ" ] ]; const sampleData2 = [ [ "ID", "名前", "メール", "年齢", "国" ], [ "4", "リュウ・シン", "liu@example.com", "29", "中国" ], [ "5", "カルロス・メンデス", "carlos@example.com", "34", "ブラジル" ], [ "6", "エマ・ウォルターズ", "emma@example.com", "41", "イギリス" ] ]; return /*#__PURE__*/ React.createElement("div", { className: "p-10", __source: { fileName: "", lineNumber: 44, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "font-semibold text-xl mb-5", __source: { fileName: "", lineNumber: 45, columnNumber: 7 }, __self: this }, "CSV解析ツール"), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 46, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "font-semibold text-lg mb-2", __source: { fileName: "", lineNumber: 47, columnNumber: 9 }, __self: this }, "データセット1"), /*#__PURE__*/ React.createElement(MainComponent, { data: sampleData1, __source: { fileName: "", lineNumber: 48, columnNumber: 9 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mt-10", __source: { fileName: "", lineNumber: 50, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "font-semibold text-lg mb-2", __source: { fileName: "", lineNumber: 51, columnNumber: 9 }, __self: this }, "データセット2"), /*#__PURE__*/ React.createElement(MainComponent, { data: sampleData2, __source: { fileName: "", lineNumber: 52, columnNumber: 9 }, __self: this }))); }

ID	名前	メール	年齢	国
ID	名前	メール	年齢	国
1	ジョン・ドー	john@example.com	28	USA
2	ジェーン・スミス	jane@example.com	32	カナダ
3	サム・ジョンソン	sam@example.com	45	ドイツ

ID	名前	メール	年齢	国
ID	名前	メール	年齢	国
4	リュウ・シン	liu@example.com	29	中国
5	カルロス・メンデス	carlos@example.com	34	ブラジル
6	エマ・ウォルターズ	emma@example.com	41	イギリス