function MainComponent() { const [events, setEvents] = React.useState([ { eventName: '', nasCalendarEventName: '', startTime: '09:00', endTime: '17:30', allDayFlag: false } ]); const addEvent = ()=>{ setEvents((events)=>[ ...events, { eventName: '', nasCalendarEventName: '', startTime: '09:00', endTime: '17:30', allDayFlag: false } ]); }; const removeEvent = (index)=>{ setEvents((events)=>events.filter((_, i)=>i !== index)); }; const handleInputChange = (index, field, value)=>{ setEvents((events)=>events.map((event, i)=>i === index ? { ...event, [field]: value } : event)); }; const handleSubmit = ()=>{ // Registration logic here }; const copyFromCalendar = ()=>{ // Navigate to other screen here }; return /*#__PURE__*/ React.createElement("div", { className: "container mx-auto p-4", __source: { fileName: "", lineNumber: 32, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "font-roboto", __source: { fileName: "", lineNumber: 33, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col md:flex-row justify-between mb-4", __source: { fileName: "", lineNumber: 34, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: "px-4 py-2 bg-[#3490dc] text-white rounded-full hover:bg-[#2779bd] mb-2 md:mb-0 md:order-1", onClick: addEvent, __source: { fileName: "", lineNumber: 35, columnNumber: 11 }, __self: this }, "追加"), /*#__PURE__*/ React.createElement("div", { className: "flex md:order-3", __source: { fileName: "", lineNumber: 41, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: "px-4 py-2 bg-[#38c172] text-white rounded-full hover:bg-[#2ca35e] mr-2", onClick: handleSubmit, __source: { fileName: "", lineNumber: 42, columnNumber: 13 }, __self: this }, "登録"), /*#__PURE__*/ React.createElement("button", { className: "px-4 py-2 bg-[#ffed4a] text-gray-700 rounded-full hover:bg-[#f2d024]", onClick: copyFromCalendar, __source: { fileName: "", lineNumber: 48, columnNumber: 13 }, __self: this }, "ナスカレからコピー"))), /*#__PURE__*/ React.createElement("div", { className: "overflow-x-auto", __source: { fileName: "", lineNumber: 56, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("table", { className: "min-w-full", __source: { fileName: "", lineNumber: 57, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("thead", { __source: { fileName: "", lineNumber: 58, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("tr", { className: "bg-[#d9d9d9] text-left", __source: { fileName: "", lineNumber: 59, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("th", { className: "px-4 py-2", __source: { fileName: "", lineNumber: 60, columnNumber: 17 }, __self: this }, "イベント名"), /*#__PURE__*/ React.createElement("th", { className: "px-4 py-2", __source: { fileName: "", lineNumber: 61, columnNumber: 17 }, __self: this }, "ナスカレイベント名"), /*#__PURE__*/ React.createElement("th", { className: "px-4 py-2", __source: { fileName: "", lineNumber: 62, columnNumber: 17 }, __self: this }, "開始時間"), /*#__PURE__*/ React.createElement("th", { className: "px-4 py-2", __source: { fileName: "", lineNumber: 63, columnNumber: 17 }, __self: this }, "終了時間"), /*#__PURE__*/ React.createElement("th", { className: "px-4 py-2", __source: { fileName: "", lineNumber: 64, columnNumber: 17 }, __self: this }, "終日フラグ"), /*#__PURE__*/ React.createElement("th", { className: "px-4 py-2", __source: { fileName: "", lineNumber: 65, columnNumber: 17 }, __self: this }, "削除"))), /*#__PURE__*/ React.createElement("tbody", { __source: { fileName: "", lineNumber: 68, columnNumber: 13 }, __self: this }, events.map((event, index)=>/*#__PURE__*/ React.createElement("tr", { className: "border-b", key: index, __source: { fileName: "", lineNumber: 70, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("td", { className: "px-4 py-2", __source: { fileName: "", lineNumber: 71, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", name: "eventName", className: "border p-1 rounded-full w-full", value: event.eventName, onChange: (e)=>handleInputChange(index, 'eventName', e.target.value), __source: { fileName: "", lineNumber: 72, columnNumber: 21 }, __self: this })), /*#__PURE__*/ React.createElement("td", { className: "px-4 py-2", __source: { fileName: "", lineNumber: 80, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", name: "nasCalendarEventName", className: "border p-1 rounded-full w-full", value: event.nasCalendarEventName, onChange: (e)=>handleInputChange(index, 'nasCalendarEventName', e.target.value), __source: { fileName: "", lineNumber: 81, columnNumber: 21 }, __self: this })), /*#__PURE__*/ React.createElement("td", { className: "px-4 py-2", __source: { fileName: "", lineNumber: 89, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "time", name: "startTime", className: "border p-1 rounded-full w-full", value: event.startTime, onChange: (e)=>handleInputChange(index, 'startTime', e.target.value), __source: { fileName: "", lineNumber: 90, columnNumber: 21 }, __self: this })), /*#__PURE__*/ React.createElement("td", { className: "px-4 py-2", __source: { fileName: "", lineNumber: 98, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "time", name: "endTime", className: "border p-1 rounded-full w-full", value: event.endTime, onChange: (e)=>handleInputChange(index, 'endTime', e.target.value), __source: { fileName: "", lineNumber: 99, columnNumber: 21 }, __self: this })), /*#__PURE__*/ React.createElement("td", { className: "px-4 py-2", __source: { fileName: "", lineNumber: 107, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "checkbox", name: "allDayFlag", className: "rounded-lg", checked: event.allDayFlag, onChange: (e)=>handleInputChange(index, 'allDayFlag', e.target.checked), __source: { fileName: "", lineNumber: 108, columnNumber: 21 }, __self: this })), /*#__PURE__*/ React.createElement("td", { className: "px-4 py-2", __source: { fileName: "", lineNumber: 116, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: "text-gray-600 rounded-full p-2 hover:bg-gray-200", onClick: ()=>removeEvent(index), __source: { fileName: "", lineNumber: 117, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fa fa-trash", __source: { fileName: "", lineNumber: 121, columnNumber: 23 }, __self: this })))))))), /*#__PURE__*/ React.createElement("textarea", { name: "comment", className: "mt-4 w-full p-2 border rounded-lg", placeholder: "コメントからコピー", rows: "3", __source: { fileName: "", lineNumber: 129, columnNumber: 9 }, __self: this }))); }