@buoy-gg/events 2.1.1 → 2.1.3

package/lib/module/components/EventsCopySettingsView.js

@@ -9,7 +9,7 @@
 
 import { useCallback, useEffect, useMemo, useState } from "react";
 import { Text, StyleSheet, ScrollView, View, TouchableOpacity } from "react-native";
-import { DynamicFilterView, macOSColors, FileText, FileCode, Hash, Zap, AlertTriangle, Settings, Eye, ChevronDown, ChevronUp, XCircle, ToolbarCopyButton, useFeatureGate, ProFeatureBanner } from "@buoy-gg/shared-ui";
+import { DynamicFilterView, macOSColors, FileText, FileCode, Hash, Zap, AlertTriangle, Settings, Eye, ChevronDown, ChevronUp, XCircle, GitBranch, ToolbarCopyButton, useFeatureGate, ProFeatureBanner } from "@buoy-gg/shared-ui";
 import { DataViewer } from "@buoy-gg/shared-ui/dataViewer";
 import { DEFAULT_COPY_SETTINGS, COPY_PRESETS, PRESET_METADATA, detectActivePreset } from "../types/copySettings";
 import { generateExport, estimateExportSize, getExportSummary } from "../utils/eventExportFormatter";
@@ -263,14 +263,19 @@ export function EventsCopySettingsView({
         data: JSON.parse(exportText),
         title: "",
         showTypeFilter: false
-      }) : /*#__PURE__*/_jsx(ScrollView, {
-        style: styles.previewScroll,
-        nestedScrollEnabled: true,
-        children: /*#__PURE__*/_jsx(Text, {
-          style: styles.previewText,
-          selectable: isPro,
-          children: exportText
-        })
+      }) : /*#__PURE__*/_jsxs(View, {
+        children: [settings.format === "mermaid" && /*#__PURE__*/_jsx(Text, {
+          style: styles.mermaidHint,
+          children: "\uD83D\uDCA1 Paste into mermaid.live to visualize"
+        }), /*#__PURE__*/_jsx(ScrollView, {
+          style: styles.previewScroll,
+          nestedScrollEnabled: true,
+          children: /*#__PURE__*/_jsx(Text, {
+            style: styles.previewText,
+            selectable: isPro,
+            children: exportText
+          })
+        })]
       })]
     });
   }, [isPreviewExpanded, previewEvents, settings, estimatedSize, sizeWarningLevel, hasLiveData, generateCopyText, isPro]);
@@ -337,6 +342,14 @@ export function EventsCopySettingsView({
         value: "minimal",
         isActive: activePreset === "minimal",
         description: PRESET_METADATA.minimal.description
+      }, {
+        id: "preset::mermaid",
+        label: PRESET_METADATA.mermaid.label,
+        icon: GitBranch,
+        color: PRESET_METADATA.mermaid.color,
+        value: "mermaid",
+        isActive: activePreset === "mermaid",
+        description: PRESET_METADATA.mermaid.description
       }, {
         id: "preset::custom",
         label: "Custom",
@@ -420,6 +433,14 @@ export function EventsCopySettingsView({
         color: macOSColors.text.secondary,
         value: "plaintext",
         isActive: settings.format === "plaintext"
+      }, {
+        id: "format::mermaid",
+        label: "Diagram",
+        icon: GitBranch,
+        color: "#A855F7",
+        value: "mermaid",
+        isActive: settings.format === "mermaid",
+        description: "Mermaid sequence diagram"
       }]
     },
     // Timestamp Section
@@ -621,6 +642,16 @@ const styles = StyleSheet.create({
     color: macOSColors.text.primary,
     lineHeight: 18
   },
+  mermaidHint: {
+    fontSize: 11,
+    color: macOSColors.text.secondary,
+    marginBottom: 8,
+    paddingHorizontal: 8,
+    paddingVertical: 6,
+    backgroundColor: "#A855F7" + "15",
+    borderRadius: 6,
+    overflow: "hidden"
+  },
   statusLabel: {
     fontSize: 11,
     fontWeight: "600",

package/lib/module/components/EventsModal.js

@@ -10,7 +10,7 @@
 import { View, StyleSheet, TouchableOpacity, Text, Alert } from "react-native";
 import { useState, useCallback } from "react";
 import { useRouter } from "expo-router";
-import { JsModal, ModalHeader, buoyColors, Trash2, Power, Copy, devToolsStorageKeys, ToolbarCopyButton, UpgradeModal } from "@buoy-gg/shared-ui";
+import { JsModal, ModalHeader, buoyColors, Trash2, Copy, devToolsStorageKeys, ToolbarCopyButton, UpgradeModal, PowerToggleButton } from "@buoy-gg/shared-ui";
 import { useUnifiedEvents } from "../hooks/useUnifiedEvents";
 import { UnifiedEventFilters } from "./UnifiedEventFilters";
 import { UnifiedEventList } from "./UnifiedEventList";
@@ -143,13 +143,10 @@ export function EventsModal({
             size: 14,
             color: totalCount > 0 ? buoyColors.textMuted : buoyColors.textMuted + "50"
           })
-        }), /*#__PURE__*/_jsx(TouchableOpacity, {
-          onPress: toggleCapturing,
-          style: [styles.headerActionButton, isCapturing ? styles.startButton : styles.stopButton],
-          children: /*#__PURE__*/_jsx(Power, {
-            size: 14,
-            color: isCapturing ? buoyColors.success : buoyColors.error
-          })
+        }), /*#__PURE__*/_jsx(PowerToggleButton, {
+          isEnabled: isCapturing,
+          onToggle: toggleCapturing,
+          accessibilityLabel: "Toggle event capture"
         }), /*#__PURE__*/_jsx(TouchableOpacity, {
           onPress: clearEvents,
           style: [styles.headerActionButton, totalCount === 0 && styles.headerActionButtonDisabled],

package/lib/module/components/UnifiedEventDetail.js

@@ -22,7 +22,8 @@ function tryLoadOptionalDetailComponents() {
   const components = {
     StorageEventDetailContent: null,
     ReduxActionDetailContent: null,
-    NetworkEventDetailView: null
+    NetworkEventDetailView: null,
+    RenderDetailView: null
   };
 
   // Try to load storage detail component
@@ -51,6 +52,15 @@ function tryLoadOptionalDetailComponents() {
   } catch {
     // Optional dependency not installed
   }
+
+  // Try to load render detail component
+  try {
+    // @ts-ignore - Dynamic import that may not exist
+    const highlightUpdates = require("@buoy-gg/highlight-updates");
+    components.RenderDetailView = highlightUpdates.RenderDetailView;
+  } catch {
+    // Optional dependency not installed
+  }
   return components;
 }
 
@@ -96,6 +106,10 @@ const SOURCE_CONFIG = {
   route: {
     label: "Route",
     color: "#06B6D4"
+  },
+  render: {
+    label: "Render",
+    color: "#F472B6"
   }
 };
 
@@ -211,6 +225,23 @@ export const UnifiedEventDetail = /*#__PURE__*/memo(function UnifiedEventDetail(
     });
   }
 
+  // For render events, use the RenderDetailView if available
+  if (event.source === "render" && optionalComponents.RenderDetailView) {
+    const {
+      RenderDetailView
+    } = optionalComponents;
+    const renderData = event.originalEvent;
+    return /*#__PURE__*/_jsx(View, {
+      style: styles.container,
+      children: /*#__PURE__*/_jsx(ScrollView, {
+        style: styles.content,
+        children: /*#__PURE__*/_jsx(RenderDetailView, {
+          render: renderData.render
+        })
+      })
+    });
+  }
+
   // Route events expand in-place in the list, so they shouldn't reach this detail view
   // If they do somehow, fall through to the generic view
 

package/lib/module/components/UnifiedEventFilters.js

@@ -6,6 +6,9 @@
  * Filter bar showing toggleable badges for each available event source.
  * Badges are sorted: enabled first, disabled last.
  * Toggling a badge enables/disables event listening for that source.
+ *
+ * Badge layout (inspired by React Query DevTools):
+ * [subscriber_count] • Label [event_count]
  */
 
 import { View, Text, TouchableOpacity, StyleSheet, ScrollView } from "react-native";
@@ -29,27 +32,45 @@ export const UnifiedEventFilters = /*#__PURE__*/memo(function UnifiedEventFilter
       contentContainerStyle: styles.badgesRow,
       children: availableSources.map(source => {
         const isEnabled = source.enabled !== false;
+        const subscriberCount = source.subscriberCount;
+        const hasSubscriberTracking = subscriberCount !== undefined;
+        const eventCount = source.count || 0;
         return /*#__PURE__*/_jsxs(TouchableOpacity, {
           style: [styles.badge, isEnabled ? {
-            backgroundColor: source.color + "20",
-            borderColor: source.color + "60"
+            backgroundColor: buoyColors.card,
+            borderColor: source.color + "50"
           } : styles.badgeDisabled],
           onPress: () => onToggleSource(source.source),
           activeOpacity: 0.7,
-          children: [/*#__PURE__*/_jsx(View, {
+          children: [hasSubscriberTracking && /*#__PURE__*/_jsx(View, {
+            style: [styles.countBadge, {
+              backgroundColor: isEnabled ? subscriberCount > 0 ? source.color + "25" : buoyColors.textMuted + "20" : buoyColors.textMuted + "15"
+            }],
+            children: /*#__PURE__*/_jsx(Text, {
+              style: [styles.countText, {
+                color: isEnabled ? subscriberCount > 0 ? source.color : buoyColors.textMuted : buoyColors.textMuted + "60"
+              }],
+              children: subscriberCount
+            })
+          }), /*#__PURE__*/_jsx(View, {
             style: [styles.dot, {
-              backgroundColor: isEnabled ? source.color : buoyColors.textMuted + "60"
+              backgroundColor: isEnabled ? source.color : buoyColors.textMuted + "40"
             }]
           }), /*#__PURE__*/_jsx(Text, {
             style: [styles.badgeLabel, {
-              color: isEnabled ? source.color : buoyColors.textMuted + "80"
+              color: isEnabled ? buoyColors.text : buoyColors.textMuted + "70"
             }],
             children: source.label
-          }), isEnabled && source.count > 0 && /*#__PURE__*/_jsx(Text, {
-            style: [styles.badgeCount, {
-              color: source.color
+          }), /*#__PURE__*/_jsx(View, {
+            style: [styles.countBadge, {
+              backgroundColor: isEnabled ? eventCount > 0 ? source.color + "20" : buoyColors.textMuted + "15" : buoyColors.textMuted + "10"
             }],
-            children: source.count
+            children: /*#__PURE__*/_jsx(Text, {
+              style: [styles.countText, {
+                color: isEnabled ? eventCount > 0 ? source.color : buoyColors.textMuted + "80" : buoyColors.textMuted + "50"
+              }],
+              children: eventCount
+            })
           })]
         }, source.source);
       })
@@ -74,30 +95,38 @@ const styles = StyleSheet.create({
   badge: {
     flexDirection: "row",
     alignItems: "center",
-    paddingHorizontal: 10,
-    paddingVertical: 6,
-    borderRadius: 16,
+    paddingVertical: 5,
+    paddingHorizontal: 6,
+    borderRadius: 20,
     borderWidth: 1,
     gap: 6
   },
   badgeDisabled: {
     backgroundColor: buoyColors.card,
     borderColor: buoyColors.border,
-    opacity: 0.6
+    opacity: 0.5
   },
   dot: {
-    width: 6,
-    height: 6,
-    borderRadius: 3
+    width: 7,
+    height: 7,
+    borderRadius: 4
   },
   badgeLabel: {
     fontSize: 12,
-    fontWeight: "600"
+    fontWeight: "500"
   },
-  badgeCount: {
-    fontSize: 11,
-    fontWeight: "500",
-    opacity: 0.8
+  countBadge: {
+    minWidth: 18,
+    height: 18,
+    borderRadius: 9,
+    alignItems: "center",
+    justifyContent: "center",
+    paddingHorizontal: 5
+  },
+  countText: {
+    fontSize: 10,
+    fontWeight: "600",
+    fontVariant: ["tabular-nums"]
   },
   filterInfo: {
     marginTop: 6,

package/lib/module/components/UnifiedEventItem.js

@@ -106,6 +106,10 @@ const SOURCE_CONFIG = {
   route: {
     label: "Route",
     color: "#06B6D4" // Cyan
+  },
+  render: {
+    label: "Render",
+    color: "#F472B6" // Pink
   }
 };
 
@@ -173,7 +177,8 @@ const SOURCE_BADGE_LABELS = {
   "react-query": "QUERY",
   "react-query-query": "QUERY",
   "react-query-mutation": "MUTATION",
-  route: "ROUTE"
+  route: "ROUTE",
+  render: "RENDER"
 };
 
 /**

package/lib/module/hooks/useUnifiedEvents.js

@@ -8,9 +8,9 @@
  */
 
 import { useState, useEffect, useCallback, useMemo, useRef } from "react";
-import { useFeatureGate } from "@buoy-gg/shared-ui";
-import { subscribe, subscribeToStorage, subscribeToRedux, subscribeToNetwork, subscribeToReactQuery, subscribeToRoutes, unsubscribeAll, getSourceCounts, clearEvents as clearStoreEvents, getAvailableEventSources } from "../stores/unifiedEventStore";
-import { saveEnabledSources, loadEnabledSources } from "../utils/badgeSelectionStorage";
+import { useFeatureGate, subscribeToSubscriberCountChanges } from "@buoy-gg/shared-ui";
+import { subscribe, subscribeToStorage, subscribeToRedux, subscribeToNetwork, subscribeToReactQuery, subscribeToRoutes, subscribeToRender, unsubscribeFromStorage, unsubscribeFromRedux, unsubscribeFromNetwork, unsubscribeFromReactQuery, unsubscribeFromRoutes, unsubscribeFromRender, unsubscribeAll, getSourceCounts, clearEvents as clearStoreEvents, getAvailableEventSources, getSubscriberCounts } from "../stores/unifiedEventStore";
+import { saveEnabledSources, loadEnabledSources, saveCapturingState, loadCapturingState } from "../utils/badgeSelectionStorage";
 import { getSourceDisplayConfig } from "../utils/autoDiscoverEventSources";
 
 /** Max events for non-Pro users */
@@ -19,7 +19,7 @@ const FREE_TIER_MAX_EVENTS = 25;
 /**
  * All possible sources for display
  */
-const ALL_DISPLAY_SOURCES = ["storage-async", "redux", "network", "react-query-query", "react-query-mutation", "route"];
+const ALL_DISPLAY_SOURCES = ["storage-async", "redux", "network", "react-query-query", "react-query-mutation", "route", "render"];
 
 /**
  * Map display sources to actual event sources they should match
@@ -32,7 +32,8 @@ const SOURCE_TO_EVENT_SOURCES = {
   "react-query": ["react-query", "react-query-query"],
   "react-query-query": ["react-query", "react-query-query"],
   "react-query-mutation": ["react-query-mutation"],
-  route: ["route"]
+  route: ["route"],
+  render: ["render"]
 };
 
 /**
@@ -46,7 +47,8 @@ const EVENT_SOURCE_TO_DISCOVERY_ID = {
   "react-query": "react-query",
   "react-query-query": "react-query",
   "react-query-mutation": "react-query",
-  route: "route-events"
+  route: "route-events",
+  render: "render"
 };
 export function useUnifiedEvents() {
   const {
@@ -62,6 +64,14 @@ export function useUnifiedEvents() {
     return getAvailableEventSources();
   }, []);
 
+  // Subscribe to subscriber count changes for instant UI updates (TanStack Query pattern)
+  const [subscriberCountVersion, setSubscriberCountVersion] = useState(0);
+  useEffect(() => {
+    return subscribeToSubscriberCountChanges(() => {
+      setSubscriberCountVersion(v => v + 1);
+    });
+  }, []);
+
   // Get available display sources (only show sources for installed packages)
   const availableDisplaySources = useMemo(() => {
     return ALL_DISPLAY_SOURCES.filter(displaySource => {
@@ -71,39 +81,50 @@ export function useUnifiedEvents() {
     });
   }, [discoveredSources]);
 
-  // Subscribe to store changes and start capturing on mount
+  // Subscribe to store changes (always subscribe to get events when they come)
   useEffect(() => {
-    // Subscribe to store updates
     const unsubscribe = subscribe(newEvents => {
       setEvents(newEvents);
     });
-
-    // Start capturing from all available sources
-    // These functions are now safe - they check if the source is available
-    subscribeToStorage();
-    subscribeToRedux();
-    subscribeToNetwork();
-    subscribeToReactQuery();
-    subscribeToRoutes();
     return unsubscribe;
   }, []);
 
-  // Restore saved badge selection state on mount
+  // Restore saved state on mount (badge selection + capturing state)
   useEffect(() => {
     const restoreState = async () => {
+      // Load badge selection
       const savedSources = await loadEnabledSources();
+      let sourcesToEnable;
       if (savedSources && savedSources.length > 0) {
         // Filter to only include valid sources that still exist and are available
         const validSources = savedSources.filter(s => availableDisplaySources.includes(s));
         if (validSources.length > 0) {
-          setEnabledSources(new Set(validSources));
+          sourcesToEnable = new Set(validSources);
         } else {
           // If no saved sources are valid, enable all available sources
-          setEnabledSources(new Set(availableDisplaySources));
+          sourcesToEnable = new Set(availableDisplaySources);
         }
       } else {
         // No saved state - enable all available sources
-        setEnabledSources(new Set(availableDisplaySources));
+        sourcesToEnable = new Set(availableDisplaySources);
+      }
+      setEnabledSources(sourcesToEnable);
+
+      // Load capturing state (default to true if not saved)
+      const savedCapturing = await loadCapturingState();
+      const shouldCapture = savedCapturing !== null ? savedCapturing : true;
+      setIsCapturing(shouldCapture);
+
+      // Start capturing if enabled - only subscribe to enabled sources
+      if (shouldCapture) {
+        if (sourcesToEnable.has("storage-async")) subscribeToStorage();
+        if (sourcesToEnable.has("redux")) subscribeToRedux();
+        if (sourcesToEnable.has("network")) subscribeToNetwork();
+        if (sourcesToEnable.has("react-query-query") || sourcesToEnable.has("react-query-mutation")) {
+          subscribeToReactQuery();
+        }
+        if (sourcesToEnable.has("route")) subscribeToRoutes();
+        if (sourcesToEnable.has("render")) subscribeToRender();
       }
       isStateRestoredRef.current = true;
     };
@@ -118,6 +139,14 @@ export function useUnifiedEvents() {
     saveEnabledSources(Array.from(enabledSources));
   }, [enabledSources]);
 
+  // Persist capturing state whenever it changes (after initial restoration)
+  useEffect(() => {
+    if (!isStateRestoredRef.current) {
+      return;
+    }
+    saveCapturingState(isCapturing);
+  }, [isCapturing]);
+
   // Build set of all event sources that should be shown
   const allowedEventSources = useMemo(() => {
     const allowed = new Set();
@@ -157,15 +186,40 @@ export function useUnifiedEvents() {
   // Get all available sources with counts, sorted: enabled first, disabled last
   const availableSources = useMemo(() => {
     const counts = getSourceCounts();
+    const subscriberCounts = getSubscriberCounts();
+
+    // Build a map from source ID to subscriber count
+    const subscriberCountBySourceId = {};
+    for (const source of subscriberCounts.sources) {
+      subscriberCountBySourceId[source.sourceId] = source.counts.total;
+    }
+
+    // Map display source to store source ID
+    const displaySourceToStoreId = {
+      "storage-async": "storage",
+      "storage-mmkv": "storage",
+      redux: "redux",
+      network: "network",
+      "react-query": "react-query",
+      "react-query-query": "react-query",
+      "react-query-mutation": "react-query",
+      route: "route-events",
+      render: "render"
+    };
     const sources = availableDisplaySources.map(source => {
       const eventSources = SOURCE_TO_EVENT_SOURCES[source] || [source];
       const totalCount = eventSources.reduce((sum, s) => sum + (counts[s] || 0), 0);
       const displayConfig = getSourceDisplayConfig(source);
+      const storeId = displaySourceToStoreId[source];
+      // Only set subscriberCount if the source has subscriber tracking
+      // (undefined means no tracking, vs 0 which means tracked but no subscribers)
+      const subscriberCount = storeId && storeId in subscriberCountBySourceId ? subscriberCountBySourceId[storeId] : undefined;
       return {
         source,
         ...displayConfig,
         count: totalCount,
-        enabled: enabledSources.has(source)
+        enabled: enabledSources.has(source),
+        subscriberCount
       };
     });
 
@@ -175,18 +229,65 @@ export function useUnifiedEvents() {
       if (!a.enabled && b.enabled) return 1;
       return 0;
     });
-  }, [events, enabledSources, availableDisplaySources]);
+  }, [events, enabledSources, availableDisplaySources, subscriberCountVersion]);
   const toggleSource = useCallback(source => {
     setEnabledSources(prev => {
       const next = new Set(prev);
-      if (next.has(source)) {
+      const wasEnabled = next.has(source);
+      if (wasEnabled) {
         next.delete(source);
+        // Unsubscribe from the source
+        switch (source) {
+          case "storage-async":
+            unsubscribeFromStorage();
+            break;
+          case "redux":
+            unsubscribeFromRedux();
+            break;
+          case "network":
+            unsubscribeFromNetwork();
+            break;
+          case "react-query-query":
+          case "react-query-mutation":
+            unsubscribeFromReactQuery();
+            break;
+          case "route":
+            unsubscribeFromRoutes();
+            break;
+          case "render":
+            unsubscribeFromRender();
+            break;
+        }
       } else {
         next.add(source);
+        // Subscribe to the source (only if capturing is active)
+        if (isCapturing) {
+          switch (source) {
+            case "storage-async":
+              subscribeToStorage();
+              break;
+            case "redux":
+              subscribeToRedux();
+              break;
+            case "network":
+              subscribeToNetwork();
+              break;
+            case "react-query-query":
+            case "react-query-mutation":
+              subscribeToReactQuery();
+              break;
+            case "route":
+              subscribeToRoutes();
+              break;
+            case "render":
+              subscribeToRender();
+              break;
+          }
+        }
       }
       return next;
     });
-  }, []);
+  }, [isCapturing]);
   const enableAllSources = useCallback(() => {
     setEnabledSources(new Set(availableDisplaySources));
   }, [availableDisplaySources]);
@@ -194,13 +295,17 @@ export function useUnifiedEvents() {
     clearStoreEvents();
   }, []);
   const startCapturing = useCallback(() => {
-    subscribeToStorage();
-    subscribeToRedux();
-    subscribeToNetwork();
-    subscribeToReactQuery();
-    subscribeToRoutes();
+    // Only subscribe to sources that are enabled
+    if (enabledSources.has("storage-async")) subscribeToStorage();
+    if (enabledSources.has("redux")) subscribeToRedux();
+    if (enabledSources.has("network")) subscribeToNetwork();
+    if (enabledSources.has("react-query-query") || enabledSources.has("react-query-mutation")) {
+      subscribeToReactQuery();
+    }
+    if (enabledSources.has("route")) subscribeToRoutes();
+    if (enabledSources.has("render")) subscribeToRender();
     setIsCapturing(true);
-  }, []);
+  }, [enabledSources]);
   const stopCapturing = useCallback(() => {
     unsubscribeAll();
     setIsCapturing(false);
@@ -212,6 +317,9 @@ export function useUnifiedEvents() {
       startCapturing();
     }
   }, [isCapturing, startCapturing, stopCapturing]);
+
+  // Get subscriber counts (recalculates on every render, but it's a cheap operation)
+  const totalSubscriberCount = getSubscriberCounts().totalSubscribers;
   return {
     events,
     filteredEvents,
@@ -228,7 +336,8 @@ export function useUnifiedEvents() {
     toggleCapturing,
     discoveredSources,
     hiddenEventsCount,
-    isPro
+    isPro,
+    totalSubscriberCount
   };
 }
 //# sourceMappingURL=useUnifiedEvents.js.map

package/lib/module/index.js

@@ -54,7 +54,7 @@ export { findRelatedEvents, hasRelatedEvents, getRelatedEventsCount, buildCorrel
 // =============================================================================
 // EXPORT UTILITIES (For generating formatted exports)
 // =============================================================================
-export { generateExport, generateMarkdownExport, generateJsonExport, generatePlaintextExport, estimateExportSize, getExportSummary, filterEvents } from "./utils/eventExportFormatter";
+export { generateExport, generateMarkdownExport, generateJsonExport, generatePlaintextExport, generateMermaidExport, estimateExportSize, getExportSummary, filterEvents } from "./utils/eventExportFormatter";
 // =============================================================================
 // COPY SETTINGS STORAGE (For persisting export preferences)
 // =============================================================================
@@ -74,4 +74,7 @@ export { loadCopySettings, saveCopySettings, clearCopySettings } from "./utils/c
 // - subscribeToRoutes, unsubscribeFromRoutes (internal subscription)
 // - getEvents, getActiveSources, getSourceCounts (internal store operations)
 // - clearEvents, subscribe, getEventCount (internal store operations)
+
+// Note: For subscriber count notifications, use @buoy-gg/shared-ui:
+// import { notifySubscriberCountChange, subscribeToSubscriberCountChanges } from "@buoy-gg/shared-ui";
 //# sourceMappingURL=index.js.map