function MainComponent() { const projects = [ { name: "プロジェクトA", status: "進行中", startDate: "2023-01-01", endDate: "2023-06-30" }, { name: "プロジェクトB", status: "完了", startDate: "2022-08-15", endDate: "2023-02-15" } ]; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen flex flex-col items-center bg-gray-100 p-5", __source: { fileName: "", lineNumber: 18, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "w-full bg-blue-500 text-white p-4 text-center font-semibold text-xl font-sans", __source: { fileName: "", lineNumber: 19, columnNumber: 7 }, __self: this }, "業務管理アプリ"), /*#__PURE__*/ React.createElement("div", { className: "w-full max-w-4xl bg-white shadow-lg rounded-lg p-6 mt-5", __source: { fileName: "", lineNumber: 20, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-medium font-sans mb-4", __source: { fileName: "", lineNumber: 21, columnNumber: 9 }, __self: this }, "プロジェクトリスト"), /*#__PURE__*/ React.createElement("table", { className: "w-full text-left border-collapse", __source: { fileName: "", lineNumber: 22, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("thead", { __source: { fileName: "", lineNumber: 23, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("tr", { __source: { fileName: "", lineNumber: 24, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("th", { className: "border-b p-2 font-sans text-lg", __source: { fileName: "", lineNumber: 25, columnNumber: 15 }, __self: this }, "プロジェクト名"), /*#__PURE__*/ React.createElement("th", { className: "border-b p-2 font-sans text-lg", __source: { fileName: "", lineNumber: 26, columnNumber: 15 }, __self: this }, "ステータス"), /*#__PURE__*/ React.createElement("th", { className: "border-b p-2 font-sans text-lg", __source: { fileName: "", lineNumber: 27, columnNumber: 15 }, __self: this }, "開始日"), /*#__PURE__*/ React.createElement("th", { className: "border-b p-2 font-sans text-lg", __source: { fileName: "", lineNumber: 28, columnNumber: 15 }, __self: this }, "締め切り"))), /*#__PURE__*/ React.createElement("tbody", { __source: { fileName: "", lineNumber: 31, columnNumber: 11 }, __self: this }, projects.map((project, index)=>/*#__PURE__*/ React.createElement("tr", { key: index, __source: { fileName: "", lineNumber: 33, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("td", { className: "border-b p-2 font-sans", __source: { fileName: "", lineNumber: 34, columnNumber: 17 }, __self: this }, project.name), /*#__PURE__*/ React.createElement("td", { className: "border-b p-2 font-sans", __source: { fileName: "", lineNumber: 35, columnNumber: 17 }, __self: this }, project.status), /*#__PURE__*/ React.createElement("td", { className: "border-b p-2 font-sans", __source: { fileName: "", lineNumber: 36, columnNumber: 17 }, __self: this }, project.startDate), /*#__PURE__*/ React.createElement("td", { className: "border-b p-2 font-sans", __source: { fileName: "", lineNumber: 37, columnNumber: 17 }, __self: this }, project.endDate))))))); }

プロジェクト名	ステータス	開始日	締め切り
プロジェクトA	進行中	2023-01-01	2023-06-30
プロジェクトB	完了	2022-08-15	2023-02-15