function MainComponent() { const [currentTime, setCurrentTime] = React.useState(""); const [lockStatus, setLockStatus] = React.useState("unlocked"); // "unlocked" or "locked" React.useEffect(()=>{ const timer = setInterval(()=>{ const now = new Date(); const timeString = now.toLocaleTimeString('ja-JP', { hour12: false }); setCurrentTime(timeString); }, 1000); return ()=>clearInterval(timer); }, []); return /*#__PURE__*/ React.createElement("div", { className: "bg-[#1a1a1a] min-h-screen flex items-center justify-center font-roboto", __source: { fileName: "", lineNumber: 16, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-center space-y-6", __source: { fileName: "", lineNumber: 17, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-2xl text-[#ffffff]", __source: { fileName: "", lineNumber: 18, columnNumber: 9 }, __self: this }, "現在時刻"), /*#__PURE__*/ React.createElement("div", { className: "text-4xl font-bold text-[#ffffff]", __source: { fileName: "", lineNumber: 19, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("span", { id: "current-time", __source: { fileName: "", lineNumber: 20, columnNumber: 11 }, __self: this }, currentTime)), /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 22, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-xl text-[#ffffff]", __source: { fileName: "", lineNumber: 23, columnNumber: 11 }, __self: this }, "開錠時間"), /*#__PURE__*/ React.createElement("input", { type: "time", name: "unlock_time", className: "text-center w-[100px] p-2 bg-[#333333] text-[#00FF00] rounded-md", __source: { fileName: "", lineNumber: 24, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 26, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-xl text-[#ffffff]", __source: { fileName: "", lineNumber: 27, columnNumber: 11 }, __self: this }, "施錠時間"), /*#__PURE__*/ React.createElement("input", { type: "time", name: "lock_time", className: "text-center w-[100px] p-2 bg-[#333333] text-[#00FF00] rounded-md", __source: { fileName: "", lineNumber: 28, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 30, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("img", { id: "lock-status", src: lockStatus === "unlocked" ? "green-unlock.png" : "red-lock.png", alt: "鍵が開いている時の緑の画像", className: "w-[100px] h-[100px] mx-auto", __source: { fileName: "", lineNumber: 31, columnNumber: 11 }, __self: this })))); }