@optifye/dashboard-core 6.11.3 → 6.11.4

package/dist/index.css

@@ -1173,12 +1173,12 @@ body {
 .max-h-\[300px\] {
   max-height: 300px;
 }
-.max-h-\[380px\] {
-  max-height: 380px;
-}
 .max-h-\[400px\] {
   max-height: 400px;
 }
+.max-h-\[500px\] {
+  max-height: 500px;
+}
 .max-h-\[60vh\] {
   max-height: 60vh;
 }
@@ -1188,6 +1188,9 @@ body {
 .max-h-\[90vh\] {
   max-height: 90vh;
 }
+.max-h-\[calc\(100vh-80px\)\] {
+  max-height: calc(100vh - 80px);
+}
 .max-h-full {
   max-height: 100%;
 }
@@ -1443,6 +1446,9 @@ body {
 .min-w-\[250px\] {
   min-width: 250px;
 }
+.min-w-\[280px\] {
+  min-width: 280px;
+}
 .min-w-\[32px\] {
   min-width: 32px;
 }
@@ -1494,6 +1500,9 @@ body {
 .max-w-\[150px\] {
   max-width: 150px;
 }
+.max-w-\[170px\] {
+  max-width: 170px;
+}
 .max-w-\[1800px\] {
   max-width: 1800px;
 }
@@ -2957,6 +2966,9 @@ body {
 .bg-slate-50\/50 {
   background-color: rgb(248 250 252 / 0.5);
 }
+.bg-slate-50\/80 {
+  background-color: rgb(248 250 252 / 0.8);
+}
 .bg-slate-900 {
   --tw-bg-opacity: 1;
   background-color: rgb(15 23 42 / var(--tw-bg-opacity, 1));

package/dist/index.d.mts

@@ -7057,6 +7057,7 @@ interface LineChartProps {
     yAxisUnit?: string;
     yAxisDomain?: [number | string, number | string];
     tooltipFormatter?: (value: any, name: any, props: any) => any;
+    tooltipLabelFormatter?: (label: any, payload: any[]) => any;
     legendPayload?: any[];
     className?: string;
     showGrid?: boolean;

package/dist/index.d.ts

@@ -7057,6 +7057,7 @@ interface LineChartProps {
     yAxisUnit?: string;
     yAxisDomain?: [number | string, number | string];
     tooltipFormatter?: (value: any, name: any, props: any) => any;
+    tooltipLabelFormatter?: (label: any, payload: any[]) => any;
     legendPayload?: any[];
     className?: string;
     showGrid?: boolean;

package/dist/index.js

@@ -29797,6 +29797,7 @@ var LineChartComponent = ({
   yAxisUnit,
   yAxisDomain,
   tooltipFormatter,
+  tooltipLabelFormatter,
   legendPayload,
   className,
   showGrid = true,
@@ -29876,7 +29877,15 @@ var LineChartComponent = ({
         stroke: axisStrokeColor
       }
     ),
-    showTooltip && /* @__PURE__ */ jsxRuntime.jsx(recharts.Tooltip, { formatter: tooltipFormatter || defaultTooltipFormatter, itemStyle: { color: "#111827" }, cursor: { strokeDasharray: "3 3" } }),
+    showTooltip && /* @__PURE__ */ jsxRuntime.jsx(
+      recharts.Tooltip,
+      {
+        formatter: tooltipFormatter || defaultTooltipFormatter,
+        labelFormatter: tooltipLabelFormatter,
+        itemStyle: { color: "#111827" },
+        cursor: { strokeDasharray: "3 3" }
+      }
+    ),
     showLegend && /* @__PURE__ */ jsxRuntime.jsx(recharts.Legend, { payload: legendPayload }),
     lines.map((lineConfig, index) => {
       const lineProps = {
@@ -29932,7 +29941,7 @@ var LineChart = React141__namespace.default.memo(LineChartComponent, (prevProps,
   })) {
     return false;
   }
-  if (prevProps.tooltipFormatter !== nextProps.tooltipFormatter || prevProps.xAxisTickFormatter !== nextProps.xAxisTickFormatter || JSON.stringify(prevProps.legendPayload) !== JSON.stringify(nextProps.legendPayload)) {
+  if (prevProps.tooltipFormatter !== nextProps.tooltipFormatter || prevProps.xAxisTickFormatter !== nextProps.xAxisTickFormatter || prevProps.tooltipLabelFormatter !== nextProps.tooltipLabelFormatter || JSON.stringify(prevProps.legendPayload) !== JSON.stringify(nextProps.legendPayload)) {
     return false;
   }
   return true;
@@ -42647,22 +42656,16 @@ var formatDuration = (seconds) => {
   const hours = Math.floor(wholeSeconds % 86400 / 3600);
   const minutes = Math.floor(wholeSeconds % 3600 / 60);
   const remainingSeconds = wholeSeconds % 60;
-  if (days > 0) {
-    return `${days}d ${hours}h ${minutes}m ${remainingSeconds}s`;
-  }
-  if (hours > 0) {
-    return `${hours}h ${minutes}m ${remainingSeconds}s`;
-  }
-  if (minutes > 0) {
-    return `${minutes}m ${remainingSeconds}s`;
-  }
-  return `${remainingSeconds}s`;
-};
-var formatPercentage = (value) => {
-  if (value === null || value === void 0 || !Number.isFinite(value)) {
-    return "--";
+  const parts = [];
+  if (days > 0) parts.push(`${days}d`);
+  if (hours > 0) parts.push(`${hours}h`);
+  if (minutes > 0) parts.push(`${minutes}m`);
+  if (days === 0 && hours === 0) {
+    if (remainingSeconds > 0 || parts.length === 0) {
+      parts.push(`${remainingSeconds}s`);
+    }
   }
-  return `${value.toFixed(1)}%`;
+  return parts.join(" ");
 };
 var getColorForEntry = (name, index) => {
   const normalized = name.trim().toLowerCase();
@@ -42682,30 +42685,35 @@ var CustomTooltip = ({ active, payload, hideTotalDuration }) => {
   if (active && payload && payload.length) {
     const datum = payload[0]?.payload;
     const contributors = datum?.contributors || [];
-    const fill = payload[0]?.payload?.fill || payload[0]?.fill || getColorForEntry(payload[0].name, 0);
-    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-white/95 backdrop-blur-sm p-3 border border-gray-200 shadow-xl rounded-lg z-50 min-w-[200px]", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1.5 mb-2 pb-1 border-b border-gray-100", children: [
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-2.5 h-2.5 rounded-full flex-shrink-0", style: { backgroundColor: fill } }),
-        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-semibold text-slate-800 text-sm", children: payload[0].name.replace(/_/g, " ") })
+    let effContributionStr = "--";
+    if (datum?.efficiencyLossPercentage !== null && datum?.efficiencyLossPercentage !== void 0 && Number.isFinite(datum?.efficiencyLossPercentage)) {
+      const val = datum.efficiencyLossPercentage;
+      effContributionStr = val === 0 ? "0.0%" : `${Math.abs(val).toFixed(1)}%`;
+    }
+    const hasContributors = contributors.length > 0;
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-white p-3 border border-gray-100 shadow-lg rounded-lg text-xs z-50 min-w-[280px]", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 pb-2 mb-2 border-b border-slate-100", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-2.5 h-2.5 rounded-full flex-shrink-0", style: { backgroundColor: payload[0].payload.fill || getColorForEntry(payload[0].name, 0) } }),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-semibold text-slate-800 text-[13px]", children: payload[0].name.replace(/_/g, " ") })
       ] }),
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1 text-xs", children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-between items-center gap-3", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-1.5 pb-1", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-between items-center gap-4", children: [
           /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-slate-500", children: "Share of idle time" }),
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-medium text-slate-800", children: `${payload[0].value.toFixed(1)}%` })
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-semibold text-slate-800", children: `${payload[0].value.toFixed(1)}%` })
         ] }),
-        !hideTotalDuration && datum?.totalDurationSeconds !== void 0 ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-between items-center gap-3", children: [
+        !hideTotalDuration && !hasContributors && datum?.totalDurationSeconds !== void 0 ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-between items-center gap-4", children: [
           /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-slate-500", children: "Total Duration" }),
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-medium text-slate-800", children: formatDuration(datum.totalDurationSeconds) })
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-semibold text-slate-800", children: formatDuration(datum.totalDurationSeconds) })
         ] }) : null,
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-between items-center gap-3", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-between items-center gap-4", children: [
           /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-slate-500", children: "Efficiency Loss" }),
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-medium text-slate-800", children: formatPercentage(datum?.efficiencyLossPercentage) })
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-semibold text-slate-800", children: effContributionStr })
         ] })
       ] }),
-      contributors.length > 0 ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-2 pt-2 border-t border-gray-100", children: [
-        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[9px] font-semibold uppercase tracking-wider text-slate-400 mb-1.5", children: "Top Workstations" }),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-1", children: contributors.slice(0, 3).map((contributor) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start justify-between gap-2 text-[10px]", children: [
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-slate-700 truncate max-w-[120px]", children: contributor.workspaceName }),
+      hasContributors ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-2 pt-2 border-t border-slate-100", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[10px] font-bold uppercase tracking-wider text-slate-400 mb-2", children: "TOP CONTRIBUTORS" }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-1.5", children: contributors.slice(0, 3).map((contributor) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start justify-between gap-3", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-slate-600 truncate max-w-[170px]", title: contributor.workspaceName, children: contributor.workspaceName }),
           /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-slate-500 text-right whitespace-nowrap", children: `${formatDuration(contributor.totalDurationSeconds)} \u2022 ${Number(contributor.percentageWithinReason || 0).toFixed(1)}%` })
         ] }, `${payload[0].name}-${contributor.workspaceId}`)) })
       ] }) : null
@@ -49386,10 +49394,11 @@ var AlertsPopup = ({
   const updatePosition = React141.useCallback(() => {
     const viewportHeight = window.innerHeight;
     const viewportWidth = window.innerWidth;
+    const currentPopupHeight = popupRef.current?.offsetHeight || 280;
     if (viewportWidth < 768) {
-      const mobileWidth = Math.max(240, Math.min(360, viewportWidth - 32));
+      const mobileWidth = Math.max(240, Math.min(380, viewportWidth - 32));
       setPosition({
-        top: Math.max(16, (viewportHeight - 280) / 2),
+        top: Math.max(16, (viewportHeight - currentPopupHeight) / 2),
         left: Math.max(16, (viewportWidth - mobileWidth) / 2),
         width: mobileWidth
       });
@@ -49397,22 +49406,25 @@ var AlertsPopup = ({
     }
     if (!triggerRef.current) return;
     const rect = triggerRef.current.getBoundingClientRect();
-    const popupHeight = 280;
-    let top = rect.bottom - popupHeight + 40;
-    if (top < 16) top = 16;
-    if (top + popupHeight > viewportHeight - 16) {
-      top = viewportHeight - popupHeight - 16;
-    }
+    const bottomOffset = viewportHeight - rect.bottom + 12;
     setPosition({
-      top,
+      bottom: bottomOffset,
       left: 88,
       // Sidebar width (80px) + gap (8px)
-      width: 360
+      width: 400
+      // Make it a bit wider for enterprise/cleaner look
     });
   }, [triggerRef]);
   React141.useEffect(() => {
     if (isOpen) {
-      updatePosition();
+      const timer = setTimeout(() => {
+        updatePosition();
+      }, 0);
+      return () => clearTimeout(timer);
+    }
+  }, [isOpen, alerts, isLoading, error, updatePosition]);
+  React141.useEffect(() => {
+    if (isOpen) {
       window.addEventListener("resize", updatePosition);
       window.addEventListener("scroll", updatePosition);
     }
@@ -49458,19 +49470,21 @@ var AlertsPopup = ({
         },
         style: {
           position: "fixed",
-          top: position.top,
+          ...position.top !== void 0 ? { top: position.top } : {},
+          ...position.bottom !== void 0 ? { bottom: position.bottom } : {},
           left: position.left,
           width: position.width,
+          maxHeight: "calc(100vh - 32px)",
           zIndex: 2147483647
         },
-        className: "bg-white rounded-[16px] shadow-xl border border-gray-100 max-w-[calc(100vw-32px)] overflow-hidden flex flex-col",
+        className: "bg-white rounded-[16px] shadow-2xl border border-gray-100 max-w-[calc(100vw-32px)] max-h-[calc(100vh-80px)] overflow-hidden flex flex-col",
         children: [
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between px-5 py-4 border-b border-gray-50 bg-[#fafafa]", children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between px-5 py-4 border-b border-gray-50 bg-[#fafafa] shrink-0", children: [
             /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
-              /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-[14px] font-bold text-[#111827] uppercase tracking-wide", children: "Recent Alerts" }),
+              /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-[14px] font-bold text-[#111827] uppercase tracking-wide", children: "Current Alerts" }),
               alertsCount > 0 && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "bg-[#eff6ff] text-[#2563eb] text-[11px] font-bold px-2 py-0.5 rounded-full", children: [
                 alertsCount,
-                " Active"
+                " alerts"
               ] })
             ] }),
             /* @__PURE__ */ jsxRuntime.jsx(
@@ -49482,13 +49496,13 @@ var AlertsPopup = ({
               }
             )
           ] }),
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col max-h-[380px] overflow-y-auto", children: [
-            isLoading && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-5 py-10 text-sm text-gray-500", children: "Loading current shift alerts..." }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col flex-1 min-h-0 overflow-y-auto max-h-[500px]", children: [
+            isLoading && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-5 py-10 text-sm text-gray-500", children: "Loading alerts..." }),
             !isLoading && error && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-5 py-10 text-sm text-red-600", children: error }),
-            !isLoading && !error && alerts.length === 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-5 py-10 text-sm text-gray-500", children: "No active alerts for the current shift." }),
+            !isLoading && !error && alerts.length === 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-5 py-10 text-sm text-gray-500", children: "No alerts right now." }),
             !isLoading && !error && alerts.map((alert2, index) => {
               const isCritical = typeof alert2.delta_efficiency === "number" && alert2.delta_efficiency <= -10;
-              const description = `${alert2.monitoring_mode === "uptime" ? "Uptime" : "Output"} efficiency is ${formatPercent(alert2.current_efficiency)} vs last week's ${formatPercent(alert2.baseline_efficiency)} average.`;
+              const description = `Now: ${formatPercent(alert2.current_efficiency)}. Usual for this shift: ${formatPercent(alert2.baseline_efficiency)}.`;
               return /* @__PURE__ */ jsxRuntime.jsx(
                 motion.div,
                 {
@@ -49505,20 +49519,13 @@ var AlertsPopup = ({
                     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1", children: [
                       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-between items-start mb-1.5", children: [
                         /* @__PURE__ */ jsxRuntime.jsx("h4", { className: "text-sm font-semibold text-[#111827]", children: alert2.line_name }),
-                        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[12px] text-[#94a3b8] font-medium whitespace-nowrap ml-3", children: formatRelativeTime2(alert2.evaluated_at) })
-                      ] }),
-                      /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-[12px] font-medium text-[#475569] uppercase tracking-wide", children: [
-                        alert2.monitoring_mode === "uptime" ? "Uptime" : "Output",
-                        " regression"
+                        /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-[12px] text-[#94a3b8] font-medium whitespace-nowrap ml-3", children: [
+                          "Checked ",
+                          formatRelativeTime2(alert2.evaluated_at)
+                        ] })
                       ] }),
-                      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[13.5px] text-[#64748b] leading-[1.45] mt-1", children: description }),
-                      /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-[12px] text-[#94a3b8] mt-2", children: [
-                        "Delta ",
-                        formatPercent(alert2.delta_efficiency),
-                        " across ",
-                        alert2.baseline_sample_size,
-                        " historical shifts"
-                      ] })
+                      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[12px] font-medium text-[#475569] uppercase tracking-wide", children: alert2.monitoring_mode === "uptime" ? "Machine Utilization is low" : "Output is low" }),
+                      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[13.5px] text-[#64748b] leading-[1.45] mt-1", children: description })
                     ] })
                   ] })
                 },
@@ -49581,7 +49588,7 @@ var SideNavBar = React141.memo(({
   const handleHomeClick = React141.useCallback(() => {
     navigate("/", {
       trackingEvent: {
-        name: "Line Overview Page Clicked",
+        name: "Operations Overview Page Clicked",
         properties: {
           source: "side_nav",
           line_id: lineId,
@@ -49869,6 +49876,7 @@ var SideNavBar = React141.memo(({
     }
   }, [signOut]);
   const handleLogoClick = React141.useCallback(() => {
+    trackCoreEvent("Operations Overview Page Clicked", { source: "logo" });
     navigate("/");
     onMobileMenuClose?.();
   }, [navigate, onMobileMenuClose]);
@@ -50021,9 +50029,11 @@ var SideNavBar = React141.memo(({
         {
           ref: alertsTriggerRef,
           onClick: () => {
-            setIsAlertsOpen(!isAlertsOpen);
+            const willOpen = !isAlertsOpen;
+            setIsAlertsOpen(willOpen);
             setIsSettingsOpen(false);
-            if (!isAlertsOpen) {
+            if (willOpen) {
+              trackCoreEvent("Alerts Page Clicked", { source: "side_nav" });
               void refreshAlertsSummary();
             }
           },
@@ -50181,6 +50191,7 @@ var SideNavBar = React141.memo(({
             {
               onClick: () => {
                 setIsAlertsOpen(true);
+                trackCoreEvent("Alerts Page Clicked", { source: "side_nav_mobile" });
                 void refreshAlertsSummary();
                 onMobileMenuClose?.();
               },
@@ -59990,6 +60001,7 @@ var KPIsOverviewView = ({
   backLinkUrl,
   lineIds
 }) => {
+  const router$1 = router.useRouter();
   const [lines, setLines] = React141.useState([]);
   const [leaderboardLines, setLeaderboardLines] = React141.useState([]);
   const [leaderboardLinesLoading, setLeaderboardLinesLoading] = React141.useState(false);
@@ -60017,6 +60029,13 @@ var KPIsOverviewView = ({
   const [monthlyError, setMonthlyError] = React141.useState(null);
   const dailyRequestKeyRef = React141.useRef(null);
   const monthlyRequestKeyRef = React141.useRef(null);
+  React141.useEffect(() => {
+    if (!router$1.isReady) return;
+    const tab = router$1.query.tab;
+    if (tab === "leaderboard") {
+      setActiveTab("leaderboard");
+    }
+  }, [router$1.isReady, router$1.query.tab]);
   const supabase = useSupabase();
   const { user } = useAuth();
   const dashboardConfig = useDashboardConfig();
@@ -72285,13 +72304,7 @@ var formatIdleDuration = (seconds) => {
   if (seconds === null || seconds === void 0 || !Number.isFinite(seconds)) {
     return "--";
   }
-  const wholeSeconds = Math.max(0, Math.round(seconds));
-  const minutes = Math.floor(wholeSeconds / 60);
-  const remainingSeconds = wholeSeconds % 60;
-  if (minutes > 0) {
-    return `${minutes}m ${remainingSeconds}s`;
-  }
-  return `${remainingSeconds}s`;
+  return formatIdleTime(Math.max(0, Math.round(seconds)));
 };
 var formatSignedIdleDuration = (seconds) => {
   const sign = seconds > 0 ? "+" : "-";
@@ -72418,6 +72431,7 @@ var PlantHeadView = () => {
   const [trendFetchNonce, setTrendFetchNonce] = React141__namespace.default.useState(0);
   const [trendViewOpenNonce] = React141__namespace.default.useState(() => Date.now());
   const [idleReasonBreakdown, setIdleReasonBreakdown] = React141__namespace.default.useState([]);
+  const [idleReasonScope, setIdleReasonScope] = React141__namespace.default.useState(null);
   const [isIdleReasonBreakdownLoading, setIsIdleReasonBreakdownLoading] = React141__namespace.default.useState(false);
   const [improvements, setImprovements] = React141__namespace.default.useState([]);
   const [isImprovementsLoading, setIsImprovementsLoading] = React141__namespace.default.useState(false);
@@ -72425,6 +72439,35 @@ var PlantHeadView = () => {
   const filterRef = React141__namespace.default.useRef(null);
   const filterButtonRef = React141__namespace.default.useRef(null);
   const mobileFilterButtonRef = React141__namespace.default.useRef(null);
+  React141__namespace.default.useEffect(() => {
+    trackCorePageView("Operations Overview");
+  }, []);
+  const handleDateRangeChange = React141__namespace.default.useCallback((range) => {
+    trackCoreEvent("Operations Overview Date Range Changed", {
+      start_date: range.startKey,
+      end_date: range.endKey
+    });
+    setDateRange(range);
+  }, []);
+  const handleFilterToggle = React141__namespace.default.useCallback(() => {
+    trackCoreEvent("Operations Overview Filter Toggled", {
+      action: !isFilterOpen ? "open" : "close"
+    });
+    setIsFilterOpen(!isFilterOpen);
+  }, [isFilterOpen]);
+  const handleTrendModeChange = React141__namespace.default.useCallback((e) => {
+    const newMode = e.target.value;
+    trackCoreEvent("Operations Overview Shift Filter Changed", {
+      shift_mode: newMode
+    });
+    setTrendMode(newMode);
+  }, []);
+  const handlePoorestLineModeChange = React141__namespace.default.useCallback((mode) => {
+    trackCoreEvent("Operations Overview Poorest Line Mode Changed", {
+      mode
+    });
+    setPoorestLineMode(mode);
+  }, []);
   React141__namespace.default.useEffect(() => {
     function handleClickOutside(event) {
       if (filterRef.current && !filterRef.current.contains(event.target) && filterButtonRef.current && !filterButtonRef.current.contains(event.target) && mobileFilterButtonRef.current && !mobileFilterButtonRef.current.contains(event.target)) {
@@ -72574,11 +72617,13 @@ var PlantHeadView = () => {
   React141__namespace.default.useEffect(() => {
     if (!supabase || !companyId) return void 0;
     if (scopedLineIds.length === 0) {
+      setIdleReasonScope(null);
       setIdleReasonBreakdown([]);
       setIsIdleReasonBreakdownLoading(false);
       return void 0;
     }
     let cancelled = false;
+    setIdleReasonScope(null);
     setIdleReasonBreakdown([]);
     setIsIdleReasonBreakdownLoading(true);
     const fetchIdleReasonBreakdown = async () => {
@@ -72594,12 +72639,14 @@ var PlantHeadView = () => {
         `/api/dashboard/operations-overview/idle-reason-breakdown?${params.toString()}`
       );
       if (!cancelled) {
+        setIdleReasonScope(response.scope || null);
         setIdleReasonBreakdown(response.idle_reason_breakdown || []);
       }
     };
     fetchIdleReasonBreakdown().catch((error) => {
       console.error("[PlantHeadView] Failed to fetch idle reason breakdown", error);
       if (!cancelled) {
+        setIdleReasonScope(null);
         setIdleReasonBreakdown([]);
       }
     }).finally(() => {
@@ -72695,13 +72742,17 @@ var PlantHeadView = () => {
     });
   }, [comparisonLabel, overview.summary?.avg_idle_per_workstation?.delta_seconds]);
   const trendData = React141__namespace.default.useMemo(() => {
-    return (overview.trend?.points || []).map((point) => ({
-      name: point.date ? dateFns.format(parseDateKeyToDate(point.date), "MMM d") : "",
-      efficiency: (() => {
-        const value = toNumber3(point.avg_efficiency);
-        return value === null ? void 0 : value;
-      })()
-    }));
+    return (overview.trend?.points || []).map((point) => {
+      const pointDate = point.date ? parseDateKeyToDate(point.date) : null;
+      return {
+        name: pointDate ? dateFns.format(pointDate, "MMM d") : "",
+        dayOfWeek: pointDate ? dateFns.format(pointDate, "EEEE") : "",
+        efficiency: (() => {
+          const value = toNumber3(point.avg_efficiency);
+          return value === null ? void 0 : value;
+        })()
+      };
+    });
   }, [overview.trend?.points]);
   const trendPlayKey = React141__namespace.default.useMemo(() => {
     return `${trendViewOpenNonce}:${trendFetchNonce}`;
@@ -72720,6 +72771,10 @@ var PlantHeadView = () => {
       }))
     })).filter((item) => item.value > 0);
   }, [idleReasonBreakdown]);
+  const showIdleModuleNotEnabledState = React141__namespace.default.useMemo(() => {
+    const enabledLineCount = idleReasonScope?.idle_time_vlm_enabled_line_count;
+    return !isIdleReasonBreakdownLoading && scopedLineIds.length > 0 && typeof enabledLineCount === "number" && enabledLineCount === 0;
+  }, [idleReasonScope?.idle_time_vlm_enabled_line_count, isIdleReasonBreakdownLoading, scopedLineIds.length]);
   const mergedPoorestLines = React141__namespace.default.useMemo(() => {
     const rows = overview.poorest_lines?.[poorestLineMode] || [];
     return rows.slice(0, 3).map((line) => {
@@ -72740,6 +72795,11 @@ var PlantHeadView = () => {
   const showPoorestModeToggle = !!availableLineModes?.has_output && !!availableLineModes?.has_uptime;
   availableLineModes?.has_uptime && !availableLineModes?.has_output ? "Uptime" : "Output";
   const poorestMetricLabel = poorestLineMode === "uptime" ? "Uptime" : "Efficiency";
+  const trendTooltipLabelFormatter = React141__namespace.default.useCallback((label, payload) => {
+    const dayOfWeek = payload?.[0]?.payload?.dayOfWeek;
+    if (!dayOfWeek || typeof label !== "string") return label;
+    return `${label} (${dayOfWeek})`;
+  }, []);
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col min-h-screen bg-slate-50 w-full font-sans", children: [
     /* @__PURE__ */ jsxRuntime.jsx("header", { className: "sticky top-0 z-10 bg-white border-b flex-shrink-0 shadow-sm", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "px-3 sm:px-4 md:px-6 py-2 sm:py-3 relative", children: [
       /* @__PURE__ */ jsxRuntime.jsx("div", { className: "sm:hidden", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center", children: [
@@ -72766,7 +72826,7 @@ var PlantHeadView = () => {
               year: parseDateKeyToDate(dateRange.startKey).getFullYear(),
               timezone: appTimezone,
               value: dateRange,
-              onChange: setDateRange,
+              onChange: handleDateRangeChange,
               showLabel: false
             }
           ),
@@ -72774,7 +72834,7 @@ var PlantHeadView = () => {
             "button",
             {
               ref: mobileFilterButtonRef,
-              onClick: () => setIsFilterOpen(!isFilterOpen),
+              onClick: handleFilterToggle,
               className: `p-2 rounded-full transition-colors relative ${isFilterOpen || trendMode !== "all" ? "bg-blue-50" : "active:bg-gray-100"}`,
               "aria-label": "Open filters",
               children: [
@@ -72802,7 +72862,7 @@ var PlantHeadView = () => {
               year: parseDateKeyToDate(dateRange.startKey).getFullYear(),
               timezone: appTimezone,
               value: dateRange,
-              onChange: setDateRange,
+              onChange: handleDateRangeChange,
               showLabel: false
             }
           ) }),
@@ -72810,7 +72870,7 @@ var PlantHeadView = () => {
             "button",
             {
               ref: filterButtonRef,
-              onClick: () => setIsFilterOpen(!isFilterOpen),
+              onClick: handleFilterToggle,
               className: `flex items-center gap-2 px-3 py-1.5 rounded-lg border text-sm font-medium transition-all shadow-sm ${isFilterOpen || trendMode !== "all" ? "border-blue-500 bg-blue-50 text-blue-700 ring-1 ring-blue-500" : "border-slate-200 bg-white text-slate-700 hover:bg-slate-50"}`,
               "aria-label": "Open filters",
               children: [
@@ -72843,7 +72903,7 @@ var PlantHeadView = () => {
             "select",
             {
               value: trendMode,
-              onChange: (e) => setTrendMode(e.target.value),
+              onChange: handleTrendModeChange,
               className: "w-full appearance-none pl-3 pr-8 py-2 text-sm bg-gray-50 border border-gray-200 hover:border-gray-300 rounded-lg text-gray-900 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:bg-white transition-all cursor-pointer",
               style: { backgroundImage: `url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e")`, backgroundPosition: `right 0.75rem center`, backgroundRepeat: `no-repeat`, backgroundSize: `1.2em 1.2em` },
               children: [
@@ -72905,7 +72965,7 @@ var PlantHeadView = () => {
                     "button",
                     {
                       type: "button",
-                      onClick: () => setPoorestLineMode("output"),
+                      onClick: () => handlePoorestLineModeChange("output"),
                       className: `px-3 py-1 text-[11px] font-bold rounded-md ${poorestLineMode === "output" ? "bg-white text-slate-800 shadow-sm" : "text-slate-500 hover:text-slate-800"}`,
                       children: "Output"
                     }
@@ -72914,7 +72974,7 @@ var PlantHeadView = () => {
                     "button",
                     {
                       type: "button",
-                      onClick: () => setPoorestLineMode("uptime"),
+                      onClick: () => handlePoorestLineModeChange("uptime"),
                       className: `px-3 py-1 text-[11px] font-bold rounded-md ${poorestLineMode === "uptime" ? "bg-white text-slate-800 shadow-sm" : "text-slate-500 hover:text-slate-800"}`,
                       children: "Uptime"
                     }
@@ -72925,7 +72985,10 @@ var PlantHeadView = () => {
                 "button",
                 {
                   type: "button",
-                  onClick: () => navigate("/kpis"),
+                  onClick: () => {
+                    trackCoreEvent("Operations Overview View All Clicked", { section: "poorest_performers" });
+                    navigate("/kpis?tab=leaderboard");
+                  },
                   className: "text-[11px] font-bold text-slate-500 hover:text-slate-800 transition-colors",
                   children: "View All"
                 }
@@ -72941,7 +73004,10 @@ var PlantHeadView = () => {
                 return /* @__PURE__ */ jsxRuntime.jsx(
                   "div",
                   {
-                    onClick: () => navigate(`/kpis/${line.id}`),
+                    onClick: () => {
+                      trackCoreEvent("Operations Overview Line Clicked", { line_id: line.id, line_name: line.name });
+                      navigate(`/kpis/${line.id}`);
+                    },
                     className: "block py-3 hover:bg-slate-50/50 transition-colors cursor-pointer group relative",
                     children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between gap-4", children: [
                       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3 min-w-0", children: [
@@ -72981,7 +73047,10 @@ var PlantHeadView = () => {
               className: "bg-white rounded-xl shadow-sm border border-slate-100 flex flex-col overflow-hidden text-left",
               children: [
                 /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-5 py-4 flex-none flex justify-between items-center border-b border-slate-50/50 relative", children: /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-lg font-semibold text-gray-700", children: "Idle Time Breakdown" }) }),
-                /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 min-h-0 p-4 pt-2 relative", children: isIdleReasonBreakdownLoading ? /* @__PURE__ */ jsxRuntime.jsx(OverviewIdleBreakdownSkeleton, {}) : /* @__PURE__ */ jsxRuntime.jsx(
+                /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 min-h-0 p-4 pt-2 relative", children: isIdleReasonBreakdownLoading ? /* @__PURE__ */ jsxRuntime.jsx(OverviewIdleBreakdownSkeleton, {}) : showIdleModuleNotEnabledState ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-full flex items-center justify-center rounded-xl border border-dashed border-slate-200 bg-slate-50/80 px-6 text-center", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+                  /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-semibold text-slate-700", children: "Module not enabled" }),
+                  /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-1 text-xs text-slate-500", children: "Enable idle-time VLM on at least one line to view this breakdown." })
+                ] }) }) : /* @__PURE__ */ jsxRuntime.jsx(
                   IdleTimeReasonChart,
                   {
                     data: idleBreakdown,
@@ -73010,7 +73079,8 @@ var PlantHeadView = () => {
                     yAxisDomain: [0, 100],
                     showLegend: false,
                     showGrid: true,
-                    fillContainer: true
+                    fillContainer: true,
+                    tooltipLabelFormatter: trendTooltipLabelFormatter
                   },
                   trendPlayKey
                 ) }) })
@@ -73024,7 +73094,10 @@ var PlantHeadView = () => {
                 "button",
                 {
                   type: "button",
-                  onClick: () => navigate("/improvement-center"),
+                  onClick: () => {
+                    trackCoreEvent("Operations Overview View All Clicked", { section: "improvements" });
+                    navigate("/improvement-center");
+                  },
                   className: "text-[11px] font-bold text-slate-500 hover:text-slate-800 transition-colors",
                   children: "View All"
                 }
@@ -73033,7 +73106,10 @@ var PlantHeadView = () => {
             /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 p-0 flex flex-col px-5 py-2 justify-start overflow-auto", children: isImprovementsLoading ? /* @__PURE__ */ jsxRuntime.jsx(OverviewImprovementsSkeleton, {}) : improvements.length > 0 ? improvements.map((item) => /* @__PURE__ */ jsxRuntime.jsx(
               "div",
               {
-                onClick: () => navigate("/improvement-center"),
+                onClick: () => {
+                  trackCoreEvent("Operations Overview Improvement Clicked", { issue_id: item.id, title: item.title });
+                  navigate("/improvement-center");
+                },
                 className: "flex items-center justify-between py-3 border-b border-slate-50 last:border-0 group cursor-pointer",
                 children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3 flex-1 min-w-0 pr-4", children: [
                   /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-center flex-shrink-0", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ArrowUpRight, { className: "w-4 h-4 text-slate-400 group-hover:text-indigo-500 transition-colors" }) }),

package/dist/index.mjs

@@ -29768,6 +29768,7 @@ var LineChartComponent = ({
   yAxisUnit,
   yAxisDomain,
   tooltipFormatter,
+  tooltipLabelFormatter,
   legendPayload,
   className,
   showGrid = true,
@@ -29847,7 +29848,15 @@ var LineChartComponent = ({
         stroke: axisStrokeColor
       }
     ),
-    showTooltip && /* @__PURE__ */ jsx(Tooltip, { formatter: tooltipFormatter || defaultTooltipFormatter, itemStyle: { color: "#111827" }, cursor: { strokeDasharray: "3 3" } }),
+    showTooltip && /* @__PURE__ */ jsx(
+      Tooltip,
+      {
+        formatter: tooltipFormatter || defaultTooltipFormatter,
+        labelFormatter: tooltipLabelFormatter,
+        itemStyle: { color: "#111827" },
+        cursor: { strokeDasharray: "3 3" }
+      }
+    ),
     showLegend && /* @__PURE__ */ jsx(Legend, { payload: legendPayload }),
     lines.map((lineConfig, index) => {
       const lineProps = {
@@ -29903,7 +29912,7 @@ var LineChart = React141__default.memo(LineChartComponent, (prevProps, nextProps
   })) {
     return false;
   }
-  if (prevProps.tooltipFormatter !== nextProps.tooltipFormatter || prevProps.xAxisTickFormatter !== nextProps.xAxisTickFormatter || JSON.stringify(prevProps.legendPayload) !== JSON.stringify(nextProps.legendPayload)) {
+  if (prevProps.tooltipFormatter !== nextProps.tooltipFormatter || prevProps.xAxisTickFormatter !== nextProps.xAxisTickFormatter || prevProps.tooltipLabelFormatter !== nextProps.tooltipLabelFormatter || JSON.stringify(prevProps.legendPayload) !== JSON.stringify(nextProps.legendPayload)) {
     return false;
   }
   return true;
@@ -42618,22 +42627,16 @@ var formatDuration = (seconds) => {
   const hours = Math.floor(wholeSeconds % 86400 / 3600);
   const minutes = Math.floor(wholeSeconds % 3600 / 60);
   const remainingSeconds = wholeSeconds % 60;
-  if (days > 0) {
-    return `${days}d ${hours}h ${minutes}m ${remainingSeconds}s`;
-  }
-  if (hours > 0) {
-    return `${hours}h ${minutes}m ${remainingSeconds}s`;
-  }
-  if (minutes > 0) {
-    return `${minutes}m ${remainingSeconds}s`;
-  }
-  return `${remainingSeconds}s`;
-};
-var formatPercentage = (value) => {
-  if (value === null || value === void 0 || !Number.isFinite(value)) {
-    return "--";
+  const parts = [];
+  if (days > 0) parts.push(`${days}d`);
+  if (hours > 0) parts.push(`${hours}h`);
+  if (minutes > 0) parts.push(`${minutes}m`);
+  if (days === 0 && hours === 0) {
+    if (remainingSeconds > 0 || parts.length === 0) {
+      parts.push(`${remainingSeconds}s`);
+    }
   }
-  return `${value.toFixed(1)}%`;
+  return parts.join(" ");
 };
 var getColorForEntry = (name, index) => {
   const normalized = name.trim().toLowerCase();
@@ -42653,30 +42656,35 @@ var CustomTooltip = ({ active, payload, hideTotalDuration }) => {
   if (active && payload && payload.length) {
     const datum = payload[0]?.payload;
     const contributors = datum?.contributors || [];
-    const fill = payload[0]?.payload?.fill || payload[0]?.fill || getColorForEntry(payload[0].name, 0);
-    return /* @__PURE__ */ jsxs("div", { className: "bg-white/95 backdrop-blur-sm p-3 border border-gray-200 shadow-xl rounded-lg z-50 min-w-[200px]", children: [
-      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5 mb-2 pb-1 border-b border-gray-100", children: [
-        /* @__PURE__ */ jsx("div", { className: "w-2.5 h-2.5 rounded-full flex-shrink-0", style: { backgroundColor: fill } }),
-        /* @__PURE__ */ jsx("span", { className: "font-semibold text-slate-800 text-sm", children: payload[0].name.replace(/_/g, " ") })
+    let effContributionStr = "--";
+    if (datum?.efficiencyLossPercentage !== null && datum?.efficiencyLossPercentage !== void 0 && Number.isFinite(datum?.efficiencyLossPercentage)) {
+      const val = datum.efficiencyLossPercentage;
+      effContributionStr = val === 0 ? "0.0%" : `${Math.abs(val).toFixed(1)}%`;
+    }
+    const hasContributors = contributors.length > 0;
+    return /* @__PURE__ */ jsxs("div", { className: "bg-white p-3 border border-gray-100 shadow-lg rounded-lg text-xs z-50 min-w-[280px]", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 pb-2 mb-2 border-b border-slate-100", children: [
+        /* @__PURE__ */ jsx("div", { className: "w-2.5 h-2.5 rounded-full flex-shrink-0", style: { backgroundColor: payload[0].payload.fill || getColorForEntry(payload[0].name, 0) } }),
+        /* @__PURE__ */ jsx("span", { className: "font-semibold text-slate-800 text-[13px]", children: payload[0].name.replace(/_/g, " ") })
       ] }),
-      /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1 text-xs", children: [
-        /* @__PURE__ */ jsxs("div", { className: "flex justify-between items-center gap-3", children: [
+      /* @__PURE__ */ jsxs("div", { className: "space-y-1.5 pb-1", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex justify-between items-center gap-4", children: [
           /* @__PURE__ */ jsx("span", { className: "text-slate-500", children: "Share of idle time" }),
-          /* @__PURE__ */ jsx("span", { className: "font-medium text-slate-800", children: `${payload[0].value.toFixed(1)}%` })
+          /* @__PURE__ */ jsx("span", { className: "font-semibold text-slate-800", children: `${payload[0].value.toFixed(1)}%` })
         ] }),
-        !hideTotalDuration && datum?.totalDurationSeconds !== void 0 ? /* @__PURE__ */ jsxs("div", { className: "flex justify-between items-center gap-3", children: [
+        !hideTotalDuration && !hasContributors && datum?.totalDurationSeconds !== void 0 ? /* @__PURE__ */ jsxs("div", { className: "flex justify-between items-center gap-4", children: [
           /* @__PURE__ */ jsx("span", { className: "text-slate-500", children: "Total Duration" }),
-          /* @__PURE__ */ jsx("span", { className: "font-medium text-slate-800", children: formatDuration(datum.totalDurationSeconds) })
+          /* @__PURE__ */ jsx("span", { className: "font-semibold text-slate-800", children: formatDuration(datum.totalDurationSeconds) })
         ] }) : null,
-        /* @__PURE__ */ jsxs("div", { className: "flex justify-between items-center gap-3", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex justify-between items-center gap-4", children: [
           /* @__PURE__ */ jsx("span", { className: "text-slate-500", children: "Efficiency Loss" }),
-          /* @__PURE__ */ jsx("span", { className: "font-medium text-slate-800", children: formatPercentage(datum?.efficiencyLossPercentage) })
+          /* @__PURE__ */ jsx("span", { className: "font-semibold text-slate-800", children: effContributionStr })
         ] })
       ] }),
-      contributors.length > 0 ? /* @__PURE__ */ jsxs("div", { className: "mt-2 pt-2 border-t border-gray-100", children: [
-        /* @__PURE__ */ jsx("p", { className: "text-[9px] font-semibold uppercase tracking-wider text-slate-400 mb-1.5", children: "Top Workstations" }),
-        /* @__PURE__ */ jsx("div", { className: "space-y-1", children: contributors.slice(0, 3).map((contributor) => /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between gap-2 text-[10px]", children: [
-          /* @__PURE__ */ jsx("span", { className: "text-slate-700 truncate max-w-[120px]", children: contributor.workspaceName }),
+      hasContributors ? /* @__PURE__ */ jsxs("div", { className: "mt-2 pt-2 border-t border-slate-100", children: [
+        /* @__PURE__ */ jsx("p", { className: "text-[10px] font-bold uppercase tracking-wider text-slate-400 mb-2", children: "TOP CONTRIBUTORS" }),
+        /* @__PURE__ */ jsx("div", { className: "space-y-1.5", children: contributors.slice(0, 3).map((contributor) => /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between gap-3", children: [
+          /* @__PURE__ */ jsx("span", { className: "text-slate-600 truncate max-w-[170px]", title: contributor.workspaceName, children: contributor.workspaceName }),
           /* @__PURE__ */ jsx("span", { className: "text-slate-500 text-right whitespace-nowrap", children: `${formatDuration(contributor.totalDurationSeconds)} \u2022 ${Number(contributor.percentageWithinReason || 0).toFixed(1)}%` })
         ] }, `${payload[0].name}-${contributor.workspaceId}`)) })
       ] }) : null
@@ -49357,10 +49365,11 @@ var AlertsPopup = ({
   const updatePosition = useCallback(() => {
     const viewportHeight = window.innerHeight;
     const viewportWidth = window.innerWidth;
+    const currentPopupHeight = popupRef.current?.offsetHeight || 280;
     if (viewportWidth < 768) {
-      const mobileWidth = Math.max(240, Math.min(360, viewportWidth - 32));
+      const mobileWidth = Math.max(240, Math.min(380, viewportWidth - 32));
       setPosition({
-        top: Math.max(16, (viewportHeight - 280) / 2),
+        top: Math.max(16, (viewportHeight - currentPopupHeight) / 2),
         left: Math.max(16, (viewportWidth - mobileWidth) / 2),
         width: mobileWidth
       });
@@ -49368,22 +49377,25 @@ var AlertsPopup = ({
     }
     if (!triggerRef.current) return;
     const rect = triggerRef.current.getBoundingClientRect();
-    const popupHeight = 280;
-    let top = rect.bottom - popupHeight + 40;
-    if (top < 16) top = 16;
-    if (top + popupHeight > viewportHeight - 16) {
-      top = viewportHeight - popupHeight - 16;
-    }
+    const bottomOffset = viewportHeight - rect.bottom + 12;
     setPosition({
-      top,
+      bottom: bottomOffset,
       left: 88,
       // Sidebar width (80px) + gap (8px)
-      width: 360
+      width: 400
+      // Make it a bit wider for enterprise/cleaner look
     });
   }, [triggerRef]);
   useEffect(() => {
     if (isOpen) {
-      updatePosition();
+      const timer = setTimeout(() => {
+        updatePosition();
+      }, 0);
+      return () => clearTimeout(timer);
+    }
+  }, [isOpen, alerts, isLoading, error, updatePosition]);
+  useEffect(() => {
+    if (isOpen) {
       window.addEventListener("resize", updatePosition);
       window.addEventListener("scroll", updatePosition);
     }
@@ -49429,19 +49441,21 @@ var AlertsPopup = ({
         },
         style: {
           position: "fixed",
-          top: position.top,
+          ...position.top !== void 0 ? { top: position.top } : {},
+          ...position.bottom !== void 0 ? { bottom: position.bottom } : {},
           left: position.left,
           width: position.width,
+          maxHeight: "calc(100vh - 32px)",
           zIndex: 2147483647
         },
-        className: "bg-white rounded-[16px] shadow-xl border border-gray-100 max-w-[calc(100vw-32px)] overflow-hidden flex flex-col",
+        className: "bg-white rounded-[16px] shadow-2xl border border-gray-100 max-w-[calc(100vw-32px)] max-h-[calc(100vh-80px)] overflow-hidden flex flex-col",
         children: [
-          /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between px-5 py-4 border-b border-gray-50 bg-[#fafafa]", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between px-5 py-4 border-b border-gray-50 bg-[#fafafa] shrink-0", children: [
             /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
-              /* @__PURE__ */ jsx("h3", { className: "text-[14px] font-bold text-[#111827] uppercase tracking-wide", children: "Recent Alerts" }),
+              /* @__PURE__ */ jsx("h3", { className: "text-[14px] font-bold text-[#111827] uppercase tracking-wide", children: "Current Alerts" }),
               alertsCount > 0 && /* @__PURE__ */ jsxs("span", { className: "bg-[#eff6ff] text-[#2563eb] text-[11px] font-bold px-2 py-0.5 rounded-full", children: [
                 alertsCount,
-                " Active"
+                " alerts"
               ] })
             ] }),
             /* @__PURE__ */ jsx(
@@ -49453,13 +49467,13 @@ var AlertsPopup = ({
               }
             )
           ] }),
-          /* @__PURE__ */ jsxs("div", { className: "flex flex-col max-h-[380px] overflow-y-auto", children: [
-            isLoading && /* @__PURE__ */ jsx("div", { className: "px-5 py-10 text-sm text-gray-500", children: "Loading current shift alerts..." }),
+          /* @__PURE__ */ jsxs("div", { className: "flex flex-col flex-1 min-h-0 overflow-y-auto max-h-[500px]", children: [
+            isLoading && /* @__PURE__ */ jsx("div", { className: "px-5 py-10 text-sm text-gray-500", children: "Loading alerts..." }),
             !isLoading && error && /* @__PURE__ */ jsx("div", { className: "px-5 py-10 text-sm text-red-600", children: error }),
-            !isLoading && !error && alerts.length === 0 && /* @__PURE__ */ jsx("div", { className: "px-5 py-10 text-sm text-gray-500", children: "No active alerts for the current shift." }),
+            !isLoading && !error && alerts.length === 0 && /* @__PURE__ */ jsx("div", { className: "px-5 py-10 text-sm text-gray-500", children: "No alerts right now." }),
             !isLoading && !error && alerts.map((alert2, index) => {
               const isCritical = typeof alert2.delta_efficiency === "number" && alert2.delta_efficiency <= -10;
-              const description = `${alert2.monitoring_mode === "uptime" ? "Uptime" : "Output"} efficiency is ${formatPercent(alert2.current_efficiency)} vs last week's ${formatPercent(alert2.baseline_efficiency)} average.`;
+              const description = `Now: ${formatPercent(alert2.current_efficiency)}. Usual for this shift: ${formatPercent(alert2.baseline_efficiency)}.`;
               return /* @__PURE__ */ jsx(
                 motion.div,
                 {
@@ -49476,20 +49490,13 @@ var AlertsPopup = ({
                     /* @__PURE__ */ jsxs("div", { className: "flex-1", children: [
                       /* @__PURE__ */ jsxs("div", { className: "flex justify-between items-start mb-1.5", children: [
                         /* @__PURE__ */ jsx("h4", { className: "text-sm font-semibold text-[#111827]", children: alert2.line_name }),
-                        /* @__PURE__ */ jsx("span", { className: "text-[12px] text-[#94a3b8] font-medium whitespace-nowrap ml-3", children: formatRelativeTime2(alert2.evaluated_at) })
-                      ] }),
-                      /* @__PURE__ */ jsxs("p", { className: "text-[12px] font-medium text-[#475569] uppercase tracking-wide", children: [
-                        alert2.monitoring_mode === "uptime" ? "Uptime" : "Output",
-                        " regression"
+                        /* @__PURE__ */ jsxs("span", { className: "text-[12px] text-[#94a3b8] font-medium whitespace-nowrap ml-3", children: [
+                          "Checked ",
+                          formatRelativeTime2(alert2.evaluated_at)
+                        ] })
                       ] }),
-                      /* @__PURE__ */ jsx("p", { className: "text-[13.5px] text-[#64748b] leading-[1.45] mt-1", children: description }),
-                      /* @__PURE__ */ jsxs("p", { className: "text-[12px] text-[#94a3b8] mt-2", children: [
-                        "Delta ",
-                        formatPercent(alert2.delta_efficiency),
-                        " across ",
-                        alert2.baseline_sample_size,
-                        " historical shifts"
-                      ] })
+                      /* @__PURE__ */ jsx("p", { className: "text-[12px] font-medium text-[#475569] uppercase tracking-wide", children: alert2.monitoring_mode === "uptime" ? "Machine Utilization is low" : "Output is low" }),
+                      /* @__PURE__ */ jsx("p", { className: "text-[13.5px] text-[#64748b] leading-[1.45] mt-1", children: description })
                     ] })
                   ] })
                 },
@@ -49552,7 +49559,7 @@ var SideNavBar = memo$1(({
   const handleHomeClick = useCallback(() => {
     navigate("/", {
       trackingEvent: {
-        name: "Line Overview Page Clicked",
+        name: "Operations Overview Page Clicked",
         properties: {
           source: "side_nav",
           line_id: lineId,
@@ -49840,6 +49847,7 @@ var SideNavBar = memo$1(({
     }
   }, [signOut]);
   const handleLogoClick = useCallback(() => {
+    trackCoreEvent("Operations Overview Page Clicked", { source: "logo" });
     navigate("/");
     onMobileMenuClose?.();
   }, [navigate, onMobileMenuClose]);
@@ -49992,9 +50000,11 @@ var SideNavBar = memo$1(({
         {
           ref: alertsTriggerRef,
           onClick: () => {
-            setIsAlertsOpen(!isAlertsOpen);
+            const willOpen = !isAlertsOpen;
+            setIsAlertsOpen(willOpen);
             setIsSettingsOpen(false);
-            if (!isAlertsOpen) {
+            if (willOpen) {
+              trackCoreEvent("Alerts Page Clicked", { source: "side_nav" });
               void refreshAlertsSummary();
             }
           },
@@ -50152,6 +50162,7 @@ var SideNavBar = memo$1(({
             {
               onClick: () => {
                 setIsAlertsOpen(true);
+                trackCoreEvent("Alerts Page Clicked", { source: "side_nav_mobile" });
                 void refreshAlertsSummary();
                 onMobileMenuClose?.();
               },
@@ -59961,6 +59972,7 @@ var KPIsOverviewView = ({
   backLinkUrl,
   lineIds
 }) => {
+  const router = useRouter();
   const [lines, setLines] = useState([]);
   const [leaderboardLines, setLeaderboardLines] = useState([]);
   const [leaderboardLinesLoading, setLeaderboardLinesLoading] = useState(false);
@@ -59988,6 +60000,13 @@ var KPIsOverviewView = ({
   const [monthlyError, setMonthlyError] = useState(null);
   const dailyRequestKeyRef = useRef(null);
   const monthlyRequestKeyRef = useRef(null);
+  useEffect(() => {
+    if (!router.isReady) return;
+    const tab = router.query.tab;
+    if (tab === "leaderboard") {
+      setActiveTab("leaderboard");
+    }
+  }, [router.isReady, router.query.tab]);
   const supabase = useSupabase();
   const { user } = useAuth();
   const dashboardConfig = useDashboardConfig();
@@ -72256,13 +72275,7 @@ var formatIdleDuration = (seconds) => {
   if (seconds === null || seconds === void 0 || !Number.isFinite(seconds)) {
     return "--";
   }
-  const wholeSeconds = Math.max(0, Math.round(seconds));
-  const minutes = Math.floor(wholeSeconds / 60);
-  const remainingSeconds = wholeSeconds % 60;
-  if (minutes > 0) {
-    return `${minutes}m ${remainingSeconds}s`;
-  }
-  return `${remainingSeconds}s`;
+  return formatIdleTime(Math.max(0, Math.round(seconds)));
 };
 var formatSignedIdleDuration = (seconds) => {
   const sign = seconds > 0 ? "+" : "-";
@@ -72389,6 +72402,7 @@ var PlantHeadView = () => {
   const [trendFetchNonce, setTrendFetchNonce] = React141__default.useState(0);
   const [trendViewOpenNonce] = React141__default.useState(() => Date.now());
   const [idleReasonBreakdown, setIdleReasonBreakdown] = React141__default.useState([]);
+  const [idleReasonScope, setIdleReasonScope] = React141__default.useState(null);
   const [isIdleReasonBreakdownLoading, setIsIdleReasonBreakdownLoading] = React141__default.useState(false);
   const [improvements, setImprovements] = React141__default.useState([]);
   const [isImprovementsLoading, setIsImprovementsLoading] = React141__default.useState(false);
@@ -72396,6 +72410,35 @@ var PlantHeadView = () => {
   const filterRef = React141__default.useRef(null);
   const filterButtonRef = React141__default.useRef(null);
   const mobileFilterButtonRef = React141__default.useRef(null);
+  React141__default.useEffect(() => {
+    trackCorePageView("Operations Overview");
+  }, []);
+  const handleDateRangeChange = React141__default.useCallback((range) => {
+    trackCoreEvent("Operations Overview Date Range Changed", {
+      start_date: range.startKey,
+      end_date: range.endKey
+    });
+    setDateRange(range);
+  }, []);
+  const handleFilterToggle = React141__default.useCallback(() => {
+    trackCoreEvent("Operations Overview Filter Toggled", {
+      action: !isFilterOpen ? "open" : "close"
+    });
+    setIsFilterOpen(!isFilterOpen);
+  }, [isFilterOpen]);
+  const handleTrendModeChange = React141__default.useCallback((e) => {
+    const newMode = e.target.value;
+    trackCoreEvent("Operations Overview Shift Filter Changed", {
+      shift_mode: newMode
+    });
+    setTrendMode(newMode);
+  }, []);
+  const handlePoorestLineModeChange = React141__default.useCallback((mode) => {
+    trackCoreEvent("Operations Overview Poorest Line Mode Changed", {
+      mode
+    });
+    setPoorestLineMode(mode);
+  }, []);
   React141__default.useEffect(() => {
     function handleClickOutside(event) {
       if (filterRef.current && !filterRef.current.contains(event.target) && filterButtonRef.current && !filterButtonRef.current.contains(event.target) && mobileFilterButtonRef.current && !mobileFilterButtonRef.current.contains(event.target)) {
@@ -72545,11 +72588,13 @@ var PlantHeadView = () => {
   React141__default.useEffect(() => {
     if (!supabase || !companyId) return void 0;
     if (scopedLineIds.length === 0) {
+      setIdleReasonScope(null);
       setIdleReasonBreakdown([]);
       setIsIdleReasonBreakdownLoading(false);
       return void 0;
     }
     let cancelled = false;
+    setIdleReasonScope(null);
     setIdleReasonBreakdown([]);
     setIsIdleReasonBreakdownLoading(true);
     const fetchIdleReasonBreakdown = async () => {
@@ -72565,12 +72610,14 @@ var PlantHeadView = () => {
         `/api/dashboard/operations-overview/idle-reason-breakdown?${params.toString()}`
       );
       if (!cancelled) {
+        setIdleReasonScope(response.scope || null);
         setIdleReasonBreakdown(response.idle_reason_breakdown || []);
       }
     };
     fetchIdleReasonBreakdown().catch((error) => {
       console.error("[PlantHeadView] Failed to fetch idle reason breakdown", error);
       if (!cancelled) {
+        setIdleReasonScope(null);
         setIdleReasonBreakdown([]);
       }
     }).finally(() => {
@@ -72666,13 +72713,17 @@ var PlantHeadView = () => {
     });
   }, [comparisonLabel, overview.summary?.avg_idle_per_workstation?.delta_seconds]);
   const trendData = React141__default.useMemo(() => {
-    return (overview.trend?.points || []).map((point) => ({
-      name: point.date ? format(parseDateKeyToDate(point.date), "MMM d") : "",
-      efficiency: (() => {
-        const value = toNumber3(point.avg_efficiency);
-        return value === null ? void 0 : value;
-      })()
-    }));
+    return (overview.trend?.points || []).map((point) => {
+      const pointDate = point.date ? parseDateKeyToDate(point.date) : null;
+      return {
+        name: pointDate ? format(pointDate, "MMM d") : "",
+        dayOfWeek: pointDate ? format(pointDate, "EEEE") : "",
+        efficiency: (() => {
+          const value = toNumber3(point.avg_efficiency);
+          return value === null ? void 0 : value;
+        })()
+      };
+    });
   }, [overview.trend?.points]);
   const trendPlayKey = React141__default.useMemo(() => {
     return `${trendViewOpenNonce}:${trendFetchNonce}`;
@@ -72691,6 +72742,10 @@ var PlantHeadView = () => {
       }))
     })).filter((item) => item.value > 0);
   }, [idleReasonBreakdown]);
+  const showIdleModuleNotEnabledState = React141__default.useMemo(() => {
+    const enabledLineCount = idleReasonScope?.idle_time_vlm_enabled_line_count;
+    return !isIdleReasonBreakdownLoading && scopedLineIds.length > 0 && typeof enabledLineCount === "number" && enabledLineCount === 0;
+  }, [idleReasonScope?.idle_time_vlm_enabled_line_count, isIdleReasonBreakdownLoading, scopedLineIds.length]);
   const mergedPoorestLines = React141__default.useMemo(() => {
     const rows = overview.poorest_lines?.[poorestLineMode] || [];
     return rows.slice(0, 3).map((line) => {
@@ -72711,6 +72766,11 @@ var PlantHeadView = () => {
   const showPoorestModeToggle = !!availableLineModes?.has_output && !!availableLineModes?.has_uptime;
   availableLineModes?.has_uptime && !availableLineModes?.has_output ? "Uptime" : "Output";
   const poorestMetricLabel = poorestLineMode === "uptime" ? "Uptime" : "Efficiency";
+  const trendTooltipLabelFormatter = React141__default.useCallback((label, payload) => {
+    const dayOfWeek = payload?.[0]?.payload?.dayOfWeek;
+    if (!dayOfWeek || typeof label !== "string") return label;
+    return `${label} (${dayOfWeek})`;
+  }, []);
   return /* @__PURE__ */ jsxs("div", { className: "flex flex-col min-h-screen bg-slate-50 w-full font-sans", children: [
     /* @__PURE__ */ jsx("header", { className: "sticky top-0 z-10 bg-white border-b flex-shrink-0 shadow-sm", children: /* @__PURE__ */ jsxs("div", { className: "px-3 sm:px-4 md:px-6 py-2 sm:py-3 relative", children: [
       /* @__PURE__ */ jsx("div", { className: "sm:hidden", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center", children: [
@@ -72737,7 +72797,7 @@ var PlantHeadView = () => {
               year: parseDateKeyToDate(dateRange.startKey).getFullYear(),
               timezone: appTimezone,
               value: dateRange,
-              onChange: setDateRange,
+              onChange: handleDateRangeChange,
               showLabel: false
             }
           ),
@@ -72745,7 +72805,7 @@ var PlantHeadView = () => {
             "button",
             {
               ref: mobileFilterButtonRef,
-              onClick: () => setIsFilterOpen(!isFilterOpen),
+              onClick: handleFilterToggle,
               className: `p-2 rounded-full transition-colors relative ${isFilterOpen || trendMode !== "all" ? "bg-blue-50" : "active:bg-gray-100"}`,
               "aria-label": "Open filters",
               children: [
@@ -72773,7 +72833,7 @@ var PlantHeadView = () => {
               year: parseDateKeyToDate(dateRange.startKey).getFullYear(),
               timezone: appTimezone,
               value: dateRange,
-              onChange: setDateRange,
+              onChange: handleDateRangeChange,
               showLabel: false
             }
           ) }),
@@ -72781,7 +72841,7 @@ var PlantHeadView = () => {
             "button",
             {
               ref: filterButtonRef,
-              onClick: () => setIsFilterOpen(!isFilterOpen),
+              onClick: handleFilterToggle,
               className: `flex items-center gap-2 px-3 py-1.5 rounded-lg border text-sm font-medium transition-all shadow-sm ${isFilterOpen || trendMode !== "all" ? "border-blue-500 bg-blue-50 text-blue-700 ring-1 ring-blue-500" : "border-slate-200 bg-white text-slate-700 hover:bg-slate-50"}`,
               "aria-label": "Open filters",
               children: [
@@ -72814,7 +72874,7 @@ var PlantHeadView = () => {
             "select",
             {
               value: trendMode,
-              onChange: (e) => setTrendMode(e.target.value),
+              onChange: handleTrendModeChange,
               className: "w-full appearance-none pl-3 pr-8 py-2 text-sm bg-gray-50 border border-gray-200 hover:border-gray-300 rounded-lg text-gray-900 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:bg-white transition-all cursor-pointer",
               style: { backgroundImage: `url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e")`, backgroundPosition: `right 0.75rem center`, backgroundRepeat: `no-repeat`, backgroundSize: `1.2em 1.2em` },
               children: [
@@ -72876,7 +72936,7 @@ var PlantHeadView = () => {
                     "button",
                     {
                       type: "button",
-                      onClick: () => setPoorestLineMode("output"),
+                      onClick: () => handlePoorestLineModeChange("output"),
                       className: `px-3 py-1 text-[11px] font-bold rounded-md ${poorestLineMode === "output" ? "bg-white text-slate-800 shadow-sm" : "text-slate-500 hover:text-slate-800"}`,
                       children: "Output"
                     }
@@ -72885,7 +72945,7 @@ var PlantHeadView = () => {
                     "button",
                     {
                       type: "button",
-                      onClick: () => setPoorestLineMode("uptime"),
+                      onClick: () => handlePoorestLineModeChange("uptime"),
                       className: `px-3 py-1 text-[11px] font-bold rounded-md ${poorestLineMode === "uptime" ? "bg-white text-slate-800 shadow-sm" : "text-slate-500 hover:text-slate-800"}`,
                       children: "Uptime"
                     }
@@ -72896,7 +72956,10 @@ var PlantHeadView = () => {
                 "button",
                 {
                   type: "button",
-                  onClick: () => navigate("/kpis"),
+                  onClick: () => {
+                    trackCoreEvent("Operations Overview View All Clicked", { section: "poorest_performers" });
+                    navigate("/kpis?tab=leaderboard");
+                  },
                   className: "text-[11px] font-bold text-slate-500 hover:text-slate-800 transition-colors",
                   children: "View All"
                 }
@@ -72912,7 +72975,10 @@ var PlantHeadView = () => {
                 return /* @__PURE__ */ jsx(
                   "div",
                   {
-                    onClick: () => navigate(`/kpis/${line.id}`),
+                    onClick: () => {
+                      trackCoreEvent("Operations Overview Line Clicked", { line_id: line.id, line_name: line.name });
+                      navigate(`/kpis/${line.id}`);
+                    },
                     className: "block py-3 hover:bg-slate-50/50 transition-colors cursor-pointer group relative",
                     children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-4", children: [
                       /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 min-w-0", children: [
@@ -72952,7 +73018,10 @@ var PlantHeadView = () => {
               className: "bg-white rounded-xl shadow-sm border border-slate-100 flex flex-col overflow-hidden text-left",
               children: [
                 /* @__PURE__ */ jsx("div", { className: "px-5 py-4 flex-none flex justify-between items-center border-b border-slate-50/50 relative", children: /* @__PURE__ */ jsx("h2", { className: "text-lg font-semibold text-gray-700", children: "Idle Time Breakdown" }) }),
-                /* @__PURE__ */ jsx("div", { className: "flex-1 min-h-0 p-4 pt-2 relative", children: isIdleReasonBreakdownLoading ? /* @__PURE__ */ jsx(OverviewIdleBreakdownSkeleton, {}) : /* @__PURE__ */ jsx(
+                /* @__PURE__ */ jsx("div", { className: "flex-1 min-h-0 p-4 pt-2 relative", children: isIdleReasonBreakdownLoading ? /* @__PURE__ */ jsx(OverviewIdleBreakdownSkeleton, {}) : showIdleModuleNotEnabledState ? /* @__PURE__ */ jsx("div", { className: "h-full flex items-center justify-center rounded-xl border border-dashed border-slate-200 bg-slate-50/80 px-6 text-center", children: /* @__PURE__ */ jsxs("div", { children: [
+                  /* @__PURE__ */ jsx("p", { className: "text-sm font-semibold text-slate-700", children: "Module not enabled" }),
+                  /* @__PURE__ */ jsx("p", { className: "mt-1 text-xs text-slate-500", children: "Enable idle-time VLM on at least one line to view this breakdown." })
+                ] }) }) : /* @__PURE__ */ jsx(
                   IdleTimeReasonChart,
                   {
                     data: idleBreakdown,
@@ -72981,7 +73050,8 @@ var PlantHeadView = () => {
                     yAxisDomain: [0, 100],
                     showLegend: false,
                     showGrid: true,
-                    fillContainer: true
+                    fillContainer: true,
+                    tooltipLabelFormatter: trendTooltipLabelFormatter
                   },
                   trendPlayKey
                 ) }) })
@@ -72995,7 +73065,10 @@ var PlantHeadView = () => {
                 "button",
                 {
                   type: "button",
-                  onClick: () => navigate("/improvement-center"),
+                  onClick: () => {
+                    trackCoreEvent("Operations Overview View All Clicked", { section: "improvements" });
+                    navigate("/improvement-center");
+                  },
                   className: "text-[11px] font-bold text-slate-500 hover:text-slate-800 transition-colors",
                   children: "View All"
                 }
@@ -73004,7 +73077,10 @@ var PlantHeadView = () => {
             /* @__PURE__ */ jsx("div", { className: "flex-1 p-0 flex flex-col px-5 py-2 justify-start overflow-auto", children: isImprovementsLoading ? /* @__PURE__ */ jsx(OverviewImprovementsSkeleton, {}) : improvements.length > 0 ? improvements.map((item) => /* @__PURE__ */ jsx(
               "div",
               {
-                onClick: () => navigate("/improvement-center"),
+                onClick: () => {
+                  trackCoreEvent("Operations Overview Improvement Clicked", { issue_id: item.id, title: item.title });
+                  navigate("/improvement-center");
+                },
                 className: "flex items-center justify-between py-3 border-b border-slate-50 last:border-0 group cursor-pointer",
                 children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 flex-1 min-w-0 pr-4", children: [
                   /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center flex-shrink-0", children: /* @__PURE__ */ jsx(ArrowUpRight, { className: "w-4 h-4 text-slate-400 group-hover:text-indigo-500 transition-colors" }) }),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@optifye/dashboard-core",
-  "version": "6.11.3",
+  "version": "6.11.4",
   "description": "Reusable UI & logic for Optifye dashboard",
   "main": "dist/index.js",
   "module": "dist/index.mjs",