@supabase/realtime-js 1.3.6 → 1.4.0

package/dist/main/RealtimePresence.d.ts

@@ -0,0 +1,92 @@
+import { PresenceOpts, PresenceOnJoinCallback, PresenceOnLeaveCallback } from 'phoenix';
+import RealtimeSubscription from './RealtimeSubscription';
+declare type Presence = {
+    presence_id: string;
+    [key: string]: any;
+};
+declare type PresenceState = {
+    [key: string]: Presence[];
+};
+declare type PresenceDiff = {
+    joins: PresenceState;
+    leaves: PresenceState;
+};
+declare type RawPresenceState = {
+    [key: string]: Record<'metas', {
+        phx_ref?: string;
+        phx_ref_prev?: string;
+        [key: string]: any;
+    }[]>;
+};
+declare type RawPresenceDiff = {
+    joins: RawPresenceState;
+    leaves: RawPresenceState;
+};
+declare type PresenceChooser<T> = (key: string, presences: any) => T;
+export default class RealtimePresence {
+    channel: RealtimeSubscription;
+    state: PresenceState;
+    pendingDiffs: RawPresenceDiff[];
+    joinRef: string | null;
+    caller: {
+        onJoin: PresenceOnJoinCallback;
+        onLeave: PresenceOnLeaveCallback;
+        onSync: () => void;
+    };
+    /**
+     * Initializes the Presence
+     * @param channel - The RealtimeSubscription
+     * @param opts - The options,
+     *        for example `{events: {state: 'state', diff: 'diff'}}`
+     */
+    constructor(channel: RealtimeSubscription, opts?: PresenceOpts);
+    /**
+     * Used to sync the list of presences on the server
+     * with the client's state. An optional `onJoin` and `onLeave` callback can
+     * be provided to react to changes in the client's local presences across
+     * disconnects and reconnects with the server.
+     */
+    static syncState(currentState: PresenceState, newState: RawPresenceState | PresenceState, onJoin: PresenceOnJoinCallback, onLeave: PresenceOnLeaveCallback): PresenceState;
+    /**
+     *
+     * Used to sync a diff of presence join and leave
+     * events from the server, as they happen. Like `syncState`, `syncDiff`
+     * accepts optional `onJoin` and `onLeave` callbacks to react to a user
+     * joining or leaving from a device.
+     */
+    static syncDiff(state: PresenceState, diff: RawPresenceDiff | PresenceDiff, onJoin: PresenceOnJoinCallback, onLeave: PresenceOnLeaveCallback): PresenceState;
+    /**
+     * Returns the array of presences, with selected metadata.
+     */
+    static list<T = any>(presences: PresenceState, chooser: PresenceChooser<T> | undefined): T[];
+    private static map;
+    /**
+     * Remove 'metas' key
+     * Change 'phx_ref' to 'presence_id'
+     * Remove 'phx_ref' and 'phx_ref_prev'
+     *
+     * @example
+     * // returns {
+     *  abc123: [
+     *    { presence_id: '2', user_id: 1 },
+     *    { presence_id: '3', user_id: 2 }
+     *  ]
+     * }
+     * RealtimePresence.transformState({
+     *  abc123: {
+     *    metas: [
+     *      { phx_ref: '2', phx_ref_prev: '1' user_id: 1 },
+     *      { phx_ref: '3', user_id: 2 }
+     *    ]
+     *  }
+     * })
+     */
+    private static transformState;
+    onJoin(callback: PresenceOnJoinCallback): void;
+    onLeave(callback: PresenceOnLeaveCallback): void;
+    onSync(callback: () => void): void;
+    list<T = any>(by?: PresenceChooser<T>): T[];
+    private inPendingSyncState;
+}
+export {};
+//# sourceMappingURL=RealtimePresence.d.ts.map

package/dist/main/RealtimePresence.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RealtimePresence.d.ts","sourceRoot":"","sources":["../../src/RealtimePresence.ts"],"names":[],"mappings":"AAMA,OAAO,EACL,YAAY,EACZ,sBAAsB,EACtB,uBAAuB,EACxB,MAAM,SAAS,CAAA;AAChB,OAAO,oBAAoB,MAAM,wBAAwB,CAAA;AAEzD,aAAK,QAAQ,GAAG;IACd,WAAW,EAAE,MAAM,CAAA;IACnB,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;CACnB,CAAA;AAED,aAAK,aAAa,GAAG;IAAE,CAAC,GAAG,EAAE,MAAM,GAAG,QAAQ,EAAE,CAAA;CAAE,CAAA;AAElD,aAAK,YAAY,GAAG;IAClB,KAAK,EAAE,aAAa,CAAA;IACpB,MAAM,EAAE,aAAa,CAAA;CACtB,CAAA;AAED,aAAK,gBAAgB,GAAG;IACtB,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CACnB,OAAO,EACP;QACE,OAAO,CAAC,EAAE,MAAM,CAAA;QAChB,YAAY,CAAC,EAAE,MAAM,CAAA;QACrB,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KACnB,EAAE,CACJ,CAAA;CACF,CAAA;AAED,aAAK,eAAe,GAAG;IACrB,KAAK,EAAE,gBAAgB,CAAA;IACvB,MAAM,EAAE,gBAAgB,CAAA;CACzB,CAAA;AAED,aAAK,eAAe,CAAC,CAAC,IAAI,CAAC,GAAG,EAAE,MAAM,EAAE,SAAS,EAAE,GAAG,KAAK,CAAC,CAAA;AAE5D,MAAM,CAAC,OAAO,OAAO,gBAAgB;IAoBhB,OAAO,EAAE,oBAAoB;IAnBhD,KAAK,EAAE,aAAa,CAAK;IACzB,YAAY,EAAE,eAAe,EAAE,CAAK;IACpC,OAAO,EAAE,MAAM,GAAG,IAAI,CAAO;IAC7B,MAAM,EAAE;QACN,MAAM,EAAE,sBAAsB,CAAA;QAC9B,OAAO,EAAE,uBAAuB,CAAA;QAChC,MAAM,EAAE,MAAM,IAAI,CAAA;KACnB,CAIA;IAED;;;;;OAKG;gBACgB,OAAO,EAAE,oBAAoB,EAAE,IAAI,CAAC,EAAE,YAAY;IAkDrE;;;;;OAKG;IACH,MAAM,CAAC,SAAS,CACd,YAAY,EAAE,aAAa,EAC3B,QAAQ,EAAE,gBAAgB,GAAG,aAAa,EAC1C,MAAM,EAAE,sBAAsB,EAC9B,OAAO,EAAE,uBAAuB,GAC/B,aAAa;IA0ChB;;;;;;OAMG;IACH,MAAM,CAAC,QAAQ,CACb,KAAK,EAAE,aAAa,EACpB,IAAI,EAAE,eAAe,GAAG,YAAY,EACpC,MAAM,EAAE,sBAAsB,EAC9B,OAAO,EAAE,uBAAuB,GAC/B,aAAa;IAoDhB;;OAEG;IACH,MAAM,CAAC,IAAI,CAAC,CAAC,GAAG,GAAG,EACjB,SAAS,EAAE,aAAa,EACxB,OAAO,EAAE,eAAe,CAAC,CAAC,CAAC,GAAG,SAAS,GACtC,CAAC,EAAE;IAUN,OAAO,CAAC,MAAM,CAAC,GAAG;IAOlB;;;;;;;;;;;;;;;;;;;;OAoBG;IACH,OAAO,CAAC,MAAM,CAAC,cAAc;IAyB7B,MAAM,CAAC,QAAQ,EAAE,sBAAsB,GAAG,IAAI;IAI9C,OAAO,CAAC,QAAQ,EAAE,uBAAuB,GAAG,IAAI;IAIhD,MAAM,CAAC,QAAQ,EAAE,MAAM,IAAI,GAAG,IAAI;IAIlC,IAAI,CAAC,CAAC,GAAG,GAAG,EAAE,EAAE,CAAC,EAAE,eAAe,CAAC,CAAC,CAAC,GAAG,CAAC,EAAE;IAI3C,OAAO,CAAC,kBAAkB;CAG3B"}

package/dist/main/RealtimePresence.js

@@ -0,0 +1,198 @@
+"use strict";
+/*
+  This file draws heavily from https://github.com/phoenixframework/phoenix/blob/d344ec0a732ab4ee204215b31de69cf4be72e3bf/assets/js/phoenix/presence.js
+  License: https://github.com/phoenixframework/phoenix/blob/d344ec0a732ab4ee204215b31de69cf4be72e3bf/LICENSE.md
+*/
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const lodash_clonedeep_1 = __importDefault(require("lodash.clonedeep"));
+class RealtimePresence {
+    /**
+     * Initializes the Presence
+     * @param channel - The RealtimeSubscription
+     * @param opts - The options,
+     *        for example `{events: {state: 'state', diff: 'diff'}}`
+     */
+    constructor(channel, opts) {
+        this.channel = channel;
+        this.state = {};
+        this.pendingDiffs = [];
+        this.joinRef = null;
+        this.caller = {
+            onJoin: () => { },
+            onLeave: () => { },
+            onSync: () => { },
+        };
+        const events = (opts === null || opts === void 0 ? void 0 : opts.events) || {
+            state: 'presence_state',
+            diff: 'presence_diff',
+        };
+        this.channel.on(events.state, (newState) => {
+            const { onJoin, onLeave, onSync } = this.caller;
+            this.joinRef = this.channel.joinRef();
+            this.state = RealtimePresence.syncState(this.state, newState, onJoin, onLeave);
+            this.pendingDiffs.forEach((diff) => {
+                this.state = RealtimePresence.syncDiff(this.state, diff, onJoin, onLeave);
+            });
+            this.pendingDiffs = [];
+            onSync();
+        });
+        this.channel.on(events.diff, (diff) => {
+            const { onJoin, onLeave, onSync } = this.caller;
+            if (this.inPendingSyncState()) {
+                this.pendingDiffs.push(diff);
+            }
+            else {
+                this.state = RealtimePresence.syncDiff(this.state, diff, onJoin, onLeave);
+                onSync();
+            }
+        });
+    }
+    /**
+     * Used to sync the list of presences on the server
+     * with the client's state. An optional `onJoin` and `onLeave` callback can
+     * be provided to react to changes in the client's local presences across
+     * disconnects and reconnects with the server.
+     */
+    static syncState(currentState, newState, onJoin, onLeave) {
+        const state = lodash_clonedeep_1.default(currentState);
+        const transformedState = this.transformState(newState);
+        const joins = {};
+        const leaves = {};
+        this.map(state, (key, presences) => {
+            if (!transformedState[key]) {
+                leaves[key] = presences;
+            }
+        });
+        this.map(transformedState, (key, newPresences) => {
+            const currentPresences = state[key];
+            if (currentPresences) {
+                const newPresenceIds = newPresences.map((m) => m.presence_id);
+                const curPresenceIds = currentPresences.map((m) => m.presence_id);
+                const joinedPresences = newPresences.filter((m) => curPresenceIds.indexOf(m.presence_id) < 0);
+                const leftPresences = currentPresences.filter((m) => newPresenceIds.indexOf(m.presence_id) < 0);
+                if (joinedPresences.length > 0) {
+                    joins[key] = joinedPresences;
+                }
+                if (leftPresences.length > 0) {
+                    leaves[key] = leftPresences;
+                }
+            }
+            else {
+                joins[key] = newPresences;
+            }
+        });
+        return this.syncDiff(state, { joins, leaves }, onJoin, onLeave);
+    }
+    /**
+     *
+     * Used to sync a diff of presence join and leave
+     * events from the server, as they happen. Like `syncState`, `syncDiff`
+     * accepts optional `onJoin` and `onLeave` callbacks to react to a user
+     * joining or leaving from a device.
+     */
+    static syncDiff(state, diff, onJoin, onLeave) {
+        const { joins, leaves } = {
+            joins: this.transformState(diff.joins),
+            leaves: this.transformState(diff.leaves),
+        };
+        if (!onJoin) {
+            onJoin = () => { };
+        }
+        if (!onLeave) {
+            onLeave = () => { };
+        }
+        this.map(joins, (key, newPresences) => {
+            const currentPresences = state[key];
+            state[key] = lodash_clonedeep_1.default(newPresences);
+            if (currentPresences) {
+                const joinedPresenceIds = state[key].map((m) => m.presence_id);
+                const curPresences = currentPresences.filter((m) => joinedPresenceIds.indexOf(m.presence_id) < 0);
+                state[key].unshift(...curPresences);
+            }
+            onJoin(key, currentPresences, newPresences);
+        });
+        this.map(leaves, (key, leftPresences) => {
+            let currentPresences = state[key];
+            if (!currentPresences)
+                return;
+            const presenceIdsToRemove = leftPresences.map((m) => m.presence_id);
+            currentPresences = currentPresences.filter((m) => presenceIdsToRemove.indexOf(m.presence_id) < 0);
+            state[key] = currentPresences;
+            onLeave(key, currentPresences, leftPresences);
+            if (currentPresences.length === 0)
+                delete state[key];
+        });
+        return state;
+    }
+    /**
+     * Returns the array of presences, with selected metadata.
+     */
+    static list(presences, chooser) {
+        if (!chooser) {
+            chooser = (_key, pres) => pres;
+        }
+        return this.map(presences, (key, presences) => chooser(key, presences));
+    }
+    static map(obj, func) {
+        return Object.getOwnPropertyNames(obj).map((key) => func(key, obj[key]));
+    }
+    /**
+     * Remove 'metas' key
+     * Change 'phx_ref' to 'presence_id'
+     * Remove 'phx_ref' and 'phx_ref_prev'
+     *
+     * @example
+     * // returns {
+     *  abc123: [
+     *    { presence_id: '2', user_id: 1 },
+     *    { presence_id: '3', user_id: 2 }
+     *  ]
+     * }
+     * RealtimePresence.transformState({
+     *  abc123: {
+     *    metas: [
+     *      { phx_ref: '2', phx_ref_prev: '1' user_id: 1 },
+     *      { phx_ref: '3', user_id: 2 }
+     *    ]
+     *  }
+     * })
+     */
+    static transformState(state) {
+        state = lodash_clonedeep_1.default(state);
+        return Object.getOwnPropertyNames(state).reduce((newState, key) => {
+            const presences = state[key];
+            if ('metas' in presences) {
+                newState[key] = presences.metas.map((presence) => {
+                    presence['presence_id'] = presence['phx_ref'];
+                    delete presence['phx_ref'];
+                    delete presence['phx_ref_prev'];
+                    return presence;
+                });
+            }
+            else {
+                newState[key] = presences;
+            }
+            return newState;
+        }, {});
+    }
+    onJoin(callback) {
+        this.caller.onJoin = callback;
+    }
+    onLeave(callback) {
+        this.caller.onLeave = callback;
+    }
+    onSync(callback) {
+        this.caller.onSync = callback;
+    }
+    list(by) {
+        return RealtimePresence.list(this.state, by);
+    }
+    inPendingSyncState() {
+        return !this.joinRef || this.joinRef !== this.channel.joinRef();
+    }
+}
+exports.default = RealtimePresence;
+//# sourceMappingURL=RealtimePresence.js.map

package/dist/main/RealtimePresence.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RealtimePresence.js","sourceRoot":"","sources":["../../src/RealtimePresence.ts"],"names":[],"mappings":";AAAA;;;EAGE;;;;;AAEF,wEAAwC;AAsCxC,MAAqB,gBAAgB;IAcnC;;;;;OAKG;IACH,YAAmB,OAA6B,EAAE,IAAmB;QAAlD,YAAO,GAAP,OAAO,CAAsB;QAnBhD,UAAK,GAAkB,EAAE,CAAA;QACzB,iBAAY,GAAsB,EAAE,CAAA;QACpC,YAAO,GAAkB,IAAI,CAAA;QAC7B,WAAM,GAIF;YACF,MAAM,EAAE,GAAG,EAAE,GAAE,CAAC;YAChB,OAAO,EAAE,GAAG,EAAE,GAAE,CAAC;YACjB,MAAM,EAAE,GAAG,EAAE,GAAE,CAAC;SACjB,CAAA;QASC,MAAM,MAAM,GAAG,CAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,MAAM,KAAI;YAC7B,KAAK,EAAE,gBAAgB;YACvB,IAAI,EAAE,eAAe;SACtB,CAAA;QAED,IAAI,CAAC,OAAO,CAAC,EAAE,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,QAA0B,EAAE,EAAE;YAC3D,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC,MAAM,CAAA;YAE/C,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE,CAAA;YAErC,IAAI,CAAC,KAAK,GAAG,gBAAgB,CAAC,SAAS,CACrC,IAAI,CAAC,KAAK,EACV,QAAQ,EACR,MAAM,EACN,OAAO,CACR,CAAA;YAED,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,EAAE;gBACjC,IAAI,CAAC,KAAK,GAAG,gBAAgB,CAAC,QAAQ,CACpC,IAAI,CAAC,KAAK,EACV,IAAI,EACJ,MAAM,EACN,OAAO,CACR,CAAA;YACH,CAAC,CAAC,CAAA;YAEF,IAAI,CAAC,YAAY,GAAG,EAAE,CAAA;YAEtB,MAAM,EAAE,CAAA;QACV,CAAC,CAAC,CAAA;QAEF,IAAI,CAAC,OAAO,CAAC,EAAE,CAAC,MAAM,CAAC,IAAI,EAAE,CAAC,IAAqB,EAAE,EAAE;YACrD,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC,MAAM,CAAA;YAE/C,IAAI,IAAI,CAAC,kBAAkB,EAAE,EAAE;gBAC7B,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;aAC7B;iBAAM;gBACL,IAAI,CAAC,KAAK,GAAG,gBAAgB,CAAC,QAAQ,CACpC,IAAI,CAAC,KAAK,EACV,IAAI,EACJ,MAAM,EACN,OAAO,CACR,CAAA;gBAED,MAAM,EAAE,CAAA;aACT;QACH,CAAC,CAAC,CAAA;IACJ,CAAC;IAED;;;;;OAKG;IACH,MAAM,CAAC,SAAS,CACd,YAA2B,EAC3B,QAA0C,EAC1C,MAA8B,EAC9B,OAAgC;QAEhC,MAAM,KAAK,GAAG,0BAAS,CAAC,YAAY,CAAC,CAAA;QACrC,MAAM,gBAAgB,GAAG,IAAI,CAAC,cAAc,CAAC,QAAQ,CAAC,CAAA;QACtD,MAAM,KAAK,GAAkB,EAAE,CAAA;QAC/B,MAAM,MAAM,GAAkB,EAAE,CAAA;QAEhC,IAAI,CAAC,GAAG,CAAC,KAAK,EAAE,CAAC,GAAW,EAAE,SAAqB,EAAE,EAAE;YACrD,IAAI,CAAC,gBAAgB,CAAC,GAAG,CAAC,EAAE;gBAC1B,MAAM,CAAC,GAAG,CAAC,GAAG,SAAS,CAAA;aACxB;QACH,CAAC,CAAC,CAAA;QAEF,IAAI,CAAC,GAAG,CAAC,gBAAgB,EAAE,CAAC,GAAG,EAAE,YAAwB,EAAE,EAAE;YAC3D,MAAM,gBAAgB,GAAe,KAAK,CAAC,GAAG,CAAC,CAAA;YAE/C,IAAI,gBAAgB,EAAE;gBACpB,MAAM,cAAc,GAAG,YAAY,CAAC,GAAG,CAAC,CAAC,CAAW,EAAE,EAAE,CAAC,CAAC,CAAC,WAAW,CAAC,CAAA;gBACvE,MAAM,cAAc,GAAG,gBAAgB,CAAC,GAAG,CACzC,CAAC,CAAW,EAAE,EAAE,CAAC,CAAC,CAAC,WAAW,CAC/B,CAAA;gBACD,MAAM,eAAe,GAAe,YAAY,CAAC,MAAM,CACrD,CAAC,CAAW,EAAE,EAAE,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC,WAAW,CAAC,GAAG,CAAC,CAC3D,CAAA;gBACD,MAAM,aAAa,GAAe,gBAAgB,CAAC,MAAM,CACvD,CAAC,CAAW,EAAE,EAAE,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC,WAAW,CAAC,GAAG,CAAC,CAC3D,CAAA;gBAED,IAAI,eAAe,CAAC,MAAM,GAAG,CAAC,EAAE;oBAC9B,KAAK,CAAC,GAAG,CAAC,GAAG,eAAe,CAAA;iBAC7B;gBAED,IAAI,aAAa,CAAC,MAAM,GAAG,CAAC,EAAE;oBAC5B,MAAM,CAAC,GAAG,CAAC,GAAG,aAAa,CAAA;iBAC5B;aACF;iBAAM;gBACL,KAAK,CAAC,GAAG,CAAC,GAAG,YAAY,CAAA;aAC1B;QACH,CAAC,CAAC,CAAA;QAEF,OAAO,IAAI,CAAC,QAAQ,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,MAAM,EAAE,OAAO,CAAC,CAAA;IACjE,CAAC;IAED;;;;;;OAMG;IACH,MAAM,CAAC,QAAQ,CACb,KAAoB,EACpB,IAAoC,EACpC,MAA8B,EAC9B,OAAgC;QAEhC,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG;YACxB,KAAK,EAAE,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,KAAK,CAAC;YACtC,MAAM,EAAE,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,MAAM,CAAC;SACzC,CAAA;QAED,IAAI,CAAC,MAAM,EAAE;YACX,MAAM,GAAG,GAAG,EAAE,GAAE,CAAC,CAAA;SAClB;QAED,IAAI,CAAC,OAAO,EAAE;YACZ,OAAO,GAAG,GAAG,EAAE,GAAE,CAAC,CAAA;SACnB;QAED,IAAI,CAAC,GAAG,CAAC,KAAK,EAAE,CAAC,GAAG,EAAE,YAAwB,EAAE,EAAE;YAChD,MAAM,gBAAgB,GAAe,KAAK,CAAC,GAAG,CAAC,CAAA;YAC/C,KAAK,CAAC,GAAG,CAAC,GAAG,0BAAS,CAAC,YAAY,CAAC,CAAA;YAEpC,IAAI,gBAAgB,EAAE;gBACpB,MAAM,iBAAiB,GAAG,KAAK,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,CAAW,EAAE,EAAE,CAAC,CAAC,CAAC,WAAW,CAAC,CAAA;gBACxE,MAAM,YAAY,GAAe,gBAAgB,CAAC,MAAM,CACtD,CAAC,CAAW,EAAE,EAAE,CAAC,iBAAiB,CAAC,OAAO,CAAC,CAAC,CAAC,WAAW,CAAC,GAAG,CAAC,CAC9D,CAAA;gBAED,KAAK,CAAC,GAAG,CAAC,CAAC,OAAO,CAAC,GAAG,YAAY,CAAC,CAAA;aACpC;YAED,MAAM,CAAC,GAAG,EAAE,gBAAgB,EAAE,YAAY,CAAC,CAAA;QAC7C,CAAC,CAAC,CAAA;QAEF,IAAI,CAAC,GAAG,CAAC,MAAM,EAAE,CAAC,GAAG,EAAE,aAAyB,EAAE,EAAE;YAClD,IAAI,gBAAgB,GAAe,KAAK,CAAC,GAAG,CAAC,CAAA;YAE7C,IAAI,CAAC,gBAAgB;gBAAE,OAAM;YAE7B,MAAM,mBAAmB,GAAG,aAAa,CAAC,GAAG,CAC3C,CAAC,CAAW,EAAE,EAAE,CAAC,CAAC,CAAC,WAAW,CAC/B,CAAA;YACD,gBAAgB,GAAG,gBAAgB,CAAC,MAAM,CACxC,CAAC,CAAW,EAAE,EAAE,CAAC,mBAAmB,CAAC,OAAO,CAAC,CAAC,CAAC,WAAW,CAAC,GAAG,CAAC,CAChE,CAAA;YAED,KAAK,CAAC,GAAG,CAAC,GAAG,gBAAgB,CAAA;YAE7B,OAAO,CAAC,GAAG,EAAE,gBAAgB,EAAE,aAAa,CAAC,CAAA;YAE7C,IAAI,gBAAgB,CAAC,MAAM,KAAK,CAAC;gBAAE,OAAO,KAAK,CAAC,GAAG,CAAC,CAAA;QACtD,CAAC,CAAC,CAAA;QAEF,OAAO,KAAK,CAAA;IACd,CAAC;IAED;;OAEG;IACH,MAAM,CAAC,IAAI,CACT,SAAwB,EACxB,OAAuC;QAEvC,IAAI,CAAC,OAAO,EAAE;YACZ,OAAO,GAAG,CAAC,IAAI,EAAE,IAAI,EAAE,EAAE,CAAC,IAAI,CAAA;SAC/B;QAED,OAAO,IAAI,CAAC,GAAG,CAAC,SAAS,EAAE,CAAC,GAAG,EAAE,SAAqB,EAAE,EAAE,CACxD,OAAQ,CAAC,GAAG,EAAE,SAAS,CAAC,CACzB,CAAA;IACH,CAAC;IAEO,MAAM,CAAC,GAAG,CAChB,GAAkB,EAClB,IAAwB;QAExB,OAAO,MAAM,CAAC,mBAAmB,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,IAAI,CAAC,GAAG,EAAE,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC,CAAA;IAC1E,CAAC;IAED;;;;;;;;;;;;;;;;;;;;OAoBG;IACK,MAAM,CAAC,cAAc,CAC3B,KAAuC;QAEvC,KAAK,GAAG,0BAAS,CAAC,KAAK,CAAC,CAAA;QAExB,OAAO,MAAM,CAAC,mBAAmB,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,CAAC,QAAQ,EAAE,GAAG,EAAE,EAAE;YAChE,MAAM,SAAS,GAAG,KAAK,CAAC,GAAG,CAAC,CAAA;YAE5B,IAAI,OAAO,IAAI,SAAS,EAAE;gBACxB,QAAQ,CAAC,GAAG,CAAC,GAAG,SAAS,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,EAAE;oBAC/C,QAAQ,CAAC,aAAa,CAAC,GAAG,QAAQ,CAAC,SAAS,CAAC,CAAA;oBAE7C,OAAO,QAAQ,CAAC,SAAS,CAAC,CAAA;oBAC1B,OAAO,QAAQ,CAAC,cAAc,CAAC,CAAA;oBAE/B,OAAO,QAAQ,CAAA;gBACjB,CAAC,CAAe,CAAA;aACjB;iBAAM;gBACL,QAAQ,CAAC,GAAG,CAAC,GAAG,SAAS,CAAA;aAC1B;YAED,OAAO,QAAQ,CAAA;QACjB,CAAC,EAAE,EAAmB,CAAC,CAAA;IACzB,CAAC;IAED,MAAM,CAAC,QAAgC;QACrC,IAAI,CAAC,MAAM,CAAC,MAAM,GAAG,QAAQ,CAAA;IAC/B,CAAC;IAED,OAAO,CAAC,QAAiC;QACvC,IAAI,CAAC,MAAM,CAAC,OAAO,GAAG,QAAQ,CAAA;IAChC,CAAC;IAED,MAAM,CAAC,QAAoB;QACzB,IAAI,CAAC,MAAM,CAAC,MAAM,GAAG,QAAQ,CAAA;IAC/B,CAAC;IAED,IAAI,CAAU,EAAuB;QACnC,OAAO,gBAAgB,CAAC,IAAI,CAAI,IAAI,CAAC,KAAK,EAAE,EAAE,CAAC,CAAA;IACjD,CAAC;IAEO,kBAAkB;QACxB,OAAO,CAAC,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,OAAO,KAAK,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE,CAAA;IACjE,CAAC;CACF;AAnRD,mCAmRC"}

package/dist/main/index.d.ts

@@ -1,5 +1,6 @@
 import * as Transformers from './lib/transformers';
 import RealtimeClient, { Options as RealtimeClientOptions } from './RealtimeClient';
 import RealtimeSubscription from './RealtimeSubscription';
-export { RealtimeClient, RealtimeClientOptions, RealtimeSubscription, Transformers, };
+import RealtimePresence from './RealtimePresence';
+export { RealtimeClient, RealtimeClientOptions, RealtimeSubscription, RealtimePresence, Transformers, };
 //# sourceMappingURL=index.d.ts.map

package/dist/main/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,YAAY,MAAM,oBAAoB,CAAA;AAClD,OAAO,cAAc,EAAE,EACrB,OAAO,IAAI,qBAAqB,EACjC,MAAM,kBAAkB,CAAA;AACzB,OAAO,oBAAoB,MAAM,wBAAwB,CAAA;AAEzD,OAAO,EACL,cAAc,EACd,qBAAqB,EACrB,oBAAoB,EACpB,YAAY,GACb,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,YAAY,MAAM,oBAAoB,CAAA;AAClD,OAAO,cAAc,EAAE,EACrB,OAAO,IAAI,qBAAqB,EACjC,MAAM,kBAAkB,CAAA;AACzB,OAAO,oBAAoB,MAAM,wBAAwB,CAAA;AACzD,OAAO,gBAAgB,MAAM,oBAAoB,CAAA;AAEjD,OAAO,EACL,cAAc,EACd,qBAAqB,EACrB,oBAAoB,EACpB,gBAAgB,EAChB,YAAY,GACb,CAAA"}

package/dist/main/index.js

@@ -22,11 +22,13 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Transformers = exports.RealtimeSubscription = exports.RealtimeClient = void 0;
+exports.Transformers = exports.RealtimePresence = exports.RealtimeSubscription = exports.RealtimeClient = void 0;
 const Transformers = __importStar(require("./lib/transformers"));
 exports.Transformers = Transformers;
 const RealtimeClient_1 = __importDefault(require("./RealtimeClient"));
 exports.RealtimeClient = RealtimeClient_1.default;
 const RealtimeSubscription_1 = __importDefault(require("./RealtimeSubscription"));
 exports.RealtimeSubscription = RealtimeSubscription_1.default;
+const RealtimePresence_1 = __importDefault(require("./RealtimePresence"));
+exports.RealtimePresence = RealtimePresence_1.default;
 //# sourceMappingURL=index.js.map

package/dist/main/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAAA,iEAAkD;AAUhD,oCAAY;AATd,sEAEyB;AAIvB,yBANK,wBAAc,CAML;AAHhB,kFAAyD;AAKvD,+BALK,8BAAoB,CAKL"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAAA,iEAAkD;AAYhD,oCAAY;AAXd,sEAEyB;AAKvB,yBAPK,wBAAc,CAOL;AAJhB,kFAAyD;AAMvD,+BANK,8BAAoB,CAML;AALtB,0EAAiD;AAM/C,2BANK,0BAAgB,CAML"}

package/dist/main/lib/version.d.ts

@@ -1,2 +1,2 @@
-export declare const version = "1.3.6";
+export declare const version = "1.4.0";
 //# sourceMappingURL=version.d.ts.map

package/dist/main/lib/version.js

@@ -2,5 +2,5 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.version = void 0;
 // generated by genversion
-exports.version = '1.3.6';
+exports.version = '1.4.0';
 //# sourceMappingURL=version.js.map

package/dist/module/RealtimePresence.d.ts

@@ -0,0 +1,92 @@
+import { PresenceOpts, PresenceOnJoinCallback, PresenceOnLeaveCallback } from 'phoenix';
+import RealtimeSubscription from './RealtimeSubscription';
+declare type Presence = {
+    presence_id: string;
+    [key: string]: any;
+};
+declare type PresenceState = {
+    [key: string]: Presence[];
+};
+declare type PresenceDiff = {
+    joins: PresenceState;
+    leaves: PresenceState;
+};
+declare type RawPresenceState = {
+    [key: string]: Record<'metas', {
+        phx_ref?: string;
+        phx_ref_prev?: string;
+        [key: string]: any;
+    }[]>;
+};
+declare type RawPresenceDiff = {
+    joins: RawPresenceState;
+    leaves: RawPresenceState;
+};
+declare type PresenceChooser<T> = (key: string, presences: any) => T;
+export default class RealtimePresence {
+    channel: RealtimeSubscription;
+    state: PresenceState;
+    pendingDiffs: RawPresenceDiff[];
+    joinRef: string | null;
+    caller: {
+        onJoin: PresenceOnJoinCallback;
+        onLeave: PresenceOnLeaveCallback;
+        onSync: () => void;
+    };
+    /**
+     * Initializes the Presence
+     * @param channel - The RealtimeSubscription
+     * @param opts - The options,
+     *        for example `{events: {state: 'state', diff: 'diff'}}`
+     */
+    constructor(channel: RealtimeSubscription, opts?: PresenceOpts);
+    /**
+     * Used to sync the list of presences on the server
+     * with the client's state. An optional `onJoin` and `onLeave` callback can
+     * be provided to react to changes in the client's local presences across
+     * disconnects and reconnects with the server.
+     */
+    static syncState(currentState: PresenceState, newState: RawPresenceState | PresenceState, onJoin: PresenceOnJoinCallback, onLeave: PresenceOnLeaveCallback): PresenceState;
+    /**
+     *
+     * Used to sync a diff of presence join and leave
+     * events from the server, as they happen. Like `syncState`, `syncDiff`
+     * accepts optional `onJoin` and `onLeave` callbacks to react to a user
+     * joining or leaving from a device.
+     */
+    static syncDiff(state: PresenceState, diff: RawPresenceDiff | PresenceDiff, onJoin: PresenceOnJoinCallback, onLeave: PresenceOnLeaveCallback): PresenceState;
+    /**
+     * Returns the array of presences, with selected metadata.
+     */
+    static list<T = any>(presences: PresenceState, chooser: PresenceChooser<T> | undefined): T[];
+    private static map;
+    /**
+     * Remove 'metas' key
+     * Change 'phx_ref' to 'presence_id'
+     * Remove 'phx_ref' and 'phx_ref_prev'
+     *
+     * @example
+     * // returns {
+     *  abc123: [
+     *    { presence_id: '2', user_id: 1 },
+     *    { presence_id: '3', user_id: 2 }
+     *  ]
+     * }
+     * RealtimePresence.transformState({
+     *  abc123: {
+     *    metas: [
+     *      { phx_ref: '2', phx_ref_prev: '1' user_id: 1 },
+     *      { phx_ref: '3', user_id: 2 }
+     *    ]
+     *  }
+     * })
+     */
+    private static transformState;
+    onJoin(callback: PresenceOnJoinCallback): void;
+    onLeave(callback: PresenceOnLeaveCallback): void;
+    onSync(callback: () => void): void;
+    list<T = any>(by?: PresenceChooser<T>): T[];
+    private inPendingSyncState;
+}
+export {};
+//# sourceMappingURL=RealtimePresence.d.ts.map

package/dist/module/RealtimePresence.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RealtimePresence.d.ts","sourceRoot":"","sources":["../../src/RealtimePresence.ts"],"names":[],"mappings":"AAMA,OAAO,EACL,YAAY,EACZ,sBAAsB,EACtB,uBAAuB,EACxB,MAAM,SAAS,CAAA;AAChB,OAAO,oBAAoB,MAAM,wBAAwB,CAAA;AAEzD,aAAK,QAAQ,GAAG;IACd,WAAW,EAAE,MAAM,CAAA;IACnB,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;CACnB,CAAA;AAED,aAAK,aAAa,GAAG;IAAE,CAAC,GAAG,EAAE,MAAM,GAAG,QAAQ,EAAE,CAAA;CAAE,CAAA;AAElD,aAAK,YAAY,GAAG;IAClB,KAAK,EAAE,aAAa,CAAA;IACpB,MAAM,EAAE,aAAa,CAAA;CACtB,CAAA;AAED,aAAK,gBAAgB,GAAG;IACtB,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CACnB,OAAO,EACP;QACE,OAAO,CAAC,EAAE,MAAM,CAAA;QAChB,YAAY,CAAC,EAAE,MAAM,CAAA;QACrB,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KACnB,EAAE,CACJ,CAAA;CACF,CAAA;AAED,aAAK,eAAe,GAAG;IACrB,KAAK,EAAE,gBAAgB,CAAA;IACvB,MAAM,EAAE,gBAAgB,CAAA;CACzB,CAAA;AAED,aAAK,eAAe,CAAC,CAAC,IAAI,CAAC,GAAG,EAAE,MAAM,EAAE,SAAS,EAAE,GAAG,KAAK,CAAC,CAAA;AAE5D,MAAM,CAAC,OAAO,OAAO,gBAAgB;IAoBhB,OAAO,EAAE,oBAAoB;IAnBhD,KAAK,EAAE,aAAa,CAAK;IACzB,YAAY,EAAE,eAAe,EAAE,CAAK;IACpC,OAAO,EAAE,MAAM,GAAG,IAAI,CAAO;IAC7B,MAAM,EAAE;QACN,MAAM,EAAE,sBAAsB,CAAA;QAC9B,OAAO,EAAE,uBAAuB,CAAA;QAChC,MAAM,EAAE,MAAM,IAAI,CAAA;KACnB,CAIA;IAED;;;;;OAKG;gBACgB,OAAO,EAAE,oBAAoB,EAAE,IAAI,CAAC,EAAE,YAAY;IAkDrE;;;;;OAKG;IACH,MAAM,CAAC,SAAS,CACd,YAAY,EAAE,aAAa,EAC3B,QAAQ,EAAE,gBAAgB,GAAG,aAAa,EAC1C,MAAM,EAAE,sBAAsB,EAC9B,OAAO,EAAE,uBAAuB,GAC/B,aAAa;IA0ChB;;;;;;OAMG;IACH,MAAM,CAAC,QAAQ,CACb,KAAK,EAAE,aAAa,EACpB,IAAI,EAAE,eAAe,GAAG,YAAY,EACpC,MAAM,EAAE,sBAAsB,EAC9B,OAAO,EAAE,uBAAuB,GAC/B,aAAa;IAoDhB;;OAEG;IACH,MAAM,CAAC,IAAI,CAAC,CAAC,GAAG,GAAG,EACjB,SAAS,EAAE,aAAa,EACxB,OAAO,EAAE,eAAe,CAAC,CAAC,CAAC,GAAG,SAAS,GACtC,CAAC,EAAE;IAUN,OAAO,CAAC,MAAM,CAAC,GAAG;IAOlB;;;;;;;;;;;;;;;;;;;;OAoBG;IACH,OAAO,CAAC,MAAM,CAAC,cAAc;IAyB7B,MAAM,CAAC,QAAQ,EAAE,sBAAsB,GAAG,IAAI;IAI9C,OAAO,CAAC,QAAQ,EAAE,uBAAuB,GAAG,IAAI;IAIhD,MAAM,CAAC,QAAQ,EAAE,MAAM,IAAI,GAAG,IAAI;IAIlC,IAAI,CAAC,CAAC,GAAG,GAAG,EAAE,EAAE,CAAC,EAAE,eAAe,CAAC,CAAC,CAAC,GAAG,CAAC,EAAE;IAI3C,OAAO,CAAC,kBAAkB;CAG3B"}

package/dist/module/RealtimePresence.js

@@ -0,0 +1,192 @@
+/*
+  This file draws heavily from https://github.com/phoenixframework/phoenix/blob/d344ec0a732ab4ee204215b31de69cf4be72e3bf/assets/js/phoenix/presence.js
+  License: https://github.com/phoenixframework/phoenix/blob/d344ec0a732ab4ee204215b31de69cf4be72e3bf/LICENSE.md
+*/
+import cloneDeep from 'lodash.clonedeep';
+export default class RealtimePresence {
+    /**
+     * Initializes the Presence
+     * @param channel - The RealtimeSubscription
+     * @param opts - The options,
+     *        for example `{events: {state: 'state', diff: 'diff'}}`
+     */
+    constructor(channel, opts) {
+        this.channel = channel;
+        this.state = {};
+        this.pendingDiffs = [];
+        this.joinRef = null;
+        this.caller = {
+            onJoin: () => { },
+            onLeave: () => { },
+            onSync: () => { },
+        };
+        const events = (opts === null || opts === void 0 ? void 0 : opts.events) || {
+            state: 'presence_state',
+            diff: 'presence_diff',
+        };
+        this.channel.on(events.state, (newState) => {
+            const { onJoin, onLeave, onSync } = this.caller;
+            this.joinRef = this.channel.joinRef();
+            this.state = RealtimePresence.syncState(this.state, newState, onJoin, onLeave);
+            this.pendingDiffs.forEach((diff) => {
+                this.state = RealtimePresence.syncDiff(this.state, diff, onJoin, onLeave);
+            });
+            this.pendingDiffs = [];
+            onSync();
+        });
+        this.channel.on(events.diff, (diff) => {
+            const { onJoin, onLeave, onSync } = this.caller;
+            if (this.inPendingSyncState()) {
+                this.pendingDiffs.push(diff);
+            }
+            else {
+                this.state = RealtimePresence.syncDiff(this.state, diff, onJoin, onLeave);
+                onSync();
+            }
+        });
+    }
+    /**
+     * Used to sync the list of presences on the server
+     * with the client's state. An optional `onJoin` and `onLeave` callback can
+     * be provided to react to changes in the client's local presences across
+     * disconnects and reconnects with the server.
+     */
+    static syncState(currentState, newState, onJoin, onLeave) {
+        const state = cloneDeep(currentState);
+        const transformedState = this.transformState(newState);
+        const joins = {};
+        const leaves = {};
+        this.map(state, (key, presences) => {
+            if (!transformedState[key]) {
+                leaves[key] = presences;
+            }
+        });
+        this.map(transformedState, (key, newPresences) => {
+            const currentPresences = state[key];
+            if (currentPresences) {
+                const newPresenceIds = newPresences.map((m) => m.presence_id);
+                const curPresenceIds = currentPresences.map((m) => m.presence_id);
+                const joinedPresences = newPresences.filter((m) => curPresenceIds.indexOf(m.presence_id) < 0);
+                const leftPresences = currentPresences.filter((m) => newPresenceIds.indexOf(m.presence_id) < 0);
+                if (joinedPresences.length > 0) {
+                    joins[key] = joinedPresences;
+                }
+                if (leftPresences.length > 0) {
+                    leaves[key] = leftPresences;
+                }
+            }
+            else {
+                joins[key] = newPresences;
+            }
+        });
+        return this.syncDiff(state, { joins, leaves }, onJoin, onLeave);
+    }
+    /**
+     *
+     * Used to sync a diff of presence join and leave
+     * events from the server, as they happen. Like `syncState`, `syncDiff`
+     * accepts optional `onJoin` and `onLeave` callbacks to react to a user
+     * joining or leaving from a device.
+     */
+    static syncDiff(state, diff, onJoin, onLeave) {
+        const { joins, leaves } = {
+            joins: this.transformState(diff.joins),
+            leaves: this.transformState(diff.leaves),
+        };
+        if (!onJoin) {
+            onJoin = () => { };
+        }
+        if (!onLeave) {
+            onLeave = () => { };
+        }
+        this.map(joins, (key, newPresences) => {
+            const currentPresences = state[key];
+            state[key] = cloneDeep(newPresences);
+            if (currentPresences) {
+                const joinedPresenceIds = state[key].map((m) => m.presence_id);
+                const curPresences = currentPresences.filter((m) => joinedPresenceIds.indexOf(m.presence_id) < 0);
+                state[key].unshift(...curPresences);
+            }
+            onJoin(key, currentPresences, newPresences);
+        });
+        this.map(leaves, (key, leftPresences) => {
+            let currentPresences = state[key];
+            if (!currentPresences)
+                return;
+            const presenceIdsToRemove = leftPresences.map((m) => m.presence_id);
+            currentPresences = currentPresences.filter((m) => presenceIdsToRemove.indexOf(m.presence_id) < 0);
+            state[key] = currentPresences;
+            onLeave(key, currentPresences, leftPresences);
+            if (currentPresences.length === 0)
+                delete state[key];
+        });
+        return state;
+    }
+    /**
+     * Returns the array of presences, with selected metadata.
+     */
+    static list(presences, chooser) {
+        if (!chooser) {
+            chooser = (_key, pres) => pres;
+        }
+        return this.map(presences, (key, presences) => chooser(key, presences));
+    }
+    static map(obj, func) {
+        return Object.getOwnPropertyNames(obj).map((key) => func(key, obj[key]));
+    }
+    /**
+     * Remove 'metas' key
+     * Change 'phx_ref' to 'presence_id'
+     * Remove 'phx_ref' and 'phx_ref_prev'
+     *
+     * @example
+     * // returns {
+     *  abc123: [
+     *    { presence_id: '2', user_id: 1 },
+     *    { presence_id: '3', user_id: 2 }
+     *  ]
+     * }
+     * RealtimePresence.transformState({
+     *  abc123: {
+     *    metas: [
+     *      { phx_ref: '2', phx_ref_prev: '1' user_id: 1 },
+     *      { phx_ref: '3', user_id: 2 }
+     *    ]
+     *  }
+     * })
+     */
+    static transformState(state) {
+        state = cloneDeep(state);
+        return Object.getOwnPropertyNames(state).reduce((newState, key) => {
+            const presences = state[key];
+            if ('metas' in presences) {
+                newState[key] = presences.metas.map((presence) => {
+                    presence['presence_id'] = presence['phx_ref'];
+                    delete presence['phx_ref'];
+                    delete presence['phx_ref_prev'];
+                    return presence;
+                });
+            }
+            else {
+                newState[key] = presences;
+            }
+            return newState;
+        }, {});
+    }
+    onJoin(callback) {
+        this.caller.onJoin = callback;
+    }
+    onLeave(callback) {
+        this.caller.onLeave = callback;
+    }
+    onSync(callback) {
+        this.caller.onSync = callback;
+    }
+    list(by) {
+        return RealtimePresence.list(this.state, by);
+    }
+    inPendingSyncState() {
+        return !this.joinRef || this.joinRef !== this.channel.joinRef();
+    }
+}
+//# sourceMappingURL=RealtimePresence.js.map

package/dist/module/RealtimePresence.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RealtimePresence.js","sourceRoot":"","sources":["../../src/RealtimePresence.ts"],"names":[],"mappings":"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"}

package/dist/module/index.d.ts

@@ -1,5 +1,6 @@
 import * as Transformers from './lib/transformers';
 import RealtimeClient, { Options as RealtimeClientOptions } from './RealtimeClient';
 import RealtimeSubscription from './RealtimeSubscription';
-export { RealtimeClient, RealtimeClientOptions, RealtimeSubscription, Transformers, };
+import RealtimePresence from './RealtimePresence';
+export { RealtimeClient, RealtimeClientOptions, RealtimeSubscription, RealtimePresence, Transformers, };
 //# sourceMappingURL=index.d.ts.map

package/dist/module/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,YAAY,MAAM,oBAAoB,CAAA;AAClD,OAAO,cAAc,EAAE,EACrB,OAAO,IAAI,qBAAqB,EACjC,MAAM,kBAAkB,CAAA;AACzB,OAAO,oBAAoB,MAAM,wBAAwB,CAAA;AAEzD,OAAO,EACL,cAAc,EACd,qBAAqB,EACrB,oBAAoB,EACpB,YAAY,GACb,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,YAAY,MAAM,oBAAoB,CAAA;AAClD,OAAO,cAAc,EAAE,EACrB,OAAO,IAAI,qBAAqB,EACjC,MAAM,kBAAkB,CAAA;AACzB,OAAO,oBAAoB,MAAM,wBAAwB,CAAA;AACzD,OAAO,gBAAgB,MAAM,oBAAoB,CAAA;AAEjD,OAAO,EACL,cAAc,EACd,qBAAqB,EACrB,oBAAoB,EACpB,gBAAgB,EAChB,YAAY,GACb,CAAA"}

package/dist/module/index.js

@@ -1,5 +1,6 @@
 import * as Transformers from './lib/transformers';
 import RealtimeClient from './RealtimeClient';
 import RealtimeSubscription from './RealtimeSubscription';
-export { RealtimeClient, RealtimeSubscription, Transformers, };
+import RealtimePresence from './RealtimePresence';
+export { RealtimeClient, RealtimeSubscription, RealtimePresence, Transformers, };
 //# sourceMappingURL=index.js.map

package/dist/module/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,YAAY,MAAM,oBAAoB,CAAA;AAClD,OAAO,cAEN,MAAM,kBAAkB,CAAA;AACzB,OAAO,oBAAoB,MAAM,wBAAwB,CAAA;AAEzD,OAAO,EACL,cAAc,EAEd,oBAAoB,EACpB,YAAY,GACb,CAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,YAAY,MAAM,oBAAoB,CAAA;AAClD,OAAO,cAEN,MAAM,kBAAkB,CAAA;AACzB,OAAO,oBAAoB,MAAM,wBAAwB,CAAA;AACzD,OAAO,gBAAgB,MAAM,oBAAoB,CAAA;AAEjD,OAAO,EACL,cAAc,EAEd,oBAAoB,EACpB,gBAAgB,EAChB,YAAY,GACb,CAAA"}

package/dist/module/lib/version.d.ts

@@ -1,2 +1,2 @@
-export declare const version = "1.3.6";
+export declare const version = "1.4.0";
 //# sourceMappingURL=version.d.ts.map

package/dist/module/lib/version.js

@@ -1,3 +1,3 @@
 // generated by genversion
-export const version = '1.3.6';
+export const version = '1.4.0';
 //# sourceMappingURL=version.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@supabase/realtime-js",
-  "version": "1.3.6",
+  "version": "1.4.0",
   "description": "Listen to realtime updates to your PostgreSQL database",
   "keywords": [
     "realtime",
@@ -34,7 +34,10 @@
     "docs:json": "typedoc --json docs/spec.json --mode modules --includeDeclarations --excludeExternals"
   },
   "dependencies": {
+    "@types/lodash.clonedeep": "^4.5.6",
+    "@types/phoenix": "^1.5.4",
     "@types/websocket": "^1.0.3",
+    "lodash.clonedeep": "^4.5.0",
     "websocket": "^1.0.34"
   },
   "devDependencies": {

package/src/RealtimePresence.ts

@@ -0,0 +1,319 @@
+/*
+  This file draws heavily from https://github.com/phoenixframework/phoenix/blob/d344ec0a732ab4ee204215b31de69cf4be72e3bf/assets/js/phoenix/presence.js
+  License: https://github.com/phoenixframework/phoenix/blob/d344ec0a732ab4ee204215b31de69cf4be72e3bf/LICENSE.md
+*/
+
+import cloneDeep from 'lodash.clonedeep'
+import {
+  PresenceOpts,
+  PresenceOnJoinCallback,
+  PresenceOnLeaveCallback,
+} from 'phoenix'
+import RealtimeSubscription from './RealtimeSubscription'
+
+type Presence = {
+  presence_id: string
+  [key: string]: any
+}
+
+type PresenceState = { [key: string]: Presence[] }
+
+type PresenceDiff = {
+  joins: PresenceState
+  leaves: PresenceState
+}
+
+type RawPresenceState = {
+  [key: string]: Record<
+    'metas',
+    {
+      phx_ref?: string
+      phx_ref_prev?: string
+      [key: string]: any
+    }[]
+  >
+}
+
+type RawPresenceDiff = {
+  joins: RawPresenceState
+  leaves: RawPresenceState
+}
+
+type PresenceChooser<T> = (key: string, presences: any) => T
+
+export default class RealtimePresence {
+  state: PresenceState = {}
+  pendingDiffs: RawPresenceDiff[] = []
+  joinRef: string | null = null
+  caller: {
+    onJoin: PresenceOnJoinCallback
+    onLeave: PresenceOnLeaveCallback
+    onSync: () => void
+  } = {
+    onJoin: () => {},
+    onLeave: () => {},
+    onSync: () => {},
+  }
+
+  /**
+   * Initializes the Presence
+   * @param channel - The RealtimeSubscription
+   * @param opts - The options,
+   *        for example `{events: {state: 'state', diff: 'diff'}}`
+   */
+  constructor(public channel: RealtimeSubscription, opts?: PresenceOpts) {
+    const events = opts?.events || {
+      state: 'presence_state',
+      diff: 'presence_diff',
+    }
+
+    this.channel.on(events.state, (newState: RawPresenceState) => {
+      const { onJoin, onLeave, onSync } = this.caller
+
+      this.joinRef = this.channel.joinRef()
+
+      this.state = RealtimePresence.syncState(
+        this.state,
+        newState,
+        onJoin,
+        onLeave
+      )
+
+      this.pendingDiffs.forEach((diff) => {
+        this.state = RealtimePresence.syncDiff(
+          this.state,
+          diff,
+          onJoin,
+          onLeave
+        )
+      })
+
+      this.pendingDiffs = []
+
+      onSync()
+    })
+
+    this.channel.on(events.diff, (diff: RawPresenceDiff) => {
+      const { onJoin, onLeave, onSync } = this.caller
+
+      if (this.inPendingSyncState()) {
+        this.pendingDiffs.push(diff)
+      } else {
+        this.state = RealtimePresence.syncDiff(
+          this.state,
+          diff,
+          onJoin,
+          onLeave
+        )
+
+        onSync()
+      }
+    })
+  }
+
+  /**
+   * Used to sync the list of presences on the server
+   * with the client's state. An optional `onJoin` and `onLeave` callback can
+   * be provided to react to changes in the client's local presences across
+   * disconnects and reconnects with the server.
+   */
+  static syncState(
+    currentState: PresenceState,
+    newState: RawPresenceState | PresenceState,
+    onJoin: PresenceOnJoinCallback,
+    onLeave: PresenceOnLeaveCallback
+  ): PresenceState {
+    const state = cloneDeep(currentState)
+    const transformedState = this.transformState(newState)
+    const joins: PresenceState = {}
+    const leaves: PresenceState = {}
+
+    this.map(state, (key: string, presences: Presence[]) => {
+      if (!transformedState[key]) {
+        leaves[key] = presences
+      }
+    })
+
+    this.map(transformedState, (key, newPresences: Presence[]) => {
+      const currentPresences: Presence[] = state[key]
+
+      if (currentPresences) {
+        const newPresenceIds = newPresences.map((m: Presence) => m.presence_id)
+        const curPresenceIds = currentPresences.map(
+          (m: Presence) => m.presence_id
+        )
+        const joinedPresences: Presence[] = newPresences.filter(
+          (m: Presence) => curPresenceIds.indexOf(m.presence_id) < 0
+        )
+        const leftPresences: Presence[] = currentPresences.filter(
+          (m: Presence) => newPresenceIds.indexOf(m.presence_id) < 0
+        )
+
+        if (joinedPresences.length > 0) {
+          joins[key] = joinedPresences
+        }
+
+        if (leftPresences.length > 0) {
+          leaves[key] = leftPresences
+        }
+      } else {
+        joins[key] = newPresences
+      }
+    })
+
+    return this.syncDiff(state, { joins, leaves }, onJoin, onLeave)
+  }
+
+  /**
+   *
+   * Used to sync a diff of presence join and leave
+   * events from the server, as they happen. Like `syncState`, `syncDiff`
+   * accepts optional `onJoin` and `onLeave` callbacks to react to a user
+   * joining or leaving from a device.
+   */
+  static syncDiff(
+    state: PresenceState,
+    diff: RawPresenceDiff | PresenceDiff,
+    onJoin: PresenceOnJoinCallback,
+    onLeave: PresenceOnLeaveCallback
+  ): PresenceState {
+    const { joins, leaves } = {
+      joins: this.transformState(diff.joins),
+      leaves: this.transformState(diff.leaves),
+    }
+
+    if (!onJoin) {
+      onJoin = () => {}
+    }
+
+    if (!onLeave) {
+      onLeave = () => {}
+    }
+
+    this.map(joins, (key, newPresences: Presence[]) => {
+      const currentPresences: Presence[] = state[key]
+      state[key] = cloneDeep(newPresences)
+
+      if (currentPresences) {
+        const joinedPresenceIds = state[key].map((m: Presence) => m.presence_id)
+        const curPresences: Presence[] = currentPresences.filter(
+          (m: Presence) => joinedPresenceIds.indexOf(m.presence_id) < 0
+        )
+
+        state[key].unshift(...curPresences)
+      }
+
+      onJoin(key, currentPresences, newPresences)
+    })
+
+    this.map(leaves, (key, leftPresences: Presence[]) => {
+      let currentPresences: Presence[] = state[key]
+
+      if (!currentPresences) return
+
+      const presenceIdsToRemove = leftPresences.map(
+        (m: Presence) => m.presence_id
+      )
+      currentPresences = currentPresences.filter(
+        (m: Presence) => presenceIdsToRemove.indexOf(m.presence_id) < 0
+      )
+
+      state[key] = currentPresences
+
+      onLeave(key, currentPresences, leftPresences)
+
+      if (currentPresences.length === 0) delete state[key]
+    })
+
+    return state
+  }
+
+  /**
+   * Returns the array of presences, with selected metadata.
+   */
+  static list<T = any>(
+    presences: PresenceState,
+    chooser: PresenceChooser<T> | undefined
+  ): T[] {
+    if (!chooser) {
+      chooser = (_key, pres) => pres
+    }
+
+    return this.map(presences, (key, presences: Presence[]) =>
+      chooser!(key, presences)
+    )
+  }
+
+  private static map<T = any>(
+    obj: PresenceState,
+    func: PresenceChooser<T>
+  ): T[] {
+    return Object.getOwnPropertyNames(obj).map((key) => func(key, obj[key]))
+  }
+
+  /**
+   * Remove 'metas' key
+   * Change 'phx_ref' to 'presence_id'
+   * Remove 'phx_ref' and 'phx_ref_prev'
+   *
+   * @example
+   * // returns {
+   *  abc123: [
+   *    { presence_id: '2', user_id: 1 },
+   *    { presence_id: '3', user_id: 2 }
+   *  ]
+   * }
+   * RealtimePresence.transformState({
+   *  abc123: {
+   *    metas: [
+   *      { phx_ref: '2', phx_ref_prev: '1' user_id: 1 },
+   *      { phx_ref: '3', user_id: 2 }
+   *    ]
+   *  }
+   * })
+   */
+  private static transformState(
+    state: RawPresenceState | PresenceState
+  ): PresenceState {
+    state = cloneDeep(state)
+
+    return Object.getOwnPropertyNames(state).reduce((newState, key) => {
+      const presences = state[key]
+
+      if ('metas' in presences) {
+        newState[key] = presences.metas.map((presence) => {
+          presence['presence_id'] = presence['phx_ref']
+
+          delete presence['phx_ref']
+          delete presence['phx_ref_prev']
+
+          return presence
+        }) as Presence[]
+      } else {
+        newState[key] = presences
+      }
+
+      return newState
+    }, {} as PresenceState)
+  }
+
+  onJoin(callback: PresenceOnJoinCallback): void {
+    this.caller.onJoin = callback
+  }
+
+  onLeave(callback: PresenceOnLeaveCallback): void {
+    this.caller.onLeave = callback
+  }
+
+  onSync(callback: () => void): void {
+    this.caller.onSync = callback
+  }
+
+  list<T = any>(by?: PresenceChooser<T>): T[] {
+    return RealtimePresence.list<T>(this.state, by)
+  }
+
+  private inPendingSyncState(): boolean {
+    return !this.joinRef || this.joinRef !== this.channel.joinRef()
+  }
+}

package/src/index.ts

@@ -3,10 +3,12 @@ import RealtimeClient, {
   Options as RealtimeClientOptions,
 } from './RealtimeClient'
 import RealtimeSubscription from './RealtimeSubscription'
+import RealtimePresence from './RealtimePresence'
 
 export {
   RealtimeClient,
   RealtimeClientOptions,
   RealtimeSubscription,
+  RealtimePresence,
   Transformers,
 }

package/src/lib/version.ts

@@ -1,2 +1,2 @@
 // generated by genversion
-export const version = '1.3.6'
+export const version = '1.4.0'