function MainComponent() { const [isRecording, setIsRecording] = React.useState(false); const [selectedStaff, setSelectedStaff] = React.useState([]); const [selectedClient, setSelectedClient] = React.useState(""); const [transcription, setTranscription] = React.useState(""); const [isSidebarOpen, setIsSidebarOpen] = React.useState(false); const toggleSidebar = ()=>setIsSidebarOpen(!isSidebarOpen); const handleStaffSelection = (staff)=>{ setSelectedStaff((prev)=>prev.includes(staff) ? prev.filter((s)=>s !== staff) : [ ...prev, staff ]); }; const removeStaff = (staff)=>{ setSelectedStaff((prev)=>prev.filter((s)=>s !== staff)); }; const handleClientSelection = (e)=>{ setSelectedClient(e.target.value); }; const startRecording = ()=>{ setIsRecording(true); setTranscription("Recording started..."); }; const stopRecording = ()=>{ setIsRecording(false); setTranscription((prev)=>prev + "\nRecording stopped."); }; const resetAll = ()=>{ setSelectedStaff([]); setSelectedClient(""); setTranscription(""); setIsRecording(false); }; return /*#__PURE__*/ React.createElement("div", { className: "flex h-screen bg-white", __source: { fileName: "", lineNumber: 42, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("aside", { className: `${isSidebarOpen ? "block" : "hidden"} md:flex flex-col w-64 bg-purple-100 fixed md:static inset-y-0 left-0 z-50 overflow-y-auto transition-all duration-300 ease-in-out`, __source: { fileName: "", lineNumber: 43, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "p-4", __source: { fileName: "", lineNumber: 48, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-bold text-purple-800", __source: { fileName: "", lineNumber: 49, columnNumber: 11 }, __self: this }, "Logo")), /*#__PURE__*/ React.createElement("nav", { className: "flex-1", __source: { fileName: "", lineNumber: 51, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("ul", { __source: { fileName: "", lineNumber: 52, columnNumber: 11 }, __self: this }, [ "Create Minutes", "Minutes List", "Keywords", "Staff", "Clients", "Admin Menu" ].map((item, index)=>/*#__PURE__*/ React.createElement("li", { key: index, className: "px-4 py-2 hover:bg-purple-200 text-purple-800 cursor-pointer", onClick: toggleSidebar, __source: { fileName: "", lineNumber: 61, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `fas fa-${[ "file-alt", "list", "tags", "users", "building", "cog" ][index]} mr-2`, __source: { fileName: "", lineNumber: 66, columnNumber: 17 }, __self: this }), item))))), /*#__PURE__*/ React.createElement("div", { className: "flex flex-col flex-1", __source: { fileName: "", lineNumber: 80, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "bg-purple-500 text-white p-4 shadow-md flex justify-between items-center", __source: { fileName: "", lineNumber: 81, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-xl font-bold", __source: { fileName: "", lineNumber: 82, columnNumber: 11 }, __self: this }, "Meeting Minutes App"), /*#__PURE__*/ React.createElement("button", { className: "md:hidden", onClick: toggleSidebar, __source: { fileName: "", lineNumber: 83, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-bars", __source: { fileName: "", lineNumber: 84, columnNumber: 13 }, __self: this }))), /*#__PURE__*/ React.createElement("main", { className: "flex-1 p-6 bg-gray-50 overflow-y-auto", __source: { fileName: "", lineNumber: 88, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-3xl font-bold text-purple-800 mb-6", __source: { fileName: "", lineNumber: 89, columnNumber: 11 }, __self: this }, "Create Minutes"), /*#__PURE__*/ React.createElement("section", { className: "mb-6", __source: { fileName: "", lineNumber: 93, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-xl font-semibold text-purple-700 mb-2", __source: { fileName: "", lineNumber: 94, columnNumber: 13 }, __self: this }, "Select Staff (Multiple Selection)"), /*#__PURE__*/ React.createElement("div", { className: "max-h-40 overflow-y-auto bg-white border border-gray-300 rounded p-2", __source: { fileName: "", lineNumber: 97, columnNumber: 13 }, __self: this }, [ "Staff 1", "Staff 2", "Staff 3", "Staff 4", "Staff 5" ].map((staff, index)=>/*#__PURE__*/ React.createElement("label", { key: index, className: "flex items-center mb-2", __source: { fileName: "", lineNumber: 100, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "checkbox", name: `staff-${index}`, className: "mr-2", checked: selectedStaff.includes(staff), onChange: ()=>handleStaffSelection(staff), __source: { fileName: "", lineNumber: 101, columnNumber: 21 }, __self: this }), staff))), /*#__PURE__*/ React.createElement("div", { className: "mt-2 flex flex-wrap", __source: { fileName: "", lineNumber: 113, columnNumber: 13 }, __self: this }, selectedStaff.map((staff, index)=>/*#__PURE__*/ React.createElement("span", { key: index, className: "bg-purple-200 text-purple-800 px-2 py-1 rounded mr-2 mb-2", __source: { fileName: "", lineNumber: 115, columnNumber: 17 }, __self: this }, staff, " ", /*#__PURE__*/ React.createElement("button", { className: "ml-1 text-purple-600", onClick: ()=>removeStaff(staff), __source: { fileName: "", lineNumber: 120, columnNumber: 19 }, __self: this }, "×"))))), /*#__PURE__*/ React.createElement("section", { className: "mb-6", __source: { fileName: "", lineNumber: 131, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-xl font-semibold text-purple-700 mb-2", __source: { fileName: "", lineNumber: 132, columnNumber: 13 }, __self: this }, "Select Client"), /*#__PURE__*/ React.createElement("select", { name: "client", className: "w-full p-2 border border-gray-300 rounded", value: selectedClient, onChange: handleClientSelection, __source: { fileName: "", lineNumber: 135, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "", __source: { fileName: "", lineNumber: 141, columnNumber: 15 }, __self: this }, "Select a client"), /*#__PURE__*/ React.createElement("option", { value: "client1", __source: { fileName: "", lineNumber: 142, columnNumber: 15 }, __self: this }, "Client 1"), /*#__PURE__*/ React.createElement("option", { value: "client2", __source: { fileName: "", lineNumber: 143, columnNumber: 15 }, __self: this }, "Client 2"), /*#__PURE__*/ React.createElement("option", { value: "client3", __source: { fileName: "", lineNumber: 144, columnNumber: 15 }, __self: this }, "Client 3"))), /*#__PURE__*/ React.createElement("section", { className: "mb-6 flex space-x-4", __source: { fileName: "", lineNumber: 148, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: `${isRecording ? "bg-gray-300" : "bg-purple-500"} text-white px-4 py-2 rounded disabled:bg-gray-300`, onClick: startRecording, disabled: isRecording || !selectedClient || selectedStaff.length === 0, __source: { fileName: "", lineNumber: 149, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-microphone mr-2", __source: { fileName: "", lineNumber: 158, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("button", { className: `${!isRecording ? "bg-gray-300" : "bg-red-500"} text-white px-4 py-2 rounded disabled:bg-gray-300`, onClick: stopRecording, disabled: !isRecording, __source: { fileName: "", lineNumber: 160, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-stop mr-2", __source: { fileName: "", lineNumber: 167, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("button", { className: "bg-gray-200 text-gray-700 px-4 py-2 rounded", onClick: resetAll, __source: { fileName: "", lineNumber: 169, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-redo mr-2", __source: { fileName: "", lineNumber: 173, columnNumber: 15 }, __self: this }))), /*#__PURE__*/ React.createElement("section", { __source: { fileName: "", lineNumber: 177, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-xl font-semibold text-purple-700 mb-2", __source: { fileName: "", lineNumber: 178, columnNumber: 13 }, __self: this }, "Transcription"), /*#__PURE__*/ React.createElement("div", { className: "bg-gray-100 p-4 rounded h-40 overflow-y-auto", __source: { fileName: "", lineNumber: 181, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 182, columnNumber: 15 }, __self: this }, transcription || "Transcription will appear here in real-time...")))))); }