function JapaneseTable2024({ data }) { return /*#__PURE__*/ React.createElement("div", { className: "w-full p-4", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("table", { className: "table-auto w-full border-collapse border border-[#333]", __source: { fileName: "", lineNumber: 4, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("thead", { className: "bg-[#f5f5f5]", __source: { fileName: "", lineNumber: 5, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("tr", { __source: { fileName: "", lineNumber: 6, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("th", { className: "p-3 border border-[#333]", __source: { fileName: "", lineNumber: 7, columnNumber: 13 }, __self: this }, "✔"), /*#__PURE__*/ React.createElement("th", { className: "p-3 border border-[#333]", __source: { fileName: "", lineNumber: 8, columnNumber: 13 }, __self: this }, "氏名"), /*#__PURE__*/ React.createElement("th", { className: "p-3 border border-[#333]", __source: { fileName: "", lineNumber: 9, columnNumber: 13 }, __self: this }, "性別"), /*#__PURE__*/ React.createElement("th", { className: "p-3 border border-[#333]", __source: { fileName: "", lineNumber: 10, columnNumber: 13 }, __self: this }, "居住都道府県"), /*#__PURE__*/ React.createElement("th", { className: "p-3 border border-[#333]", __source: { fileName: "", lineNumber: 11, columnNumber: 13 }, __self: this }, "所有資格"), /*#__PURE__*/ React.createElement("th", { className: "p-3 border border-[#333]", __source: { fileName: "", lineNumber: 12, columnNumber: 13 }, __self: this }, "最終ログイン日時"), /*#__PURE__*/ React.createElement("th", { className: "p-3 border border-[#333]", __source: { fileName: "", lineNumber: 13, columnNumber: 13 }, __self: this }, "編集"))), /*#__PURE__*/ React.createElement("tbody", { __source: { fileName: "", lineNumber: 16, columnNumber: 9 }, __self: this }, data.map((item, i)=>/*#__PURE__*/ React.createElement("tr", { key: i, className: "odd:bg-[#fff] even:bg-[#f0f0f0]", __source: { fileName: "", lineNumber: 18, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("td", { className: "p-3 border border-[#333]", __source: { fileName: "", lineNumber: 19, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "checkbox", name: "select", __source: { fileName: "", lineNumber: 20, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("td", { className: "p-3 border border-[#333]", __source: { fileName: "", lineNumber: 22, columnNumber: 15 }, __self: this }, item.name), /*#__PURE__*/ React.createElement("td", { className: "p-3 border border-[#333]", __source: { fileName: "", lineNumber: 23, columnNumber: 15 }, __self: this }, item.gender), /*#__PURE__*/ React.createElement("td", { className: "p-3 border border-[#333]", __source: { fileName: "", lineNumber: 24, columnNumber: 15 }, __self: this }, item.prefecture), /*#__PURE__*/ React.createElement("td", { className: "p-3 border border-[#333]", __source: { fileName: "", lineNumber: 25, columnNumber: 15 }, __self: this }, item.qualification), /*#__PURE__*/ React.createElement("td", { className: "p-3 border border-[#333]", __source: { fileName: "", lineNumber: 26, columnNumber: 15 }, __self: this }, item.lastLogin), /*#__PURE__*/ React.createElement("td", { className: "p-3 border border-[#333] text-center", __source: { fileName: "", lineNumber: 27, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: "text-blue-500 hover:text-blue-700 font-semibold", __source: { fileName: "", lineNumber: 28, columnNumber: 17 }, __self: this }, "編集🖉"))))))); } function JapaneseTable2024Story() { const data = Array.from({ length: 5 }, ()=>({ name: getRandomName(), gender: getRandomGender(), prefecture: getRandomPrefecture(), qualification: getRandomQualification(), lastLogin: getRandomLastLogin() })); return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 48, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(JapaneseTable2024, { data: data, __source: { fileName: "", lineNumber: 49, columnNumber: 7 }, __self: this })); } function getRandomName() { const names = [ "Akira", "Haruto", "Yuki", "Sakura", "Yuna" ]; return names[Math.floor(Math.random() * names.length)]; } function getRandomGender() { const genders = [ "男性", "女性" ]; return genders[Math.floor(Math.random() * genders.length)]; } function getRandomPrefecture() { const prefectures = [ "東京都", "大阪府", "北海道", "沖縄県", "愛知県" ]; return prefectures[Math.floor(Math.random() * prefectures.length)]; } function getRandomQualification() { const qualifications = [ "医師", "弁護士", "薬剤師", "エンジニア", "教師" ]; return qualifications[Math.floor(Math.random() * qualifications.length)]; } function getRandomLastLogin() { const pastDate = new Date(Date.now() - Math.floor(Math.random() * 10000000000)); return pastDate.toLocaleDateString("ja-JP"); } function getRandomName() { const names = [ "山田太郎", "佐藤花子", "鈴木次郎" ]; return names[Math.floor(Math.random() * names.length)]; } function getRandomGender() { const genders = [ "男性", "女性" ]; return genders[Math.floor(Math.random() * genders.length)]; } function getRandomPrefecture() { const prefectures = [ "東京都", "神奈川県", "大阪府" ]; return prefectures[Math.floor(Math.random() * prefectures.length)]; } function getRandomQualification() { const qualifications = [ "技術士", "弁護士", "医師" ]; return qualifications[Math.floor(Math.random() * qualifications.length)]; } function getRandomLastLogin() { const now = new Date(); const pastDate = new Date(now.getTime() - Math.random() * 10000000000); return `${pastDate.getFullYear()}-${String(pastDate.getMonth() + 1).padStart(2, '0')}-${String(pastDate.getDate()).padStart(2, '0')} ${String(pastDate.getHours()).padStart(2, '0')}:${String(pastDate.getMinutes()).padStart(2, '0')}`; } function MainComponent() { const data = Array.from({ length: 5 }, ()=>({ name: getRandomName(), gender: getRandomGender(), prefecture: getRandomPrefecture(), qualification: getRandomQualification(), lastLogin: getRandomLastLogin() })); return /*#__PURE__*/ React.createElement("div", { className: "w-full p-4", __source: { fileName: "", lineNumber: 37, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(JapaneseTable2024, { data: data, __source: { fileName: "", lineNumber: 38, columnNumber: 7 }, __self: this })); }

氏名	性別	居住都道府県	所有資格	最終ログイン日時
佐藤花子	男性	東京都	技術士	2025-04-13 04:05
山田太郎	男性	東京都	弁護士	2025-04-14 22:14
鈴木次郎	女性	大阪府	弁護士	2025-07-06 04:32
佐藤花子	女性	東京都	医師	2025-04-23 01:19
山田太郎	男性	東京都	医師	2025-06-29 14:20