function PortfolioCard({ logoUrl, companyName, investmentAmount, metrics = [], status = "active", performanceData = [], stage = "Series A", onViewDetails, onContactTeam, onEditClick, onChartClick, onDocumentsClick }) { const [isHovered, setIsHovered] = useState(false); return /*#__PURE__*/ React.createElement("div", { className: "rounded-lg border border-gray-200 p-6 bg-white shadow-sm hover:shadow-md transition-shadow duration-200", onMouseEnter: ()=>setIsHovered(true), onMouseLeave: ()=>setIsHovered(false), __source: { fileName: "", lineNumber: 18, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-start justify-between mb-6", __source: { fileName: "", lineNumber: 23, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-4", __source: { fileName: "", lineNumber: 24, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "relative", __source: { fileName: "", lineNumber: 25, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: logoUrl, alt: `${companyName} logo`, className: "w-16 h-16 rounded-full object-contain bg-gray-50", __source: { fileName: "", lineNumber: 26, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: `absolute -top-1 -right-1 w-3 h-3 rounded-full border-2 border-white ${status === "active" ? "bg-green-500" : status === "warning" ? "bg-yellow-500" : "bg-gray-500"}`, __source: { fileName: "", lineNumber: 31, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 41, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-2 mb-1", __source: { fileName: "", lineNumber: 42, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "font-semibold text-lg", __source: { fileName: "", lineNumber: 43, columnNumber: 15 }, __self: this }, companyName), /*#__PURE__*/ React.createElement("span", { className: "text-sm bg-blue-50 text-blue-700 px-2 py-0.5 rounded-full font-medium", __source: { fileName: "", lineNumber: 44, columnNumber: 15 }, __self: this }, stage)), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600 text-sm", __source: { fileName: "", lineNumber: 48, columnNumber: 13 }, __self: this }, "Investment: $", investmentAmount.toLocaleString()))), /*#__PURE__*/ React.createElement("div", { className: "flex gap-1", __source: { fileName: "", lineNumber: 54, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: onChartClick, className: "p-2 text-gray-400 hover:text-blue-600 rounded-lg hover:bg-blue-50 transition-colors", __source: { fileName: "", lineNumber: 55, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-chart-line", __source: { fileName: "", lineNumber: 59, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("button", { onClick: onDocumentsClick, className: "p-2 text-gray-400 hover:text-blue-600 rounded-lg hover:bg-blue-50 transition-colors", __source: { fileName: "", lineNumber: 61, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-file-alt", __source: { fileName: "", lineNumber: 65, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("button", { onClick: onEditClick, className: "p-2 text-gray-400 hover:text-blue-600 rounded-lg hover:bg-blue-50 transition-colors", __source: { fileName: "", lineNumber: 67, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-edit", __source: { fileName: "", lineNumber: 71, columnNumber: 13 }, __self: this })))), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-2 md:grid-cols-3 gap-4 mb-6", __source: { fileName: "", lineNumber: 76, columnNumber: 7 }, __self: this }, metrics.map((metric, index)=>/*#__PURE__*/ React.createElement(MetricsCard, { key: index, title: metric.title, value: metric.value, percentChange: metric.change, __source: { fileName: "", lineNumber: 78, columnNumber: 11 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: `flex gap-3 transition-opacity duration-200 ${isHovered ? "opacity-100" : "opacity-0"}`, __source: { fileName: "", lineNumber: 87, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: onViewDetails, className: "flex-1 bg-blue-600 hover:bg-blue-700 text-white py-2 px-4 rounded-lg transition-colors flex items-center justify-center", __source: { fileName: "", lineNumber: 92, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-chart-pie mr-2", __source: { fileName: "", lineNumber: 96, columnNumber: 11 }, __self: this }), "View Details"), /*#__PURE__*/ React.createElement("button", { onClick: onContactTeam, className: "flex-1 bg-gray-100 hover:bg-gray-200 text-gray-700 py-2 px-4 rounded-lg transition-colors flex items-center justify-center", __source: { fileName: "", lineNumber: 99, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-comments mr-2", __source: { fileName: "", lineNumber: 103, columnNumber: 11 }, __self: this }), "Contact Team"))); } function PortfolioCardStory() { const handleAction = (action)=>{ console.log(`${action} clicked`); }; const sampleData = { logoUrl: "/sample-logo.png", companyName: "Tech Innovators Inc", investmentAmount: 5000000, status: "active", stage: "Series A", metrics: [ { title: "Revenue", value: "$2.4M", change: 12 }, { title: "Users", value: "85k", change: 8 }, { title: "Growth", value: "32%", change: -5 } ], onViewDetails: ()=>handleAction("View Details"), onContactTeam: ()=>handleAction("Contact Team"), onEditClick: ()=>handleAction("Edit"), onChartClick: ()=>handleAction("Chart"), onDocumentsClick: ()=>handleAction("Documents") }; const warningData = { ...sampleData, status: "warning", companyName: "Warning Corp", stage: "Seed" }; const inactiveData = { ...sampleData, status: "inactive", companyName: "Inactive Inc", stage: "Series B" }; return /*#__PURE__*/ React.createElement("div", { className: "p-6 space-y-6 bg-gray-50", __source: { fileName: "", lineNumber: 149, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(PortfolioCard, { ...sampleData, __source: { fileName: "", lineNumber: 150, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(PortfolioCard, { ...warningData, __source: { fileName: "", lineNumber: 151, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(PortfolioCard, { ...inactiveData, __source: { fileName: "", lineNumber: 152, columnNumber: 7 }, __self: this })); } function SideNavigation() { const [isOpen, setIsOpen] = useState(true); const [activeLink, setActiveLink] = useState("Dashboard"); const [showQuickMenu, setShowQuickMenu] = useState(false); const [showRecents, setShowRecents] = useState(false); const [showNotifications, setShowNotifications] = useState(false); const [isSearchOpen, setIsSearchOpen] = useState(false); const [searchQuery, setSearchQuery] = useState(""); const links = [ { name: "Dashboard", icon: "fa-gauge", path: "/", notifications: 0 }, { name: "Portfolio", icon: "fa-briefcase", path: "/portfolio", notifications: 2 }, { name: "Pipeline", icon: "fa-stream", path: "/pipeline", notifications: 5 }, { name: "LP Management", icon: "fa-users", path: "/lp", notifications: 0 }, { name: "Analytics", icon: "fa-chart-line", path: "/analytics", notifications: 0 }, { name: "Documents", icon: "fa-folder", path: "/documents", notifications: 3 } ]; const quickActions = [ { name: "Add Deal", icon: "fa-plus-circle", path: "/pipeline?action=new" }, { name: "New Report", icon: "fa-file-alt", path: "/documents?action=new" }, { name: "Schedule Meeting", icon: "fa-calendar", path: "/analytics" } ]; const recentItems = [ { name: "TechCorp Deal", type: "Deal", icon: "fa-handshake", path: "/deal/techcorp", time: "2h ago" }, { name: "Q4 Report", type: "Document", icon: "fa-file", path: "/documents/q4-report", time: "5h ago" }, { name: "LP Meeting Notes", type: "Document", icon: "fa-file-alt", path: "/documents/lp-notes", time: "1d ago" } ]; const notifications = [ { title: "New Deal Added", message: "TechCorp deal has been added to pipeline", path: "/deal/techcorp", time: "2h ago", unread: true }, { title: "Document Updated", message: "Q4 Report has been updated", path: "/documents/q4-report", time: "5h ago", unread: true }, { title: "Meeting Reminder", message: "LP Meeting in 30 minutes", path: "/analytics", time: "1d ago", unread: false } ]; const searchResults = useMemo(()=>{ if (!searchQuery) return []; const query = searchQuery.toLowerCase(); return [ ...links.filter((link)=>link.name.toLowerCase().includes(query)).map((link)=>({ ...link, type: "Navigation" })), ...recentItems.filter((item)=>item.name.toLowerCase().includes(query)).map((item)=>({ ...item, type: "Recent" })), ...quickActions.filter((action)=>action.name.toLowerCase().includes(query)).map((action)=>({ ...action, type: "Action" })) ].slice(0, 5); }, [ searchQuery, links, recentItems, quickActions ]); return /*#__PURE__*/ React.createElement("div", { className: "flex h-screen", __source: { fileName: "", lineNumber: 110, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `bg-[#1a1a1a] text-white transition-all duration-300 ${isOpen ? "w-[288px]" : "w-20"} min-h-screen fixed top-0 left-0 shadow-xl flex flex-col z-[100]`, __source: { fileName: "", lineNumber: 111, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "p-4 border-b border-[#2a2a2a]", __source: { fileName: "", lineNumber: 116, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center mb-3", __source: { fileName: "", lineNumber: 117, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: `font-roboto text-xl ${!isOpen && "hidden"}`, __source: { fileName: "", lineNumber: 118, columnNumber: 13 }, __self: this }, "Menu"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setIsOpen(!isOpen), className: "text-white hover:text-gray-300 w-8 h-8 rounded-full bg-[#2a2a2a] flex items-center justify-center transition-colors", __source: { fileName: "", lineNumber: 121, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `fas ${isOpen ? "fa-chevron-left" : "fa-chevron-right"}`, __source: { fileName: "", lineNumber: 125, columnNumber: 15 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: `relative ${!isOpen && "hidden"}`, __source: { fileName: "", lineNumber: 131, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "relative", __source: { fileName: "", lineNumber: 132, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", placeholder: "Search...", value: searchQuery, onChange: (e)=>setSearchQuery(e.target.value), onFocus: ()=>setIsSearchOpen(true), className: "w-full bg-[#2a2a2a] text-white rounded-lg pl-10 pr-4 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-blue-500", __source: { fileName: "", lineNumber: 133, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("i", { className: "fas fa-search absolute left-3 top-2.5 text-gray-400", __source: { fileName: "", lineNumber: 141, columnNumber: 15 }, __self: this }), searchQuery && /*#__PURE__*/ React.createElement("button", { onClick: ()=>setSearchQuery(""), className: "absolute right-3 top-2.5 text-gray-400 hover:text-white", __source: { fileName: "", lineNumber: 143, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-times", __source: { fileName: "", lineNumber: 147, columnNumber: 19 }, __self: this }))), isSearchOpen && searchQuery && /*#__PURE__*/ React.createElement("div", { className: "absolute w-full mt-2 bg-[#2a2a2a] rounded-lg shadow-xl border border-[#3a3a3a] z-[110]", __source: { fileName: "", lineNumber: 153, columnNumber: 15 }, __self: this }, searchResults.length > 0 ? searchResults.map((result, index)=>/*#__PURE__*/ React.createElement("a", { key: index, href: result.path, className: "flex items-center px-4 py-3 hover:bg-[#3a3a3a] transition-colors", __source: { fileName: "", lineNumber: 156, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `fas ${result.icon} text-blue-400 w-5`, __source: { fileName: "", lineNumber: 161, columnNumber: 23 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "ml-3", __source: { fileName: "", lineNumber: 162, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-sm", __source: { fileName: "", lineNumber: 163, columnNumber: 25 }, __self: this }, result.name), /*#__PURE__*/ React.createElement("div", { className: "text-xs text-gray-400", __source: { fileName: "", lineNumber: 164, columnNumber: 25 }, __self: this }, result.type)))) : /*#__PURE__*/ React.createElement("div", { className: "px-4 py-3 text-sm text-gray-400", __source: { fileName: "", lineNumber: 171, columnNumber: 19 }, __self: this }, "No results found")))), /*#__PURE__*/ React.createElement("nav", { className: "flex-1 overflow-y-auto p-4 space-y-6", __source: { fileName: "", lineNumber: 180, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-3 gap-2", __source: { fileName: "", lineNumber: 181, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "relative", __source: { fileName: "", lineNumber: 182, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>{ setShowQuickMenu(!showQuickMenu); setShowRecents(false); setShowNotifications(false); }, className: "w-full flex items-center justify-center p-3 rounded-lg bg-[#2a2a2a] hover:bg-[#3a3a3a] transition-colors shadow-md", __source: { fileName: "", lineNumber: 183, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-bolt text-yellow-400", __source: { fileName: "", lineNumber: 191, columnNumber: 17 }, __self: this }), isOpen && /*#__PURE__*/ React.createElement("span", { className: "ml-2 text-sm", __source: { fileName: "", lineNumber: 192, columnNumber: 28 }, __self: this }, "Quick")), showQuickMenu && isOpen && /*#__PURE__*/ React.createElement("div", { className: "absolute left-0 right-0 mt-2 bg-[#2a2a2a] rounded-lg py-2 z-[110] shadow-xl border border-[#3a3a3a]", __source: { fileName: "", lineNumber: 195, columnNumber: 17 }, __self: this }, quickActions.map((action)=>/*#__PURE__*/ React.createElement("a", { key: action.name, href: action.path, className: "flex items-center px-4 py-2.5 hover:bg-[#3a3a3a] transition-colors", __source: { fileName: "", lineNumber: 197, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `fas ${action.icon} text-blue-400`, __source: { fileName: "", lineNumber: 202, columnNumber: 23 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "ml-3 text-sm", __source: { fileName: "", lineNumber: 203, columnNumber: 23 }, __self: this }, action.name))))), /*#__PURE__*/ React.createElement("div", { className: "relative", __source: { fileName: "", lineNumber: 210, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>{ setShowRecents(!showRecents); setShowQuickMenu(false); setShowNotifications(false); }, className: "w-full flex items-center justify-center p-3 rounded-lg bg-[#2a2a2a] hover:bg-[#3a3a3a] transition-colors shadow-md", __source: { fileName: "", lineNumber: 211, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-clock text-green-400", __source: { fileName: "", lineNumber: 219, columnNumber: 17 }, __self: this }), isOpen && /*#__PURE__*/ React.createElement("span", { className: "ml-2 text-sm", __source: { fileName: "", lineNumber: 220, columnNumber: 28 }, __self: this }, "Recent")), showRecents && isOpen && /*#__PURE__*/ React.createElement("div", { className: "absolute left-0 right-0 mt-2 bg-[#2a2a2a] rounded-lg py-2 z-[110] shadow-xl border border-[#3a3a3a]", __source: { fileName: "", lineNumber: 223, columnNumber: 17 }, __self: this }, recentItems.map((item)=>/*#__PURE__*/ React.createElement("a", { key: item.name, href: item.path, className: "flex items-center px-4 py-2.5 hover:bg-[#3a3a3a] transition-colors", __source: { fileName: "", lineNumber: 225, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `fas ${item.icon} text-purple-400`, __source: { fileName: "", lineNumber: 230, columnNumber: 23 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "ml-3", __source: { fileName: "", lineNumber: 231, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-sm", __source: { fileName: "", lineNumber: 232, columnNumber: 25 }, __self: this }, item.name), /*#__PURE__*/ React.createElement("div", { className: "text-gray-400 text-xs", __source: { fileName: "", lineNumber: 233, columnNumber: 25 }, __self: this }, item.time)))))), /*#__PURE__*/ React.createElement("div", { className: "relative", __source: { fileName: "", lineNumber: 241, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>{ setShowNotifications(!showNotifications); setShowQuickMenu(false); setShowRecents(false); }, className: "w-full flex items-center justify-center p-3 rounded-lg bg-[#2a2a2a] hover:bg-[#3a3a3a] transition-colors shadow-md", __source: { fileName: "", lineNumber: 242, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-bell text-red-400", __source: { fileName: "", lineNumber: 250, columnNumber: 17 }, __self: this }), isOpen && /*#__PURE__*/ React.createElement("span", { className: "ml-2 text-sm", __source: { fileName: "", lineNumber: 251, columnNumber: 28 }, __self: this }, "Alerts"), notifications.filter((n)=>n.unread).length > 0 && /*#__PURE__*/ React.createElement("span", { className: "absolute -top-1 -right-1 bg-red-500 text-xs rounded-full h-5 w-5 flex items-center justify-center shadow-lg", __source: { fileName: "", lineNumber: 253, columnNumber: 19 }, __self: this }, notifications.filter((n)=>n.unread).length)), showNotifications && isOpen && /*#__PURE__*/ React.createElement("div", { className: "absolute left-0 right-0 mt-2 bg-[#2a2a2a] rounded-lg py-2 z-[110] shadow-xl border border-[#3a3a3a]", __source: { fileName: "", lineNumber: 259, columnNumber: 17 }, __self: this }, notifications.map((notification)=>/*#__PURE__*/ React.createElement("a", { key: notification.title, href: notification.path, className: "flex items-center px-4 py-2.5 hover:bg-[#3a3a3a] transition-colors", __source: { fileName: "", lineNumber: 261, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `w-2 h-2 rounded-full ${notification.unread ? "bg-blue-500" : "bg-gray-500"}`, __source: { fileName: "", lineNumber: 266, columnNumber: 23 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "ml-3", __source: { fileName: "", lineNumber: 269, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-sm", __source: { fileName: "", lineNumber: 270, columnNumber: 25 }, __self: this }, notification.title), /*#__PURE__*/ React.createElement("div", { className: "text-gray-400 text-xs", __source: { fileName: "", lineNumber: 271, columnNumber: 25 }, __self: this }, notification.message), /*#__PURE__*/ React.createElement("div", { className: "text-gray-500 text-xs mt-1", __source: { fileName: "", lineNumber: 274, columnNumber: 25 }, __self: this }, notification.time))))))), /*#__PURE__*/ React.createElement("ul", { className: "space-y-1", __source: { fileName: "", lineNumber: 285, columnNumber: 11 }, __self: this }, links.map((link)=>/*#__PURE__*/ React.createElement("li", { key: link.name, __source: { fileName: "", lineNumber: 287, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: link.path, onClick: ()=>setActiveLink(link.name), className: `flex items-center p-3 rounded-lg transition-colors relative group ${activeLink === link.name ? "bg-gradient-to-r from-blue-600 to-blue-700 shadow-md" : "hover:bg-[#2a2a2a]"}`, __source: { fileName: "", lineNumber: 288, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `fas ${link.icon} ${activeLink === link.name ? "text-white" : "text-gray-400"} group-hover:text-white transition-colors`, __source: { fileName: "", lineNumber: 293, columnNumber: 19 }, __self: this }), isOpen && /*#__PURE__*/ React.createElement("span", { className: "ml-3 text-sm", __source: { fileName: "", lineNumber: 296, columnNumber: 30 }, __self: this }, link.name), link.notifications > 0 && /*#__PURE__*/ React.createElement("span", { className: `absolute ${isOpen ? "right-3" : "right-0 top-0"} bg-red-500 text-xs rounded-full h-5 w-5 flex items-center justify-center shadow-lg`, __source: { fileName: "", lineNumber: 298, columnNumber: 21 }, __self: this }, link.notifications)))))), /*#__PURE__*/ React.createElement("div", { className: "p-4 border-t border-[#2a2a2a]", __source: { fileName: "", lineNumber: 310, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/settings", className: "flex items-center p-3 rounded-lg hover:bg-[#2a2a2a] transition-colors group mb-2", __source: { fileName: "", lineNumber: 311, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-cog text-gray-400 group-hover:text-white transition-colors", __source: { fileName: "", lineNumber: 315, columnNumber: 13 }, __self: this }), isOpen && /*#__PURE__*/ React.createElement("span", { className: "ml-3 text-sm", __source: { fileName: "", lineNumber: 316, columnNumber: 24 }, __self: this }, "Settings")), /*#__PURE__*/ React.createElement("div", { className: `flex items-center p-2 rounded-lg ${isOpen ? "" : "justify-center"}`, __source: { fileName: "", lineNumber: 318, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-8 h-8 bg-gradient-to-r from-blue-500 to-blue-600 rounded-full flex items-center justify-center shadow-md", __source: { fileName: "", lineNumber: 321, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-user text-sm", __source: { fileName: "", lineNumber: 322, columnNumber: 15 }, __self: this })), isOpen && /*#__PURE__*/ React.createElement("div", { className: "ml-3", __source: { fileName: "", lineNumber: 325, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-sm", __source: { fileName: "", lineNumber: 326, columnNumber: 17 }, __self: this }, "John Doe"), /*#__PURE__*/ React.createElement("div", { className: "text-gray-400 text-xs", __source: { fileName: "", lineNumber: 327, columnNumber: 17 }, __self: this }, "Admin"))))), /*#__PURE__*/ React.createElement("div", { className: `flex-1 ${isOpen ? "ml-[288px]" : "ml-20"}`, __source: { fileName: "", lineNumber: 333, columnNumber: 7 }, __self: this })); } function SideNavigationStory() { return /*#__PURE__*/ React.createElement("div", { className: "bg-[#f5f5f5] min-h-screen", __source: { fileName: "", lineNumber: 340, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(SideNavigation, { __source: { fileName: "", lineNumber: 341, columnNumber: 7 }, __self: this })); } function MetricsCard({ title, value, percentChange, historicalData, onCardClick, tooltipContent }) { const isPositive = percentChange >= 0; const [isHovered, setIsHovered] = useState(false); const [showTooltip, setShowTooltip] = useState(false); const trendIndicator = useMemo(()=>{ if (!Array.isArray(historicalData) || historicalData.length < 2) return "neutral"; const lastTwo = historicalData.slice(-2); return lastTwo[1].value > lastTwo[0].value ? "up" : "down"; }, [ historicalData ]); const handleClick = useCallback((e)=>{ if (onCardClick) { onCardClick({ title, value, percentChange, historicalData }); } }, [ onCardClick, title, value, percentChange, historicalData ]); const handleInfoClick = useCallback((e)=>{ e.stopPropagation(); setShowTooltip(!showTooltip); }, []); const chartData = Array.isArray(historicalData) ? historicalData : []; const maxValue = chartData.length > 0 ? Math.max(...chartData.map((d)=>d.value)) : 0; return /*#__PURE__*/ React.createElement("div", { className: `relative rounded-lg bg-white p-6 shadow-lg w-full sm:max-w-[350px] cursor-pointer transition-all duration-200 ${isHovered ? "transform scale-[1.02] shadow-xl" : ""}`, onMouseEnter: ()=>setIsHovered(true), onMouseLeave: ()=>{ setIsHovered(false); setShowTooltip(false); }, onClick: handleClick, __source: { fileName: "", lineNumber: 39, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-start mb-4", __source: { fileName: "", lineNumber: 50, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "font-roboto text-gray-600 text-sm", __source: { fileName: "", lineNumber: 51, columnNumber: 9 }, __self: this }, title), /*#__PURE__*/ React.createElement("div", { className: "relative", __source: { fileName: "", lineNumber: 52, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `fas fa-info-circle ${isHovered || showTooltip ? "text-blue-500" : "text-gray-400"} hover:text-blue-600 transition-colors duration-200`, onClick: handleInfoClick, onMouseEnter: ()=>setShowTooltip(true), onMouseLeave: ()=>setShowTooltip(false), __source: { fileName: "", lineNumber: 53, columnNumber: 11 }, __self: this }), showTooltip && /*#__PURE__*/ React.createElement("div", { className: "absolute right-0 top-6 w-48 p-2 bg-gray-800 text-white text-xs rounded shadow-lg z-10", __source: { fileName: "", lineNumber: 62, columnNumber: 13 }, __self: this }, tooltipContent || `Details about ${title.toLowerCase()} metrics`, /*#__PURE__*/ React.createElement("div", { className: "absolute -top-1 right-2 w-2 h-2 bg-gray-800 transform rotate-45", __source: { fileName: "", lineNumber: 64, columnNumber: 15 }, __self: this })))), /*#__PURE__*/ React.createElement("div", { className: "flex items-baseline justify-between mb-4", __source: { fileName: "", lineNumber: 70, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "font-roboto text-2xl font-semibold", __source: { fileName: "", lineNumber: 71, columnNumber: 9 }, __self: this }, value), /*#__PURE__*/ React.createElement("div", { className: `flex flex-col items-end transition-transform duration-200 ${isHovered ? "transform translate-y-[-2px]" : ""}`, __source: { fileName: "", lineNumber: 72, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: `flex items-center font-roboto ${isPositive ? "text-green-500" : "text-red-500"}`, __source: { fileName: "", lineNumber: 77, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `fa-solid ${isPositive ? "fa-arrow-up" : "fa-arrow-down"} mr-1`, __source: { fileName: "", lineNumber: 82, columnNumber: 13 }, __self: this }), Math.abs(percentChange), "%"), /*#__PURE__*/ React.createElement("span", { className: "text-xs text-gray-500 mt-1", __source: { fileName: "", lineNumber: 89, columnNumber: 11 }, __self: this }, "vs last period"))), chartData.length > 0 && /*#__PURE__*/ React.createElement("div", { className: "h-[40px] flex items-end justify-between border-t pt-3", __source: { fileName: "", lineNumber: 94, columnNumber: 9 }, __self: this }, chartData.map((data, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: `w-[8px] rounded-t transition-all duration-200 ${isHovered ? trendIndicator === "up" ? "bg-green-400" : "bg-red-400" : trendIndicator === "up" ? "bg-green-200" : "bg-red-200"}`, style: { height: `${data.value / maxValue * 100}%`, transform: isHovered ? "scaleY(1.05)" : "scaleY(1)" }, __source: { fileName: "", lineNumber: 96, columnNumber: 13 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: `mt-2 text-xs text-gray-500 flex items-center justify-end transition-all duration-200 ${isHovered ? "opacity-100 transform translate-y-0" : "opacity-0 transform translate-y-1"}`, __source: { fileName: "", lineNumber: 116, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-chart-line mr-1", __source: { fileName: "", lineNumber: 123, columnNumber: 9 }, __self: this }), "Click for details")); } function MetricsCardStory() { const mockHistoricalData = [ { date: "2024-01", value: 40000 }, { date: "2024-02", value: 45000 }, { date: "2024-03", value: 48000 }, { date: "2024-04", value: 50000 } ]; const userHistoricalData = [ { date: "2024-01", value: 1500 }, { date: "2024-02", value: 1400 }, { date: "2024-03", value: 1300 }, { date: "2024-04", value: 1234 } ]; const conversionHistoricalData = [ { date: "2024-01", value: 20 }, { date: "2024-02", value: 22 }, { date: "2024-03", value: 24 }, { date: "2024-04", value: 25 } ]; const handleCardClick = (data)=>{ console.log("Card clicked:", data); alert(`Viewing details for ${data.title}`); }; return /*#__PURE__*/ React.createElement("div", { className: "p-4 bg-gray-100", __source: { fileName: "", lineNumber: 158, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4", __source: { fileName: "", lineNumber: 159, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement(MetricsCard, { title: "Revenue", value: "$50,000", percentChange: 12.5, historicalData: mockHistoricalData, onCardClick: handleCardClick, tooltipContent: "Monthly revenue metrics and growth trends", __source: { fileName: "", lineNumber: 160, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement(MetricsCard, { title: "Users", value: "1,234", percentChange: -5.2, historicalData: userHistoricalData, onCardClick: handleCardClick, tooltipContent: "Active user count and retention metrics", __source: { fileName: "", lineNumber: 168, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement(MetricsCard, { title: "Conversion Rate", value: "25%", percentChange: 3.1, historicalData: conversionHistoricalData, onCardClick: handleCardClick, tooltipContent: "User conversion rate and funnel metrics", __source: { fileName: "", lineNumber: 176, columnNumber: 9 }, __self: this }))); } function MainComponent() { const [selectedSector, setSelectedSector] = useState("all"); const [minValue, setMinValue] = useState(0); const [showAddDeal, setShowAddDeal] = useState(false); const [showCompare, setShowCompare] = useState(false); const [selectedDeals, setSelectedDeals] = useState([]); const [selectedTeamMember, setSelectedTeamMember] = useState("all"); const [selectedScore, setSelectedScore] = useState(0); const [draggedDeal, setDraggedDeal] = useState(null); const [deals, setDeals] = useState([ { id: 1, company: "TechCorp", value: "$500K", sector: "Technology", description: "Cloud software integration", stage: "lead", status: "active", priority: "high", contact: "Jane Smith", score: 85, teamSize: 5, nextReminder: "2024-02-25", assignedTo: [ "Jane Smith", "John Doe" ] }, { id: 2, company: "BioPharma", value: "$1.2M", sector: "Healthcare", description: "Medical device partnership", stage: "negotiation", status: "pending", priority: "medium", contact: "John Doe", score: 92, teamSize: 8, nextReminder: "2024-02-28", assignedTo: [ "Mike Johnson", "Sarah Lee" ] }, { id: 3, company: "EcoEnergy", value: "$750K", sector: "Energy", description: "Solar panel installation", stage: "prospect", status: "active", priority: "low", contact: "Mike Johnson", score: 78, teamSize: 3, nextReminder: "2024-03-01", assignedTo: [ "John Doe" ] } ]); const stages = [ "lead", "prospect", "negotiation", "closed" ]; const teamMembers = [ "Jane Smith", "John Doe", "Mike Johnson", "Sarah Lee" ]; const sectors = [ "Technology", "Healthcare", "Energy", "Financial" ]; const calculateDealScore = (deal)=>{ let score = 0; const value = parseInt(deal.value.replace(/[^0-9]/g, "")); if (value >= 1000000) score += 30; else if (value >= 500000) score += 20; else score += 10; score += deal.priority === "high" ? 25 : deal.priority === "medium" ? 15 : 5; score += deal.stage === "negotiation" ? 25 : deal.stage === "prospect" ? 15 : 5; score += Math.min(deal.teamSize * 2, 10); score += deal.status === "active" ? 10 : 5; return score; }; const handleDragStart = (e, deal)=>{ setDraggedDeal(deal); e.dataTransfer.setData("dealId", deal.id.toString()); e.target.classList.add("opacity-50"); }; const handleDragEnd = (e)=>{ setDraggedDeal(null); e.target.classList.remove("opacity-50"); }; const handleDragOver = (e)=>{ e.preventDefault(); }; const handleDrop = (e, targetStage)=>{ e.preventDefault(); const dealId = parseInt(e.dataTransfer.getData("dealId")); setDeals(deals.map((deal)=>deal.id === dealId ? { ...deal, stage: targetStage, score: calculateDealScore({ ...deal, stage: targetStage }) } : deal)); }; const handleAddDeal = (e)=>{ e.preventDefault(); const formData = new FormData(e.target); const newDeal = { id: deals.length + 1, company: formData.get("company"), value: formData.get("value"), sector: formData.get("sector"), description: formData.get("description"), stage: "lead", status: "active", priority: "medium", contact: "New Contact", score: 0, teamSize: formData.getAll("team").length || 1, nextReminder: formData.get("reminder") || "", assignedTo: formData.getAll("team") }; newDeal.score = calculateDealScore(newDeal); setDeals([ ...deals, newDeal ]); setShowAddDeal(false); }; const filteredDeals = deals.filter((deal)=>{ const matchesSector = selectedSector === "all" || deal.sector === selectedSector; const matchesValue = parseInt(deal.value.replace(/[^0-9]/g, "")) >= minValue; const matchesTeam = selectedTeamMember === "all" || deal.assignedTo.includes(selectedTeamMember); const matchesScore = deal.score >= selectedScore; return matchesSector && matchesValue && matchesTeam && matchesScore; }); return /*#__PURE__*/ React.createElement("div", { className: "p-6 bg-gray-100 min-h-screen", __source: { fileName: "", lineNumber: 149, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center mb-6", __source: { fileName: "", lineNumber: 150, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-3xl font-bold font-roboto text-gray-800", __source: { fileName: "", lineNumber: 151, columnNumber: 9 }, __self: this }, "Deal Pipeline"), /*#__PURE__*/ React.createElement("div", { className: "flex gap-2", __source: { fileName: "", lineNumber: 154, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowCompare(true), className: "bg-gray-600 text-white px-4 py-2 rounded-lg hover:bg-gray-700 flex items-center", disabled: selectedDeals.length !== 2, __source: { fileName: "", lineNumber: 155, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-balance-scale mr-2", __source: { fileName: "", lineNumber: 160, columnNumber: 13 }, __self: this }), "Compare Deals"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowAddDeal(true), className: "bg-blue-600 text-white px-4 py-2 rounded-lg hover:bg-blue-700 flex items-center", __source: { fileName: "", lineNumber: 163, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-plus mr-2", __source: { fileName: "", lineNumber: 167, columnNumber: 13 }, __self: this }), "Add Deal"))), /*#__PURE__*/ React.createElement("div", { className: "flex gap-4 mb-6 flex-wrap", __source: { fileName: "", lineNumber: 173, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("select", { value: selectedSector, onChange: (e)=>setSelectedSector(e.target.value), className: "border rounded-lg p-2", __source: { fileName: "", lineNumber: 174, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "all", __source: { fileName: "", lineNumber: 179, columnNumber: 11 }, __self: this }, "All Sectors"), sectors.map((sector)=>/*#__PURE__*/ React.createElement("option", { key: sector, value: sector, __source: { fileName: "", lineNumber: 181, columnNumber: 13 }, __self: this }, sector))), /*#__PURE__*/ React.createElement("select", { value: minValue, onChange: (e)=>setMinValue(parseInt(e.target.value)), className: "border rounded-lg p-2", __source: { fileName: "", lineNumber: 187, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: 0, __source: { fileName: "", lineNumber: 192, columnNumber: 11 }, __self: this }, "All Deal Sizes"), /*#__PURE__*/ React.createElement("option", { value: 250000, __source: { fileName: "", lineNumber: 193, columnNumber: 11 }, __self: this }, "$250K+"), /*#__PURE__*/ React.createElement("option", { value: 500000, __source: { fileName: "", lineNumber: 194, columnNumber: 11 }, __self: this }, "$500K+"), /*#__PURE__*/ React.createElement("option", { value: 1000000, __source: { fileName: "", lineNumber: 195, columnNumber: 11 }, __self: this }, "$1M+")), /*#__PURE__*/ React.createElement("select", { value: selectedTeamMember, onChange: (e)=>setSelectedTeamMember(e.target.value), className: "border rounded-lg p-2", __source: { fileName: "", lineNumber: 198, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "all", __source: { fileName: "", lineNumber: 203, columnNumber: 11 }, __self: this }, "All Team Members"), teamMembers.map((member)=>/*#__PURE__*/ React.createElement("option", { key: member, value: member, __source: { fileName: "", lineNumber: 205, columnNumber: 13 }, __self: this }, member))), /*#__PURE__*/ React.createElement("select", { value: selectedScore, onChange: (e)=>setSelectedScore(parseInt(e.target.value)), className: "border rounded-lg p-2", __source: { fileName: "", lineNumber: 211, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: 0, __source: { fileName: "", lineNumber: 216, columnNumber: 11 }, __self: this }, "All Scores"), /*#__PURE__*/ React.createElement("option", { value: 70, __source: { fileName: "", lineNumber: 217, columnNumber: 11 }, __self: this }, "70+ Score"), /*#__PURE__*/ React.createElement("option", { value: 80, __source: { fileName: "", lineNumber: 218, columnNumber: 11 }, __self: this }, "80+ Score"), /*#__PURE__*/ React.createElement("option", { value: 90, __source: { fileName: "", lineNumber: 219, columnNumber: 11 }, __self: this }, "90+ Score"))), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6", __source: { fileName: "", lineNumber: 223, columnNumber: 7 }, __self: this }, stages.map((stage)=>/*#__PURE__*/ React.createElement("div", { key: stage, className: "bg-gray-50 rounded-lg p-4 min-h-[600px]", onDragOver: handleDragOver, onDrop: (e)=>handleDrop(e, stage), __source: { fileName: "", lineNumber: 225, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between mb-4", __source: { fileName: "", lineNumber: 231, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-semibold font-roboto capitalize text-gray-700", __source: { fileName: "", lineNumber: 232, columnNumber: 15 }, __self: this }, stage), /*#__PURE__*/ React.createElement("span", { className: "bg-gray-200 px-3 py-1 rounded-full text-sm font-medium", __source: { fileName: "", lineNumber: 235, columnNumber: 15 }, __self: this }, filteredDeals.filter((deal)=>deal.stage === stage).length)), /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 240, columnNumber: 13 }, __self: this }, filteredDeals.filter((deal)=>deal.stage === stage).map((deal)=>/*#__PURE__*/ React.createElement("div", { key: deal.id, draggable: true, onDragStart: (e)=>handleDragStart(e, deal), onDragEnd: handleDragEnd, className: "bg-white p-4 rounded-lg shadow-sm hover:shadow-md transition-all duration-200 cursor-move border-l-4 transform hover:-translate-y-1", style: { borderLeftColor: deal.priority === "high" ? "#EF4444" : deal.priority === "medium" ? "#F59E0B" : "#10B981" }, __source: { fileName: "", lineNumber: 244, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-start mb-3", __source: { fileName: "", lineNumber: 259, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 260, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "font-bold text-lg font-roboto", __source: { fileName: "", lineNumber: 261, columnNumber: 25 }, __self: this }, deal.company), /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-2 mt-1", __source: { fileName: "", lineNumber: 264, columnNumber: 25 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center bg-blue-50 px-2 py-1 rounded-full", __source: { fileName: "", lineNumber: 265, columnNumber: 27 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-chart-line text-blue-500 mr-1 text-xs", __source: { fileName: "", lineNumber: 266, columnNumber: 29 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "text-blue-700 text-xs font-medium", __source: { fileName: "", lineNumber: 267, columnNumber: 29 }, __self: this }, "Score: ", deal.score)), /*#__PURE__*/ React.createElement("div", { className: "flex items-center bg-purple-50 px-2 py-1 rounded-full", __source: { fileName: "", lineNumber: 271, columnNumber: 27 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-users text-purple-500 mr-1 text-xs", __source: { fileName: "", lineNumber: 272, columnNumber: 29 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "text-purple-700 text-xs font-medium", __source: { fileName: "", lineNumber: 273, columnNumber: 29 }, __self: this }, "Team: ", deal.teamSize)))), /*#__PURE__*/ React.createElement("div", { className: "flex items-start gap-2", __source: { fileName: "", lineNumber: 279, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-green-600 font-semibold", __source: { fileName: "", lineNumber: 280, columnNumber: 25 }, __self: this }, deal.value), /*#__PURE__*/ React.createElement("input", { type: "checkbox", checked: selectedDeals.some((d)=>d.id === deal.id), onChange: (e)=>{ if (e.target.checked && selectedDeals.length < 2) { setSelectedDeals([ ...selectedDeals, deal ]); } else { setSelectedDeals(selectedDeals.filter((d)=>d.id !== deal.id)); } }, className: "h-4 w-4 rounded border-gray-300", __source: { fileName: "", lineNumber: 283, columnNumber: 25 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "flex flex-wrap gap-2 mb-3", __source: { fileName: "", lineNumber: 299, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "bg-blue-100 text-blue-800 text-xs px-2 py-1 rounded-full", __source: { fileName: "", lineNumber: 300, columnNumber: 23 }, __self: this }, deal.sector), /*#__PURE__*/ React.createElement("span", { className: `text-xs px-2 py-1 rounded-full ${deal.status === "active" ? "bg-green-100 text-green-800" : "bg-yellow-100 text-yellow-800"}`, __source: { fileName: "", lineNumber: 303, columnNumber: 23 }, __self: this }, deal.status)), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600 text-sm mb-3 line-clamp-2", __source: { fileName: "", lineNumber: 313, columnNumber: 21 }, __self: this }, deal.description), /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between text-xs text-gray-500 mb-3", __source: { fileName: "", lineNumber: 316, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center", __source: { fileName: "", lineNumber: 317, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-user mr-1", __source: { fileName: "", lineNumber: 318, columnNumber: 25 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 319, columnNumber: 25 }, __self: this }, deal.contact)), /*#__PURE__*/ React.createElement("div", { className: "flex items-center", __source: { fileName: "", lineNumber: 321, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-clock mr-1", __source: { fileName: "", lineNumber: 322, columnNumber: 25 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 323, columnNumber: 25 }, __self: this }, deal.nextReminder))), /*#__PURE__*/ React.createElement("div", { className: "flex flex-wrap gap-1", __source: { fileName: "", lineNumber: 326, columnNumber: 21 }, __self: this }, deal.assignedTo.map((member, index)=>/*#__PURE__*/ React.createElement("span", { key: index, className: "bg-gray-100 text-gray-700 text-xs px-2 py-1 rounded-full", __source: { fileName: "", lineNumber: 328, columnNumber: 25 }, __self: this }, member))))))))), showAddDeal && /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center", __source: { fileName: "", lineNumber: 344, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white p-6 rounded-lg w-[500px]", __source: { fileName: "", lineNumber: 345, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-bold mb-4", __source: { fileName: "", lineNumber: 346, columnNumber: 13 }, __self: this }, "Add New Deal"), /*#__PURE__*/ React.createElement("form", { onSubmit: handleAddDeal, className: "space-y-4", __source: { fileName: "", lineNumber: 347, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", name: "company", placeholder: "Company Name", className: "w-full border rounded-lg p-2", required: true, __source: { fileName: "", lineNumber: 348, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "text", name: "value", placeholder: "Deal Value", className: "w-full border rounded-lg p-2", required: true, __source: { fileName: "", lineNumber: 355, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("select", { name: "sector", className: "w-full border rounded-lg p-2", required: true, __source: { fileName: "", lineNumber: 362, columnNumber: 15 }, __self: this }, sectors.map((sector)=>/*#__PURE__*/ React.createElement("option", { key: sector, value: sector, __source: { fileName: "", lineNumber: 368, columnNumber: 19 }, __self: this }, sector))), /*#__PURE__*/ React.createElement("textarea", { name: "description", placeholder: "Description", className: "w-full border rounded-lg p-2", required: true, __source: { fileName: "", lineNumber: 373, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "border rounded-lg p-4", __source: { fileName: "", lineNumber: 379, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "font-semibold mb-2", __source: { fileName: "", lineNumber: 380, columnNumber: 17 }, __self: this }, "Team Assignment"), /*#__PURE__*/ React.createElement("div", { className: "space-y-2", __source: { fileName: "", lineNumber: 381, columnNumber: 17 }, __self: this }, teamMembers.map((member)=>/*#__PURE__*/ React.createElement("label", { key: member, className: "flex items-center", __source: { fileName: "", lineNumber: 383, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "checkbox", name: "team", value: member, className: "mr-2", __source: { fileName: "", lineNumber: 384, columnNumber: 23 }, __self: this }), member)))), /*#__PURE__*/ React.createElement("div", { className: "border rounded-lg p-4", __source: { fileName: "", lineNumber: 395, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "font-semibold mb-2", __source: { fileName: "", lineNumber: 396, columnNumber: 17 }, __self: this }, "Set Reminder"), /*#__PURE__*/ React.createElement("input", { type: "date", name: "reminder", className: "w-full border rounded-lg p-2", __source: { fileName: "", lineNumber: 397, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex justify-end gap-2", __source: { fileName: "", lineNumber: 403, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("button", { type: "button", onClick: ()=>setShowAddDeal(false), className: "px-4 py-2 border rounded-lg", __source: { fileName: "", lineNumber: 404, columnNumber: 17 }, __self: this }, "Cancel"), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "px-4 py-2 bg-blue-600 text-white rounded-lg", __source: { fileName: "", lineNumber: 411, columnNumber: 17 }, __self: this }, "Add Deal"))))), showCompare && /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center", __source: { fileName: "", lineNumber: 424, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white p-6 rounded-lg w-[800px]", __source: { fileName: "", lineNumber: 425, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center mb-4", __source: { fileName: "", lineNumber: 426, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-bold", __source: { fileName: "", lineNumber: 427, columnNumber: 15 }, __self: this }, "Compare Deals"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowCompare(false), className: "text-gray-500", __source: { fileName: "", lineNumber: 428, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-times", __source: { fileName: "", lineNumber: 432, columnNumber: 17 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-2 gap-4", __source: { fileName: "", lineNumber: 435, columnNumber: 13 }, __self: this }, selectedDeals.map((deal)=>/*#__PURE__*/ React.createElement("div", { key: deal.id, className: "border rounded-lg p-4", __source: { fileName: "", lineNumber: 437, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "font-bold text-lg mb-2", __source: { fileName: "", lineNumber: 438, columnNumber: 19 }, __self: this }, deal.company), /*#__PURE__*/ React.createElement("div", { className: "space-y-2", __source: { fileName: "", lineNumber: 439, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between", __source: { fileName: "", lineNumber: 440, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 441, columnNumber: 23 }, __self: this }, "Deal Score:"), /*#__PURE__*/ React.createElement("span", { className: "font-bold", __source: { fileName: "", lineNumber: 442, columnNumber: 23 }, __self: this }, deal.score, "/100")), /*#__PURE__*/ React.createElement("div", { className: "flex justify-between", __source: { fileName: "", lineNumber: 444, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 445, columnNumber: 23 }, __self: this }, "Value:"), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 446, columnNumber: 23 }, __self: this }, deal.value)), /*#__PURE__*/ React.createElement("div", { className: "flex justify-between", __source: { fileName: "", lineNumber: 448, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 449, columnNumber: 23 }, __self: this }, "Team Size:"), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 450, columnNumber: 23 }, __self: this }, deal.teamSize)), /*#__PURE__*/ React.createElement("div", { className: "flex justify-between", __source: { fileName: "", lineNumber: 452, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 453, columnNumber: 23 }, __self: this }, "Next Reminder:"), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 454, columnNumber: 23 }, __self: this }, deal.nextReminder))))))))); }