function ClubCleanerLabel({ htmlFor, children }) { return /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium text-gray-700", htmlFor: htmlFor, __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, children); } function ClubCleanerLabelStory() { return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 11, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(ClubCleanerLabel, { htmlFor: "person", __source: { fileName: "", lineNumber: 12, columnNumber: 7 }, __self: this }, "掃除した人の名前")); } function MainComponent() { const handleSubmit = (event)=>{ event.preventDefault(); const location = event.target.location.value; const person = event.target.person.value; alert(`掃除場所: ${location}, 掃除した人の名前: ${person}`); }; return /*#__PURE__*/ React.createElement("div", { className: "p-6 bg-gray-100 h-screen font-sans", __source: { fileName: "", lineNumber: 10, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-bold mb-4", __source: { fileName: "", lineNumber: 11, columnNumber: 7 }, __self: this }, "部活の掃除記録"), /*#__PURE__*/ React.createElement("form", { className: "space-y-4", onSubmit: handleSubmit, __source: { fileName: "", lineNumber: 12, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 13, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium text-gray-700", htmlFor: "location", __source: { fileName: "", lineNumber: 14, columnNumber: 11 }, __self: this }, "掃除場所"), /*#__PURE__*/ React.createElement("input", { type: "text", id: "location", name: "location", className: "mt-1 block w-full border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500", __source: { fileName: "", lineNumber: 15, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 17, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", id: "person", name: "person", className: "mt-1 block w-full border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500", __source: { fileName: "", lineNumber: 19, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "w-full py-2 px-4 bg-blue-600 text-white font-semibold rounded-md shadow-sm hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500", __source: { fileName: "", lineNumber: 21, columnNumber: 9 }, __self: this }, "記録する"))); }