function MainComponent() { const [username, setUsername] = React.useState(''); const [password, setPassword] = React.useState(''); const handleLogin = (e)=>{ e.preventDefault(); }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen flex flex-col items-center justify-center bg-[#EAE2B7] space-y-8", __source: { fileName: "", lineNumber: 10, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-5 gap-4", __source: { fileName: "", lineNumber: 11, columnNumber: 7 }, __self: this }, [ ...Array.from({ length: 10 }).keys() ].map((_, index)=>/*#__PURE__*/ React.createElement("img", { key: index, src: `/cats/cat${index + 1}.png`, alt: `Cat number ${index + 1}`, className: "w-[80px] h-[80px]", __source: { fileName: "", lineNumber: 13, columnNumber: 11 }, __self: this }))), /*#__PURE__*/ React.createElement("form", { className: "p-10 bg-[#FBCB0A] rounded-lg shadow-md w-[90%] max-w-[400px]", onSubmit: handleLogin, __source: { fileName: "", lineNumber: 16, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-bold text-center mb-6 text-[#333533]", __source: { fileName: "", lineNumber: 17, columnNumber: 9 }, __self: this }, "🐱 猫ログイン"), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 18, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "username", className: "block mb-2 font-medium text-[#333533]", __source: { fileName: "", lineNumber: 19, columnNumber: 11 }, __self: this }, "ユーザー名"), /*#__PURE__*/ React.createElement("input", { type: "text", name: "username", id: "username", value: username, onChange: (e)=>setUsername(e.target.value), className: "w-full p-3 mb-4 border border-[#333533] rounded-md", placeholder: "例：yourname@example.com", __source: { fileName: "", lineNumber: 20, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 22, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "password", className: "block mb-2 font-medium text-[#333533]", __source: { fileName: "", lineNumber: 23, columnNumber: 11 }, __self: this }, "パスワード"), /*#__PURE__*/ React.createElement("input", { type: "password", name: "password", id: "password", value: password, onChange: (e)=>setPassword(e.target.value), className: "w-full p-3 mb-6 border border-[#333533] rounded-md", placeholder: "パスワードを入力", __source: { fileName: "", lineNumber: 24, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "w-full bg-[#FFD700] hover:bg-[#ffc700] text-[#333533] p-3 rounded-md font-medium", __source: { fileName: "", lineNumber: 26, columnNumber: 9 }, __self: this }, "ログイン"))); }