function MainComponent() { const [actions, setActions] = React.useState([]); const [newAction, setNewAction] = React.useState(''); const [emergency, setEmergency] = React.useState(false); const toggleEmergency = ()=>setEmergency(!emergency); const addAction = (event)=>{ event.preventDefault(); if (newAction.trim() !== '') { setActions([ ...actions, { text: newAction.trim(), isEmergency: emergency } ]); setNewAction(''); } }; const removeAction = (index)=>{ const updatedActions = actions.filter((_, actionIndex)=>actionIndex !== index); setActions(updatedActions); }; const handleNewActionChange = (event)=>{ setNewAction(event.target.value); }; const actionElements = actions.map((action, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: `flex items-center justify-between ${action.isEmergency ? 'bg-[#ffcccc]' : 'bg-[#f1f1f1]'} p-4 mb-2 rounded-md`, __source: { fileName: "", lineNumber: 26, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: `font-roboto ${action.isEmergency ? 'text-[#ff0000]' : ''}`, __source: { fileName: "", lineNumber: 27, columnNumber: 7 }, __self: this }, action.text), /*#__PURE__*/ React.createElement("button", { onClick: ()=>removeAction(index), className: "text-[#ff0000] text-xl p-2 hover:bg-[#ff0000] hover:text-white rounded-full transition-colors duration-300", __source: { fileName: "", lineNumber: 28, columnNumber: 7 }, __self: this }, "🗑️"))); return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col p-6 space-y-6", __source: { fileName: "", lineNumber: 38, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-roboto text-[#121212]", __source: { fileName: "", lineNumber: 39, columnNumber: 7 }, __self: this }, emergency ? 'Emergency Action Plan' : 'Action Plan'), /*#__PURE__*/ React.createElement("form", { className: "flex space-x-4", onSubmit: addAction, __source: { fileName: "", lineNumber: 40, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", name: "actionInput", className: "flex-grow p-4 border border-[#ddd] rounded-md font-roboto", placeholder: "Add a new action", value: newAction, onChange: handleNewActionChange, __source: { fileName: "", lineNumber: 41, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("button", { type: "button", onClick: toggleEmergency, className: `px-6 py-3 rounded-md font-roboto ${emergency ? 'bg-[#ff0000] text-white' : 'bg-[#f8f9fa] text-[#121212]'}`, __source: { fileName: "", lineNumber: 49, columnNumber: 9 }, __self: this }, emergency ? 'Emergency' : 'Normal'), /*#__PURE__*/ React.createElement("button", { type: "submit", className: `bg-[#007bff] text-white px-6 py-3 rounded-md font-roboto hover:bg-[#0056b3] transition-colors duration-300`, __source: { fileName: "", lineNumber: 56, columnNumber: 9 }, __self: this }, "Add")), /*#__PURE__*/ React.createElement("div", { className: "space-y-2", __source: { fileName: "", lineNumber: 63, columnNumber: 7 }, __self: this }, actionElements)); }