@nolag/dash 1.0.0 → 1.2.0

package/dist/react-native.js

@@ -0,0 +1,949 @@
+class EventEmitter {
+    constructor() {
+        this._handlers = new Map();
+    }
+    on(event, handler) {
+        if (!this._handlers.has(event)) {
+            this._handlers.set(event, new Set());
+        }
+        this._handlers.get(event).add(handler);
+        return this;
+    }
+    off(event, handler) {
+        if (handler) {
+            this._handlers.get(event)?.delete(handler);
+        }
+        else {
+            this._handlers.delete(event);
+        }
+        return this;
+    }
+    removeAllListeners() {
+        this._handlers.clear();
+        return this;
+    }
+    emit(event, ...args) {
+        const handlers = this._handlers.get(event);
+        if (!handlers)
+            return;
+        for (const handler of handlers) {
+            try {
+                handler(...args);
+            }
+            catch (e) {
+                console.error(`Error in ${String(event)} handler:`, e);
+            }
+        }
+    }
+    listenerCount(event) {
+        return this._handlers.get(event)?.size ?? 0;
+    }
+}
+
+class MetricStore {
+    constructor(maxPerStream) {
+        this._streams = new Map();
+        this._ids = new Set();
+        this._maxPerStream = maxPerStream;
+    }
+    add(point) {
+        if (this._ids.has(point.id))
+            return false;
+        this._ids.add(point.id);
+        if (!this._streams.has(point.streamId))
+            this._streams.set(point.streamId, []);
+        const points = this._streams.get(point.streamId);
+        points.push(point);
+        if (points.length > 1 && point.timestamp < points[points.length - 2].timestamp) {
+            points.sort((a, b) => a.timestamp - b.timestamp);
+        }
+        while (points.length > this._maxPerStream) {
+            const removed = points.shift();
+            this._ids.delete(removed.id);
+        }
+        return true;
+    }
+    getAll(streamId) {
+        if (streamId)
+            return [...(this._streams.get(streamId) ?? [])];
+        const all = [];
+        for (const points of this._streams.values())
+            all.push(...points);
+        return all.sort((a, b) => a.timestamp - b.timestamp);
+    }
+    getAggregation(streamId, windowMs) {
+        const points = this._streams.get(streamId) ?? [];
+        const now = Date.now();
+        const window = windowMs ?? 60000;
+        const filtered = points.filter(p => p.timestamp >= now - window);
+        if (filtered.length === 0) {
+            return { streamId, min: 0, max: 0, avg: 0, sum: 0, count: 0, last: 0, windowMs: window };
+        }
+        let min = Infinity, max = -Infinity, sum = 0;
+        for (const p of filtered) {
+            if (p.value < min)
+                min = p.value;
+            if (p.value > max)
+                max = p.value;
+            sum += p.value;
+        }
+        return { streamId, min, max, avg: sum / filtered.length, sum, count: filtered.length, last: filtered[filtered.length - 1].value, windowMs: window };
+    }
+    has(id) { return this._ids.has(id); }
+    get size() { return this._ids.size; }
+    clear() {
+        this._streams.clear();
+        this._ids.clear();
+    }
+}
+
+class WidgetManager {
+    constructor() {
+        this._widgets = new Map();
+    }
+    update(widget) {
+        this._widgets.set(widget.widgetId, widget);
+    }
+    get(widgetId) {
+        return this._widgets.get(widgetId);
+    }
+    getAll() {
+        return Array.from(this._widgets.values());
+    }
+    clear() {
+        this._widgets.clear();
+    }
+}
+
+class PresenceManager {
+    constructor(localActorId) {
+        this._users = new Map();
+        this._actorToViewerId = new Map();
+        this._localActorId = localActorId;
+    }
+    addFromPresence(actorTokenId, presence, joinedAt) {
+        if (actorTokenId === this._localActorId)
+            return null;
+        const viewerId = presence.viewerId || this._actorToViewerId.get(actorTokenId) || actorTokenId;
+        const viewer = { viewerId, actorTokenId, username: presence.username, metadata: presence.metadata, joinedAt: joinedAt || Date.now(), isLocal: false };
+        this._users.set(viewerId, viewer);
+        this._actorToViewerId.set(actorTokenId, viewerId);
+        return viewer;
+    }
+    removeByActorId(actorTokenId) {
+        if (actorTokenId === this._localActorId)
+            return null;
+        const viewerId = this._actorToViewerId.get(actorTokenId);
+        if (!viewerId)
+            return null;
+        const viewer = this._users.get(viewerId) || null;
+        this._users.delete(viewerId);
+        this._actorToViewerId.delete(actorTokenId);
+        return viewer;
+    }
+    getAll() { return Array.from(this._users.values()); }
+    get users() { return this._users; }
+    clear() { this._users.clear(); this._actorToViewerId.clear(); }
+}
+
+function generateId() {
+    if (typeof crypto !== 'undefined' && typeof crypto.randomUUID === 'function') {
+        return crypto.randomUUID();
+    }
+    return 'xxxx-xxxx-xxxx-xxxx'.replace(/x/g, () => Math.floor(Math.random() * 16).toString(16));
+}
+function createLogger(prefix, enabled) {
+    if (!enabled) {
+        return (..._args) => { };
+    }
+    return (...args) => { console.log(`[${prefix}]`, ...args); };
+}
+// ============ Filters ============
+/**
+ * Build the filter fragment of an emit options object.
+ *
+ * `filter` wins over `filters`: a publish is routed to exactly one topic, so
+ * honouring both would silently drop one of them.
+ */
+function filterEmitOptions(opts) {
+    if (opts?.filter)
+        return { filter: opts.filter };
+    if (opts?.filters && opts.filters.length > 0)
+        return { filters: opts.filters };
+    return {};
+}
+/**
+ * Merge OR terms into an existing filter set. AND groups (nested arrays) are
+ * preserved as-is — only plain string terms are deduplicated.
+ */
+function mergeFilters(existing, add) {
+    const simple = new Set();
+    const groups = [];
+    for (const f of existing) {
+        if (typeof f === 'string')
+            simple.add(f);
+        else
+            groups.push(f);
+    }
+    for (const v of add)
+        simple.add(v);
+    return [...simple, ...groups];
+}
+/**
+ * Drop OR terms from a filter set. AND groups are left untouched — remove
+ * those by calling `setFilters` with the set you want.
+ */
+function withoutFilters(existing, remove) {
+    const drop = new Set(remove);
+    return existing.filter((f) => typeof f !== 'string' || !drop.has(f));
+}
+// ============ Wrapper registry ============
+// One wrapper instance per (client, appName): two wrappers sharing an app on
+// one connection would collide on topics, presence and the online lobby.
+// Warn (not throw): HMR and tests legitimately construct before disposing.
+const wrapperRegistry = new WeakMap();
+/** Register a wrapper against a client + appName; warns on collision. */
+function registerWrapper(client, appName, wrapperName) {
+    let apps = wrapperRegistry.get(client);
+    if (!apps) {
+        apps = new Map();
+        wrapperRegistry.set(client, apps);
+    }
+    const existing = apps.get(appName);
+    if (existing) {
+        console.warn(`[${wrapperName}] Another wrapper (${existing}) is already attached to this client for app "${appName}". ` +
+            `Use one wrapper per (client, app) — detach the other instance first.`);
+    }
+    apps.set(appName, wrapperName);
+}
+/** Release a wrapper's (client, appName) registration on detach. */
+function releaseWrapper(client, appName) {
+    wrapperRegistry.get(client)?.delete(appName);
+}
+
+const DEFAULT_APP_NAME = 'dash';
+const DEFAULT_MAX_METRIC_POINTS = 1000;
+const DEFAULT_AGGREGATION_WINDOW = 60000; // 1 minute
+const TOPIC_METRICS = 'metrics';
+const TOPIC_WIDGETS = 'widgets';
+const LOBBY_ID = 'online';
+/** Delay before the post-setup lobby presence refetch (catches simultaneous joiners) */
+const LOBBY_REFRESH_DELAY_MS = 2000;
+
+/** Maps the public topic names onto the wire topics. */
+const FILTER_TOPICS = {
+    metrics: TOPIC_METRICS,
+    widgets: TOPIC_WIDGETS,
+};
+class DashboardPanel extends EventEmitter {
+    /** @internal */
+    constructor(name, roomContext, localViewerId, localActorId, options, log, isConnected) {
+        super();
+        // Stored topic handler refs — cleanup removes exactly these, never all
+        // handlers for a topic (the client may be shared with other consumers).
+        this._onMetricsRef = null;
+        this._onWidgetsRef = null;
+        /**
+         * Filter values applied per topic. Mirrors what was actually sent to the
+         * server, including the `__none__` placeholder, so add/remove merge against
+         * the real subscription rather than a cleaner-looking copy of it.
+         */
+        this._filters = { metrics: [], widgets: [] };
+        this.name = name;
+        this._roomContext = roomContext;
+        this._localViewerId = localViewerId;
+        this._options = options;
+        this._log = log;
+        this._isConnected = isConnected;
+        this._presenceManager = new PresenceManager(localActorId);
+        this._metricStore = new MetricStore(options.maxMetricPoints);
+        this._widgetManager = new WidgetManager();
+    }
+    publishMetric(streamId, value, opts) {
+        const point = { id: generateId(), streamId, value, unit: opts?.unit, tags: opts?.tags, timestamp: Date.now(), isReplay: false };
+        this._metricStore.add(point);
+        this._roomContext.emit(TOPIC_METRICS, { id: point.id, streamId, value, unit: point.unit, tags: point.tags, timestamp: point.timestamp }, { echo: false, ...filterEmitOptions(opts) });
+        return point;
+    }
+    // ============ Filters ============
+    /** The filter values currently applied to this panel, by topic. */
+    get filters() {
+        return { metrics: [...this._filters.metrics], widgets: [...this._filters.widgets] };
+    }
+    /**
+     * Replace this panel's filters — only data published with one of these
+     * values is delivered. Applies to metrics and widgets unless you scope the
+     * call to one with `{ topic }`.
+     *
+     * Passing an empty array clears filtering and restores the wildcard
+     * subscription, which receives everything.
+     *
+     * @example
+     * ```ts
+     * panel.setFilters(['cpu', 'mem']);                  // both topics
+     * panel.setFilters(['cpu'], { topic: 'metrics' });   // metrics only
+     * panel.setFilters([['cpu', 'prod']]);               // cpu AND prod
+     * panel.setFilters([]);                               // everything
+     * ```
+     */
+    setFilters(values, opts) {
+        for (const topic of this._targetTopics(opts)) {
+            this._filters[topic] = [...values];
+            // The core types filters as `string[]`, but both its implementation and
+            // the wire protocol accept AND groups (nested arrays).
+            this._roomContext.setFilters(FILTER_TOPICS[topic], values);
+        }
+    }
+    /** Add filter values to the existing set. Existing AND groups are kept. */
+    addFilters(values, opts) {
+        for (const topic of this._targetTopics(opts)) {
+            this.setFilters(mergeFilters(this._filters[topic], values), { topic });
+        }
+    }
+    /**
+     * Remove filter values from the existing set. Removing the last value
+     * restores the wildcard subscription.
+     */
+    removeFilters(values, opts) {
+        for (const topic of this._targetTopics(opts)) {
+            this.setFilters(withoutFilters(this._filters[topic], values), { topic });
+        }
+    }
+    _targetTopics(opts) {
+        return opts?.topic ? [opts.topic] : ['metrics', 'widgets'];
+    }
+    /** Replace all metric filters — alias for `setFilters(values, { topic: 'metrics' })`. */
+    setMetricFilters(filters) {
+        this.setFilters(filters, { topic: 'metrics' });
+    }
+    /** Add filter values to the existing metric filter set. */
+    addMetricFilters(filters) {
+        this.addFilters(filters, { topic: 'metrics' });
+    }
+    /** Remove specific filter values from the metric filter set. */
+    removeMetricFilters(filters) {
+        this.removeFilters(filters, { topic: 'metrics' });
+    }
+    publishWidget(widgetId, type, data, label, opts) {
+        const update = { id: generateId(), widgetId, type, data, label, timestamp: Date.now(), isReplay: false };
+        this._widgetManager.update(update);
+        this._roomContext.emit(TOPIC_WIDGETS, { id: update.id, widgetId, type, data, label, timestamp: update.timestamp }, { echo: false, ...filterEmitOptions(opts) });
+        return update;
+    }
+    getMetrics(streamId) { return this._metricStore.getAll(streamId); }
+    getAggregation(streamId, windowMs) { return this._metricStore.getAggregation(streamId, windowMs); }
+    getWidget(widgetId) { return this._widgetManager.get(widgetId); }
+    getWidgets() { return this._widgetManager.getAll(); }
+    getViewers() { return this._presenceManager.getAll(); }
+    _subscribe(metricFilters, filters) {
+        if (filters && filters.length > 0) {
+            // Uniform filter API: applies to both content topics, and an empty array
+            // means "everything" (the wildcard), matching the other blueprint SDKs.
+            this._filters = { metrics: [...filters], widgets: [...filters] };
+            this._roomContext.subscribe(TOPIC_METRICS, { filters });
+            this._roomContext.subscribe(TOPIC_WIDGETS, { filters });
+            this._attachHandlers();
+            return;
+        }
+        if (metricFilters !== undefined) {
+            // Legacy `metricFilters` path. If empty array, use a no-match placeholder
+            // to avoid wildcard subscription (which receives everything).
+            const resolved = metricFilters.length > 0 ? metricFilters : ['__none__'];
+            this._filters.metrics = [...resolved];
+            this._roomContext.subscribe(TOPIC_METRICS, { filters: resolved });
+        }
+        else {
+            this._roomContext.subscribe(TOPIC_METRICS);
+        }
+        this._roomContext.subscribe(TOPIC_WIDGETS);
+        this._attachHandlers();
+    }
+    /** @internal Attach the metric and widget listeners. */
+    _attachHandlers() {
+        // Listen for metrics (refs stored for handler-specific removal)
+        this._onMetricsRef = (data, meta) => {
+            const raw = data;
+            const point = { id: raw.id, streamId: raw.streamId, value: raw.value, unit: raw.unit, tags: raw.tags, timestamp: raw.timestamp, isReplay: meta.isReplay ?? false };
+            if (this._metricStore.add(point))
+                this.emit('metric', point);
+        };
+        this._roomContext.on(TOPIC_METRICS, this._onMetricsRef);
+        // Listen for widget updates
+        this._onWidgetsRef = (data, meta) => {
+            const raw = data;
+            const update = { id: raw.id, widgetId: raw.widgetId, type: raw.type, data: raw.data, label: raw.label, timestamp: raw.timestamp, isReplay: meta.isReplay ?? false };
+            this._widgetManager.update(update);
+            this.emit('widgetUpdate', update);
+        };
+        this._roomContext.on(TOPIC_WIDGETS, this._onWidgetsRef);
+    }
+    _activate() {
+        this._setPresence();
+        this._roomContext.fetchPresence().then((actors) => {
+            for (const actor of actors) {
+                if (actor.presence) {
+                    const v = this._presenceManager.addFromPresence(actor.actorTokenId, actor.presence, actor.joinedAt);
+                    if (v)
+                        this.emit('viewerJoined', v);
+                }
+            }
+        }).catch(() => { });
+    }
+    _deactivate() { this._presenceManager.clear(); }
+    _handlePresenceJoin(actorTokenId, pd) { const v = this._presenceManager.addFromPresence(actorTokenId, pd); if (v)
+        this.emit('viewerJoined', v); }
+    _handlePresenceLeave(actorTokenId) { const v = this._presenceManager.removeByActorId(actorTokenId); if (v)
+        this.emit('viewerLeft', v); }
+    _handlePresenceUpdate(actorTokenId, pd) { this._presenceManager.addFromPresence(actorTokenId, pd); }
+    _handleReplayStart(count) { this.emit('replayStart', { count }); }
+    _handleReplayEnd(replayed) { this.emit('replayEnd', { replayed }); }
+    _updateLocalPresence() { this._setPresence(); }
+    _cleanup() {
+        this._log('Panel cleanup:', this.name);
+        // Server unsubscribes need a live socket; skip when disconnected
+        // (best-effort — the core would no-op with an error callback anyway).
+        if (this._isConnected()) {
+            this._roomContext.unsubscribe(TOPIC_METRICS);
+            this._roomContext.unsubscribe(TOPIC_WIDGETS);
+        }
+        // Handler-specific removal only: the client may be shared, and a bare
+        // off(topic) would strip other consumers' handlers too.
+        if (this._onMetricsRef)
+            this._roomContext.off(TOPIC_METRICS, this._onMetricsRef);
+        if (this._onWidgetsRef)
+            this._roomContext.off(TOPIC_WIDGETS, this._onWidgetsRef);
+        this._onMetricsRef = null;
+        this._onWidgetsRef = null;
+        this._metricStore.clear();
+        this._widgetManager.clear();
+        this._presenceManager.clear();
+        this.removeAllListeners();
+    }
+    _setPresence() {
+        this._roomContext.setPresence({
+            viewerId: this._localViewerId,
+            username: this._options.username,
+            metadata: this._options.metadata,
+            // Scope tag: on a shared client, other apps' wrappers filter our
+            // presence out by this (and we filter theirs).
+            __scope: this._options.appName,
+        });
+    }
+}
+
+/**
+ * NoLagDash — high-level live dashboard SDK built on @nolag/js-sdk.
+ *
+ * Provides multi-panel dashboards, real-time metric streams with
+ * aggregation, widget updates, viewer presence, and replay — all
+ * framework-agnostic via events.
+ *
+ * The wrapper NEVER manages the connection. The app owns one core NoLag
+ * client (shared by any number of wrappers on distinct apps) and the
+ * wrapper attaches to it at construction and releases it via `detach()`.
+ *
+ * @example
+ * ```typescript
+ * import { NoLag } from '@nolag/js-sdk';
+ * import { NoLagDash } from '@nolag/dash';
+ *
+ * const client = NoLag(async () => (await (await fetch('/api/nolag-token')).json()).token);
+ * const dash = new NoLagDash({ client, appName: 'my-dash', username: 'Alice' });
+ *
+ * dash.on('viewerOnline', (v) => console.log(v.username, 'is watching'));
+ *
+ * await client.connect();   // the app owns the connection
+ * await dash.ready();       // wrapper setup done (identity, lobby, panels)
+ *
+ * const panel = dash.joinPanel('overview');
+ * panel.on('metric', (m) => console.log(m.streamId, m.value));
+ * panel.publishMetric('cpu', 75);
+ *
+ * dash.detach();            // wrapper releases its handlers and topics
+ * client.disconnect();      // the app closes the socket
+ * ```
+ */
+class NoLagDash extends EventEmitter {
+    constructor(options) {
+        super();
+        this._localViewer = null;
+        this._panels = new Map();
+        this._lobby = null;
+        this._onlineViewers = new Map();
+        this._actorToViewerId = new Map();
+        // Lifecycle: one setup run per connection epoch; detach is terminal.
+        this._epoch = 0;
+        this._detached = false;
+        this._isReady = false;
+        this._lobbyRefreshTimer = null;
+        // Stored client handler refs. INVARIANT: every client.on() below has a
+        // matching client.off() in detach() — never bare off(event), never inline
+        // closures on the client.
+        this._onConnectRef = () => this._onConnect();
+        this._onDisconnectRef = (reason) => {
+            this._log('Disconnected:', reason);
+            this.emit('disconnected', reason);
+        };
+        this._onReconnectRef = () => {
+            this._log('Reconnecting...');
+            this.emit('reconnecting');
+        };
+        this._onErrorRef = (error) => {
+            this._log('Error:', error);
+            this.emit('error', error);
+        };
+        this._onReplayStartRef = (data) => {
+            const event = data;
+            for (const panel of this._panels.values()) {
+                panel._handleReplayStart(event.count);
+            }
+        };
+        this._onReplayEndRef = (data) => {
+            const event = data;
+            for (const panel of this._panels.values()) {
+                panel._handleReplayEnd(event.replayed);
+            }
+        };
+        this._onPresenceJoinRef = (data) => this._handlePresenceJoin(data);
+        this._onPresenceLeaveRef = (data) => this._handlePresenceLeave(data);
+        this._onPresenceUpdateRef = (data) => this._handlePresenceUpdate(data);
+        this._onLobbyJoinRef = (data) => this._handleLobbyJoin(data);
+        this._onLobbyLeaveRef = (data) => this._handleLobbyLeave(data);
+        this._onLobbyUpdateRef = (data) => this._handleLobbyUpdate(data);
+        if (!options?.client) {
+            throw new TypeError('NoLagDash requires an injected NoLag client: new NoLagDash({ client, appName, ... })');
+        }
+        this._client = options.client;
+        this._viewerId = generateId();
+        this._options = {
+            username: options.username,
+            metadata: options.metadata,
+            appName: options.appName ?? DEFAULT_APP_NAME,
+            maxMetricPoints: options.maxMetricPoints ?? DEFAULT_MAX_METRIC_POINTS,
+            aggregationWindow: options.aggregationWindow ?? DEFAULT_AGGREGATION_WINDOW,
+            debug: options.debug ?? false,
+            panels: options.panels ?? [],
+        };
+        this._log = createLogger('NoLagDash', this._options.debug);
+        this._readyPromise = new Promise((resolve, reject) => {
+            this._readyResolve = resolve;
+            this._readyReject = reject;
+        });
+        // ready() rejection is only meaningful to callers that await it
+        this._readyPromise.catch(() => { });
+        registerWrapper(this._client, this._options.appName, 'NoLagDash');
+        // Construction = attach: wire everything now, with stored refs.
+        this._client.on('connect', this._onConnectRef);
+        this._client.on('disconnect', this._onDisconnectRef);
+        this._client.on('reconnect', this._onReconnectRef);
+        this._client.on('error', this._onErrorRef);
+        this._client.on('replay:start', this._onReplayStartRef);
+        this._client.on('replay:end', this._onReplayEndRef);
+        this._client.on('presence:join', this._onPresenceJoinRef);
+        this._client.on('presence:leave', this._onPresenceLeaveRef);
+        this._client.on('presence:update', this._onPresenceUpdateRef);
+        this._client.on('lobbyPresence:join', this._onLobbyJoinRef);
+        this._client.on('lobbyPresence:leave', this._onLobbyLeaveRef);
+        this._client.on('lobbyPresence:update', this._onLobbyUpdateRef);
+        // Attach-to-connected: if the client is already authenticated, run setup.
+        // The microtask lets the caller wire wrapper event handlers synchronously
+        // first; a racing real 'connect' event wins via the epoch guard.
+        queueMicrotask(() => {
+            if (this._epoch === 0 && !this._detached && this._client.connected) {
+                this._onConnect();
+            }
+        });
+    }
+    // ============ Public Properties ============
+    /** Whether the underlying connection is established (connected ≠ ready) */
+    get connected() {
+        return !this._detached && this._client.connected;
+    }
+    /** The injected core client (owned by the app, not the wrapper) */
+    get client() {
+        return this._client;
+    }
+    /** The local viewer's info (available after ready) */
+    get localViewer() {
+        return this._localViewer;
+    }
+    /** All currently joined panels */
+    get panels() {
+        return this._panels;
+    }
+    // ============ Lifecycle ============
+    /**
+     * Resolves once the wrapper's first setup completed (identity, lobby and
+     * configured panels ready — equivalently, once 'connected' has fired).
+     * Rejects only if detach() is called before that. Client auth failures
+     * surface via the app's own `await client.connect()`, not here.
+     */
+    ready() {
+        return this._readyPromise;
+    }
+    /**
+     * Detach from the client: remove every handler this wrapper added,
+     * unsubscribe its topics and lobby (when connected), clear state.
+     * Terminal and idempotent; never touches the socket. To use dash again,
+     * construct a new instance.
+     */
+    detach() {
+        if (this._detached)
+            return;
+        this._log('Detaching...');
+        this._detached = true;
+        this._epoch++; // aborts any in-flight setup at its next checkpoint
+        if (this._lobbyRefreshTimer) {
+            clearTimeout(this._lobbyRefreshTimer);
+            this._lobbyRefreshTimer = null;
+        }
+        // Remove all client handlers by stored ref
+        this._client.off('connect', this._onConnectRef);
+        this._client.off('disconnect', this._onDisconnectRef);
+        this._client.off('reconnect', this._onReconnectRef);
+        this._client.off('error', this._onErrorRef);
+        this._client.off('replay:start', this._onReplayStartRef);
+        this._client.off('replay:end', this._onReplayEndRef);
+        this._client.off('presence:join', this._onPresenceJoinRef);
+        this._client.off('presence:leave', this._onPresenceLeaveRef);
+        this._client.off('presence:update', this._onPresenceUpdateRef);
+        this._client.off('lobbyPresence:join', this._onLobbyJoinRef);
+        this._client.off('lobbyPresence:leave', this._onLobbyLeaveRef);
+        this._client.off('lobbyPresence:update', this._onLobbyUpdateRef);
+        // Panels: handler-specific off + connected-gated server unsubscribe
+        for (const name of [...this._panels.keys()]) {
+            this._panels.get(name)._cleanup();
+            this._panels.delete(name);
+        }
+        // Lobby: server unsubscribe is best-effort and needs a live socket
+        if (this._lobby && this._client.connected) {
+            try {
+                this._lobby.unsubscribe();
+            }
+            catch {
+                /* best-effort */
+            }
+        }
+        this._lobby = null;
+        this._onlineViewers.clear();
+        this._actorToViewerId.clear();
+        this._localViewer = null;
+        releaseWrapper(this._client, this._options.appName);
+        if (!this._isReady) {
+            this._readyReject(new Error('NoLagDash detached before ready'));
+        }
+    }
+    // ============ Private: Epoch Setup ============
+    _onConnect() {
+        this._epoch++;
+        void this._runSetup(this._epoch);
+    }
+    /**
+     * One setup pass per connection epoch. Serves both initial setup (epoch 1)
+     * and reconnect restore (epoch > 1). Aborts silently whenever a newer
+     * epoch started or the wrapper detached — checked after every await.
+     */
+    async _runSetup(epoch) {
+        const stale = () => epoch !== this._epoch || this._detached;
+        this._log(this._isReady ? 'Restoring after reconnect...' : 'Setting up...');
+        // Identity (client.actorId is guaranteed post-auth)
+        if (!this._localViewer) {
+            this._localViewer = {
+                viewerId: this._viewerId,
+                actorTokenId: this._client.actorId,
+                username: this._options.username,
+                metadata: this._options.metadata,
+                joinedAt: Date.now(),
+                isLocal: true,
+            };
+            this._log('Local viewer:', this._localViewer.viewerId, '→', this._localViewer.actorTokenId);
+        }
+        else {
+            this._localViewer.actorTokenId = this._client.actorId;
+        }
+        // Lobby: subscribe every epoch (idempotent server-side) and diff-hydrate
+        // from the returned snapshot — one path for setup and restore.
+        if (!this._lobby) {
+            this._lobby = this._client.setApp(this._options.appName).setLobby(LOBBY_ID);
+        }
+        try {
+            const state = await this._lobby.subscribe();
+            if (stale())
+                return;
+            this._diffHydrateOnlineViewers(state);
+            this._log('Lobby subscribed, online viewers:', this._onlineViewers.size);
+        }
+        catch (err) {
+            if (stale())
+                return;
+            this._log('Lobby subscription failed:', err);
+        }
+        if (!this._isReady) {
+            // First successful setup: pre-subscribe configured panels
+            for (const panelName of this._options.panels) {
+                this._subscribePanelInternal(panelName);
+            }
+        }
+        else {
+            // Server auto-restored topic subscriptions; only panel-scoped presence
+            // needs re-applying (the core does not restore it).
+            for (const panel of this._panels.values()) {
+                panel._updateLocalPresence();
+            }
+        }
+        if (stale())
+            return;
+        // Ready keys on the first setup that COMPLETES, not on epoch 1: an
+        // epoch aborted by a racing reconnect must not strand ready().
+        if (!this._isReady) {
+            this._isReady = true;
+            this._readyResolve();
+            this.emit('connected');
+        }
+        else {
+            this.emit('reconnected');
+        }
+        // Deferred lobby refetch: catches viewers who joined during the setup
+        // window (e.g. simultaneous multi-tab connects).
+        this._scheduleLobbyRefresh(epoch);
+    }
+    _scheduleLobbyRefresh(epoch) {
+        if (this._lobbyRefreshTimer)
+            clearTimeout(this._lobbyRefreshTimer);
+        this._lobbyRefreshTimer = setTimeout(() => {
+            this._lobbyRefreshTimer = null;
+            if (epoch !== this._epoch || this._detached || !this._client.connected || !this._lobby) {
+                return;
+            }
+            this._lobby
+                .fetchPresence()
+                .then((state) => {
+                if (epoch !== this._epoch || this._detached)
+                    return;
+                this._diffHydrateOnlineViewers(state);
+            })
+                .catch(() => {
+                /* best-effort */
+            });
+        }, LOBBY_REFRESH_DELAY_MS);
+    }
+    // ============ Panel Management ============
+    /**
+     * Join a dashboard panel. If the panel was pre-subscribed via the `panels`
+     * option, activates it. Otherwise creates, subscribes, and activates it.
+     */
+    joinPanel(name, opts) {
+        this._assertUsable();
+        let panel = this._panels.get(name);
+        if (!panel) {
+            panel = this._subscribePanelInternal(name, opts?.metricFilters, opts?.filters);
+        }
+        else if (opts?.filters) {
+            // Already subscribed — re-point its filters rather than ignoring them.
+            panel.setFilters(opts.filters);
+        }
+        panel._activate();
+        return panel;
+    }
+    /**
+     * Leave a dashboard panel. Fully unsubscribes and removes it.
+     */
+    leavePanel(name) {
+        const panel = this._panels.get(name);
+        if (!panel)
+            return;
+        this._log('Leaving panel:', name);
+        panel._cleanup();
+        this._panels.delete(name);
+    }
+    /**
+     * Get all joined panels.
+     */
+    getPanels() {
+        return Array.from(this._panels.values());
+    }
+    // ============ Global Presence ============
+    /**
+     * Get all viewers currently online across all panels.
+     */
+    getOnlineViewers() {
+        return Array.from(this._onlineViewers.values());
+    }
+    // ============ Private: Guards ============
+    _assertUsable() {
+        if (this._detached) {
+            throw new Error('NoLagDash has been detached — construct a new instance');
+        }
+        if (!this._isReady || !this._localViewer) {
+            throw new Error('NoLagDash not ready — await ready() or the "connected" event');
+        }
+    }
+    // ============ Private: Panel Setup ============
+    _subscribePanelInternal(name, metricFilters, filters) {
+        this._log('Subscribing panel:', name);
+        const roomContext = this._client.setApp(this._options.appName).setRoom(name);
+        const panel = new DashboardPanel(name, roomContext, this._viewerId, this._client.actorId, this._options, createLogger(`DashPanel:${name}`, this._options.debug), () => this._client.connected);
+        this._panels.set(name, panel);
+        panel._subscribe(metricFilters, filters);
+        return panel;
+    }
+    // ============ Private: Scope Filtering ============
+    /**
+     * On a shared client, presence events from other apps' wrappers arrive on
+     * the same connection-level events. Wrappers stamp their presence with a
+     * `__scope` (their appName); a mismatched tag means another app's data.
+     * Untagged presence is accepted (older peers in this same app).
+     */
+    _foreignScope(data) {
+        const scope = data?.__scope;
+        return typeof scope === 'string' && scope !== this._options.appName;
+    }
+    // ============ Private: Room Presence → Panels ============
+    _handlePresenceJoin(data) {
+        if (data.actorTokenId === this._localViewer?.actorTokenId)
+            return;
+        const pd = data.presence;
+        if (!pd?.viewerId || this._foreignScope(pd))
+            return;
+        const viewer = this._toViewer(data.actorTokenId, pd);
+        this._actorToViewerId.set(data.actorTokenId, viewer.viewerId);
+        if (!this._onlineViewers.has(viewer.viewerId)) {
+            this._onlineViewers.set(viewer.viewerId, viewer);
+            this.emit('viewerOnline', viewer);
+        }
+        for (const panel of this._panels.values()) {
+            panel._handlePresenceJoin(data.actorTokenId, pd);
+        }
+    }
+    _handlePresenceLeave(data) {
+        if (data.actorTokenId === this._localViewer?.actorTokenId)
+            return;
+        // Panel leave ≠ offline — viewer may still be on another panel.
+        // Lobby leave handles actual offline status.
+        for (const panel of this._panels.values()) {
+            panel._handlePresenceLeave(data.actorTokenId);
+        }
+    }
+    _handlePresenceUpdate(data) {
+        if (data.actorTokenId === this._localViewer?.actorTokenId)
+            return;
+        const pd = data.presence;
+        if (!pd?.viewerId || this._foreignScope(pd))
+            return;
+        for (const panel of this._panels.values()) {
+            panel._handlePresenceUpdate(data.actorTokenId, pd);
+        }
+    }
+    // ============ Private: Lobby ============
+    _handleLobbyJoin(event) {
+        const { actorId, data } = event;
+        if (actorId === this._localViewer?.actorTokenId)
+            return;
+        const pd = data;
+        if (!pd?.viewerId || this._foreignScope(pd))
+            return;
+        const viewer = this._toViewer(actorId, pd);
+        this._actorToViewerId.set(actorId, viewer.viewerId);
+        if (!this._onlineViewers.has(viewer.viewerId)) {
+            this._onlineViewers.set(viewer.viewerId, viewer);
+            this.emit('viewerOnline', viewer);
+        }
+    }
+    _handleLobbyLeave(event) {
+        const { actorId, data } = event;
+        if (actorId === this._localViewer?.actorTokenId)
+            return;
+        const pd = data;
+        if (this._foreignScope(pd))
+            return;
+        const viewerId = pd?.viewerId
+            || this._actorToViewerId.get(actorId)
+            || this._findViewerIdByActorId(actorId);
+        if (viewerId) {
+            const viewer = this._onlineViewers.get(viewerId);
+            if (viewer) {
+                this._onlineViewers.delete(viewerId);
+                this._actorToViewerId.delete(actorId);
+                this.emit('viewerOffline', viewer);
+            }
+        }
+    }
+    _handleLobbyUpdate(event) {
+        const { actorId, data } = event;
+        if (actorId === this._localViewer?.actorTokenId)
+            return;
+        const pd = data;
+        if (!pd?.viewerId || this._foreignScope(pd))
+            return;
+        const viewer = this._toViewer(actorId, pd);
+        this._onlineViewers.set(viewer.viewerId, viewer);
+    }
+    /**
+     * Reconcile the online-viewer map against a fresh lobby snapshot, emitting
+     * only the deltas (viewerOffline for vanished, viewerOnline for new). One
+     * path for initial hydration, reconnect restore, and the deferred refetch.
+     */
+    _diffHydrateOnlineViewers(state) {
+        // Build the fresh viewer set from the snapshot
+        const fresh = new Map();
+        const freshActors = new Map();
+        for (const roomId of Object.keys(state)) {
+            const roomPresence = state[roomId];
+            for (const actorId of Object.keys(roomPresence)) {
+                if (actorId === this._localViewer?.actorTokenId)
+                    continue;
+                const raw = roomPresence[actorId];
+                // Server returns full actor records with presence nested under .presence
+                const pd = (raw?.presence ?? raw);
+                if (pd?.viewerId && !this._foreignScope(pd)) {
+                    if (!fresh.has(pd.viewerId)) {
+                        fresh.set(pd.viewerId, this._toViewer(actorId, pd));
+                    }
+                    freshActors.set(actorId, pd.viewerId);
+                }
+            }
+        }
+        // Vanished viewers
+        for (const [viewerId, viewer] of [...this._onlineViewers]) {
+            if (!fresh.has(viewerId)) {
+                this._onlineViewers.delete(viewerId);
+                for (const [actorId, mappedViewerId] of [...this._actorToViewerId]) {
+                    if (mappedViewerId === viewerId)
+                        this._actorToViewerId.delete(actorId);
+                }
+                this.emit('viewerOffline', viewer);
+            }
+        }
+        // New viewers
+        for (const [viewerId, viewer] of fresh) {
+            if (!this._onlineViewers.has(viewerId)) {
+                this._onlineViewers.set(viewerId, viewer);
+                this.emit('viewerOnline', viewer);
+            }
+        }
+        for (const [actorId, viewerId] of freshActors) {
+            this._actorToViewerId.set(actorId, viewerId);
+        }
+    }
+    // ============ Private: Helpers ============
+    _toViewer(actorTokenId, data) {
+        return {
+            viewerId: data.viewerId,
+            actorTokenId,
+            username: data.username,
+            metadata: data.metadata,
+            joinedAt: Date.now(),
+            isLocal: false,
+        };
+    }
+    _findViewerIdByActorId(actorTokenId) {
+        for (const viewer of this._onlineViewers.values()) {
+            if (viewer.actorTokenId === actorTokenId)
+                return viewer.viewerId;
+        }
+        return undefined;
+    }
+}
+
+export { DashboardPanel, EventEmitter, NoLagDash };
+//# sourceMappingURL=react-native.js.map