@arcanejs/toolkit 1.1.1 → 3.0.0

package/dist/index.d.mts

@@ -1,14 +1,4 @@
-import * as _arcanejs_protocol_logging from '@arcanejs/protocol/logging';
-import { Logger } from '@arcanejs/protocol/logging';
-import _ from 'lodash';
-import * as http from 'http';
-import { Application } from 'express';
-import { WebSocket } from 'ws';
-import { ClientMessage, ServerMessage } from '@arcanejs/protocol';
-import { Group } from './backend/components/group.mjs';
-export { GroupHeader } from './backend/components/group.mjs';
-import { Parent, AnyComponent } from './backend/components/base.mjs';
-export { Button } from './backend/components/button.mjs';
+export { A as AnyComponent, B as Button, G as Group, c as GroupHeader, T as Toolkit, a as ToolkitConnection, b as ToolkitOptions } from './toolkit-DB8G2TaA.mjs';
 export { Label } from './backend/components/label.mjs';
 export { Rect } from './backend/components/rect.mjs';
 export { SliderButton } from './backend/components/slider-button.mjs';
@@ -16,106 +6,12 @@ export { Switch } from './backend/components/switch.mjs';
 export { Tab, Tabs } from './backend/components/tabs.mjs';
 export { TextInput } from './backend/components/text-input.mjs';
 export { Timeline } from './backend/components/timeline.mjs';
+import '@arcanejs/protocol/logging';
+import 'lodash';
+import 'http';
+import 'express';
+import 'ws';
+import '@arcanejs/protocol';
 import '@arcanejs/protocol/core';
 import '@arcanejs/protocol/styles';
 import './id-map-DxQ3_gyA.mjs';
-
-interface Connection {
-    sendMessage(msg: ServerMessage): void;
-}
-declare class Server {
-    private readonly options;
-    private readonly onNewConnection;
-    private readonly onClosedConnection;
-    private readonly onMessage;
-    private readonly log?;
-    private readonly staticFiles;
-    private readonly entrypointFilename;
-    private title;
-    constructor(options: ToolkitOptions, onNewConnection: (connection: Connection) => void, onClosedConnection: (connection: Connection) => void, onMessage: (connection: Connection, message: ClientMessage) => void, log?: Logger | undefined);
-    handleHttpRequest: (req: http.IncomingMessage, res: http.ServerResponse) => Promise<void>;
-    private sendStaticFile;
-    handleWsConnection: <S extends WebSocket>(ws: S) => void;
-}
-
-interface ToolkitOptions {
-    /**
-     * What window title should the toolkit be initialized with?
-     */
-    title?: string;
-    /**
-     * What path should be used to serve the light desk.
-     *
-     * This is important if a express server will be used that serves other paths.
-     */
-    path: string;
-    /**
-     * An optional object that can be used to output log events,
-     * we recommend using `pino` for this,
-     * as log levels etc... can be controlled.
-     *
-     * You can also always use `console` for logging,
-     * but this will be quite verbose.
-     */
-    log?: Logger;
-    /**
-     * The entrypoint file that should be used to serve the light desk.
-     *
-     * This is only needed if you have defined custom extensions,
-     * and need to load custom frontend code that includes your extensions.
-     *
-     * This will allow access to both the js file and the `.map.js` file,
-     * that matches this name.
-     */
-    entrypointJsFile?: string;
-    /**
-     * If it's not possible to automatically resolve and import the
-     * material-symbols package in node_modules
-     * (for example when bundling an electron app),
-     * you can provide the path to the material-symbols-outlined.woff2 file here.
-     */
-    materialIconsFontFile?: string;
-}
-type InitializationOptions = 
-/** automatically start a simple  */
-{
-    mode: 'automatic';
-    port: number;
-    /**
-     * Optional callback that is called when the server is ready,
-     * with the url that the server is running on.
-     */
-    onReady?: (url: string) => void;
-}
-/** Create a websocket server that attaches to an existing express and http server */
- | {
-    mode: 'express';
-    express: Application;
-    server: http.Server;
-}
-/** Create a websocket server that attaches to an existing express and http server */
- | {
-    mode: 'manual';
-    setup: (server: Server) => void;
-};
-
-declare class Toolkit implements Parent {
-    private readonly options;
-    /**
-     * Mapping from components to unique IDs that identify them
-     */
-    private readonly componentIDMap;
-    private readonly connections;
-    private rootGroup;
-    constructor(options?: Partial<ToolkitOptions>);
-    start: (opts: InitializationOptions) => void;
-    setRoot: (group: Group) => void;
-    log(): _arcanejs_protocol_logging.Logger | null;
-    updateTree: _.DebouncedFuncLeading<() => void>;
-    removeChild: (component: AnyComponent) => void;
-    private onNewConnection;
-    private onClosedConnection;
-    private onMessage;
-}
-
-export { AnyComponent, Group, Toolkit, type ToolkitOptions };

package/dist/index.d.ts

@@ -1,14 +1,4 @@
-import * as _arcanejs_protocol_logging from '@arcanejs/protocol/logging';
-import { Logger } from '@arcanejs/protocol/logging';
-import _ from 'lodash';
-import * as http from 'http';
-import { Application } from 'express';
-import { WebSocket } from 'ws';
-import { ClientMessage, ServerMessage } from '@arcanejs/protocol';
-import { Group } from './backend/components/group.js';
-export { GroupHeader } from './backend/components/group.js';
-import { Parent, AnyComponent } from './backend/components/base.js';
-export { Button } from './backend/components/button.js';
+export { A as AnyComponent, B as Button, G as Group, c as GroupHeader, T as Toolkit, a as ToolkitConnection, b as ToolkitOptions } from './toolkit-2w2SWHlT.js';
 export { Label } from './backend/components/label.js';
 export { Rect } from './backend/components/rect.js';
 export { SliderButton } from './backend/components/slider-button.js';
@@ -16,106 +6,12 @@ export { Switch } from './backend/components/switch.js';
 export { Tab, Tabs } from './backend/components/tabs.js';
 export { TextInput } from './backend/components/text-input.js';
 export { Timeline } from './backend/components/timeline.js';
+import '@arcanejs/protocol/logging';
+import 'lodash';
+import 'http';
+import 'express';
+import 'ws';
+import '@arcanejs/protocol';
 import '@arcanejs/protocol/core';
 import '@arcanejs/protocol/styles';
 import './id-map-DxQ3_gyA.js';
-
-interface Connection {
-    sendMessage(msg: ServerMessage): void;
-}
-declare class Server {
-    private readonly options;
-    private readonly onNewConnection;
-    private readonly onClosedConnection;
-    private readonly onMessage;
-    private readonly log?;
-    private readonly staticFiles;
-    private readonly entrypointFilename;
-    private title;
-    constructor(options: ToolkitOptions, onNewConnection: (connection: Connection) => void, onClosedConnection: (connection: Connection) => void, onMessage: (connection: Connection, message: ClientMessage) => void, log?: Logger | undefined);
-    handleHttpRequest: (req: http.IncomingMessage, res: http.ServerResponse) => Promise<void>;
-    private sendStaticFile;
-    handleWsConnection: <S extends WebSocket>(ws: S) => void;
-}
-
-interface ToolkitOptions {
-    /**
-     * What window title should the toolkit be initialized with?
-     */
-    title?: string;
-    /**
-     * What path should be used to serve the light desk.
-     *
-     * This is important if a express server will be used that serves other paths.
-     */
-    path: string;
-    /**
-     * An optional object that can be used to output log events,
-     * we recommend using `pino` for this,
-     * as log levels etc... can be controlled.
-     *
-     * You can also always use `console` for logging,
-     * but this will be quite verbose.
-     */
-    log?: Logger;
-    /**
-     * The entrypoint file that should be used to serve the light desk.
-     *
-     * This is only needed if you have defined custom extensions,
-     * and need to load custom frontend code that includes your extensions.
-     *
-     * This will allow access to both the js file and the `.map.js` file,
-     * that matches this name.
-     */
-    entrypointJsFile?: string;
-    /**
-     * If it's not possible to automatically resolve and import the
-     * material-symbols package in node_modules
-     * (for example when bundling an electron app),
-     * you can provide the path to the material-symbols-outlined.woff2 file here.
-     */
-    materialIconsFontFile?: string;
-}
-type InitializationOptions = 
-/** automatically start a simple  */
-{
-    mode: 'automatic';
-    port: number;
-    /**
-     * Optional callback that is called when the server is ready,
-     * with the url that the server is running on.
-     */
-    onReady?: (url: string) => void;
-}
-/** Create a websocket server that attaches to an existing express and http server */
- | {
-    mode: 'express';
-    express: Application;
-    server: http.Server;
-}
-/** Create a websocket server that attaches to an existing express and http server */
- | {
-    mode: 'manual';
-    setup: (server: Server) => void;
-};
-
-declare class Toolkit implements Parent {
-    private readonly options;
-    /**
-     * Mapping from components to unique IDs that identify them
-     */
-    private readonly componentIDMap;
-    private readonly connections;
-    private rootGroup;
-    constructor(options?: Partial<ToolkitOptions>);
-    start: (opts: InitializationOptions) => void;
-    setRoot: (group: Group) => void;
-    log(): _arcanejs_protocol_logging.Logger | null;
-    updateTree: _.DebouncedFuncLeading<() => void>;
-    removeChild: (component: AnyComponent) => void;
-    private onNewConnection;
-    private onClosedConnection;
-    private onMessage;
-}
-
-export { AnyComponent, Group, Toolkit, type ToolkitOptions };

package/dist/index.js

@@ -1,36 +1,38 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { newObj[key] = obj[key]; } } } newObj.default = obj; return newObj; } } function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; } var _class; var _class2;
 
 
-var _chunkARRRZPUKjs = require('./chunk-ARRRZPUK.js');
+var _chunkGMDJYFHDjs = require('./chunk-GMDJYFHD.js');
 
 
-var _chunkHNFNG5MDjs = require('./chunk-HNFNG5MD.js');
+var _chunk4OZ22IQUjs = require('./chunk-4OZ22IQU.js');
 
 
-var _chunkT4TMVBFMjs = require('./chunk-T4TMVBFM.js');
+var _chunk6CWEURJPjs = require('./chunk-6CWEURJP.js');
 
 
 var _chunkEABM5X65js = require('./chunk-EABM5X65.js');
 
 
-var _chunkZLJECS4Hjs = require('./chunk-ZLJECS4H.js');
+var _chunkDG75CS7Fjs = require('./chunk-DG75CS7F.js');
 
 
 
-var _chunkTOPIQUBZjs = require('./chunk-TOPIQUBZ.js');
+var _chunkO5ZW6JYGjs = require('./chunk-O5ZW6JYG.js');
 
 
-var _chunkV5T44HCMjs = require('./chunk-V5T44HCM.js');
+var _chunkDRQVYGTIjs = require('./chunk-DRQVYGTI.js');
 
 
-var _chunk5JPYL5IUjs = require('./chunk-5JPYL5IU.js');
+var _chunk7OX2FB6Cjs = require('./chunk-7OX2FB6C.js');
 
 
-var _chunkSIXWXDZWjs = require('./chunk-SIXWXDZW.js');
+var _chunkCME7HZZKjs = require('./chunk-CME7HZZK.js');
 
 
-var _chunk25LALCANjs = require('./chunk-25LALCAN.js');
-require('./chunk-ADH7RZG5.js');
+var _chunkVEZGD2PGjs = require('./chunk-VEZGD2PG.js');
+
+
+var _chunkSGACFY53js = require('./chunk-SGACFY53.js');
 
 
 var _chunk3RG5ZIWIjs = require('./chunk-3RG5ZIWI.js');
@@ -177,6 +179,7 @@ var Server = (_class = class {
 // src/backend/toolkit.ts
 var _ws = require('ws');
 var _http = require('http');
+var _uuid = require('uuid');
 var Toolkit = (_class2 = class {
   
   /**
@@ -185,7 +188,9 @@ var Toolkit = (_class2 = class {
   __init4() {this.componentIDMap = new (0, _chunkEABM5X65js.IDMap)()}
   __init5() {this.connections = /* @__PURE__ */ new Map()}
   __init6() {this.rootGroup = null}
-  constructor(options = {}) {;_class2.prototype.__init4.call(this);_class2.prototype.__init5.call(this);_class2.prototype.__init6.call(this);_class2.prototype.__init7.call(this);_class2.prototype.__init8.call(this);_class2.prototype.__init9.call(this);_class2.prototype.__init10.call(this);_class2.prototype.__init11.call(this);_class2.prototype.__init12.call(this);_class2.prototype.__init13.call(this);
+  /** @hidden */
+  __init7() {this.events = new (0, _chunkSGACFY53js.EventEmitter)()}
+  constructor(options = {}) {;_class2.prototype.__init4.call(this);_class2.prototype.__init5.call(this);_class2.prototype.__init6.call(this);_class2.prototype.__init7.call(this);_class2.prototype.__init8.call(this);_class2.prototype.__init9.call(this);_class2.prototype.__init10.call(this);_class2.prototype.__init11.call(this);_class2.prototype.__init12.call(this);_class2.prototype.__init13.call(this);_class2.prototype.__init14.call(this);_class2.prototype.__init15.call(this);_class2.prototype.__init16.call(this);_class2.prototype.__init17.call(this);
     this.options = {
       ...DEFAULT_LIGHT_DESK_OPTIONS,
       ...options
@@ -196,7 +201,9 @@ var Toolkit = (_class2 = class {
       );
     }
   }
-  __init7() {this.start = (opts) => {
+  __init8() {this.addListener = this.events.addListener}
+  __init9() {this.removeListener = this.events.removeListener}
+  __init10() {this.start = (opts) => {
     const server = new Server(
       this.options,
       this.onNewConnection,
@@ -212,8 +219,8 @@ var Toolkit = (_class2 = class {
       wss.on("connection", server.handleWsConnection);
       const url = `http://localhost:${opts.port}${this.options.path}`;
       httpServer.listen(opts.port, () => {
-        _optionalChain([opts, 'access', _45 => _45.onReady, 'optionalCall', _46 => _46(url)]);
-        _optionalChain([this, 'access', _47 => _47.options, 'access', _48 => _48.log, 'optionalAccess', _49 => _49.info, 'call', _50 => _50(`Light Desk Started: ${url}`)]);
+        _optionalChain([opts, 'access', _49 => _49.onReady, 'optionalCall', _50 => _50(url)]);
+        _optionalChain([this, 'access', _51 => _51.options, 'access', _52 => _52.log, 'optionalAccess', _53 => _53.info, 'call', _54 => _54(`Light Desk Started: ${url}`)]);
       });
     } else if (opts.mode === "express") {
       const wss = new (0, _ws.WebSocketServer)({
@@ -227,7 +234,7 @@ var Toolkit = (_class2 = class {
       throw new Error(`Unsupported mode`);
     }
   }}
-  __init8() {this.setRoot = (group) => {
+  __init11() {this.setRoot = (group) => {
     if (this.rootGroup) {
       throw new Error("Can only set root group once");
     }
@@ -237,7 +244,10 @@ var Toolkit = (_class2 = class {
   log() {
     return _nullishCoalesce(this.options.log, () => ( null));
   }
-  __init9() {this.updateTree = _lodash2.default.throttle(
+  __init12() {this.getConnections = () => {
+    return [...this.connections.values()].map((c) => c.publicConnection);
+  }}
+  __init13() {this.updateTree = _lodash2.default.throttle(
     () => {
       setImmediate(() => {
         if (!this.rootGroup) return;
@@ -254,15 +264,26 @@ var Toolkit = (_class2 = class {
     10,
     { leading: true, trailing: true }
   )}
-  __init10() {this.removeChild = (component) => {
+  __init14() {this.removeChild = (component) => {
     if (this.rootGroup === component) {
       this.rootGroup = null;
       component.setParent(null);
     }
   }}
-  __init11() {this.onNewConnection = (connection) => {
-    const lastTreeSent = _nullishCoalesce(_optionalChain([this, 'access', _51 => _51.rootGroup, 'optionalAccess', _52 => _52.getProtoInfo, 'call', _53 => _53(this.componentIDMap)]), () => ( void 0));
-    this.connections.set(connection, { lastTreeSent });
+  __init15() {this.onNewConnection = (connection) => {
+    const lastTreeSent = _nullishCoalesce(_optionalChain([this, 'access', _55 => _55.rootGroup, 'optionalAccess', _56 => _56.getProtoInfo, 'call', _57 => _57(this.componentIDMap)]), () => ( void 0));
+    const uuid = _uuid.v4.call(void 0, );
+    const publicConnection = {
+      get uuid() {
+        return uuid;
+      }
+    };
+    this.connections.set(connection, { publicConnection, lastTreeSent });
+    this.events.emit("new-connection", publicConnection);
+    connection.sendMessage({
+      type: "metadata",
+      connectionUuid: uuid
+    });
     if (lastTreeSent) {
       connection.sendMessage({
         type: "tree-full",
@@ -270,16 +291,34 @@ var Toolkit = (_class2 = class {
       });
     }
   }}
-  __init12() {this.onClosedConnection = (connection) => {
-    _optionalChain([this, 'access', _54 => _54.options, 'access', _55 => _55.log, 'optionalAccess', _56 => _56.debug, 'call', _57 => _57("removing connection")]);
+  __init16() {this.onClosedConnection = (connection) => {
+    _optionalChain([this, 'access', _58 => _58.log, 'call', _59 => _59(), 'optionalAccess', _60 => _60.debug, 'call', _61 => _61("removing connection")]);
+    const con = this.connections.get(connection);
     this.connections.delete(connection);
+    if (con) {
+      this.events.emit("closed-connection", con.publicConnection);
+    }
   }}
-  __init13() {this.onMessage = (_connection, message) => {
-    _optionalChain([this, 'access', _58 => _58.options, 'access', _59 => _59.log, 'optionalAccess', _60 => _60.debug, 'call', _61 => _61("got message: %o", message)]);
+  __init17() {this.onMessage = (connection, message) => {
+    const con = this.connections.get(connection);
+    if (!con) {
+      _optionalChain([this, 'access', _62 => _62.log, 'call', _63 => _63(), 'optionalAccess', _64 => _64.warn, 'call', _65 => _65(`got message from unknown connection`)]);
+      return;
+    }
+    const { publicConnection } = con;
+    _optionalChain([this, 'access', _66 => _66.log, 'call', _67 => _67(), 'optionalAccess', _68 => _68.debug, 'call', _69 => _69(
+      "got message: %o from %s",
+      message,
+      publicConnection.uuid
+    )]);
     switch (message.type) {
       case "component-message":
         if (this.rootGroup)
-          this.rootGroup.routeMessage(this.componentIDMap, message);
+          this.rootGroup.routeMessage(
+            this.componentIDMap,
+            message,
+            publicConnection
+          );
         break;
     }
   }}
@@ -297,4 +336,4 @@ var Toolkit = (_class2 = class {
 
 
 
-exports.Button = _chunkZLJECS4Hjs.Button; exports.Group = _chunkTOPIQUBZjs.Group; exports.GroupHeader = _chunkTOPIQUBZjs.GroupHeader; exports.Label = _chunkV5T44HCMjs.Label; exports.Rect = _chunk5JPYL5IUjs.Rect; exports.SliderButton = _chunkSIXWXDZWjs.SliderButton; exports.Switch = _chunk25LALCANjs.Switch; exports.Tab = _chunkARRRZPUKjs.Tab; exports.Tabs = _chunkARRRZPUKjs.Tabs; exports.TextInput = _chunkHNFNG5MDjs.TextInput; exports.Timeline = _chunkT4TMVBFMjs.Timeline; exports.Toolkit = Toolkit;
+exports.Button = _chunkDG75CS7Fjs.Button; exports.Group = _chunkO5ZW6JYGjs.Group; exports.GroupHeader = _chunkO5ZW6JYGjs.GroupHeader; exports.Label = _chunkDRQVYGTIjs.Label; exports.Rect = _chunk7OX2FB6Cjs.Rect; exports.SliderButton = _chunkCME7HZZKjs.SliderButton; exports.Switch = _chunkVEZGD2PGjs.Switch; exports.Tab = _chunkGMDJYFHDjs.Tab; exports.Tabs = _chunkGMDJYFHDjs.Tabs; exports.TextInput = _chunk4OZ22IQUjs.TextInput; exports.Timeline = _chunk6CWEURJPjs.Timeline; exports.Toolkit = Toolkit;

package/dist/index.mjs

@@ -1,36 +1,38 @@
 import {
   Tab,
   Tabs
-} from "./chunk-PXYXUWXE.mjs";
+} from "./chunk-7TTY7CBH.mjs";
 import {
   TextInput
-} from "./chunk-ISHGZXPO.mjs";
+} from "./chunk-YBBUC3QC.mjs";
 import {
   Timeline
-} from "./chunk-LX5IL6WX.mjs";
+} from "./chunk-K37TZB75.mjs";
 import {
   IDMap
 } from "./chunk-RGHJEMWG.mjs";
 import {
   Button
-} from "./chunk-EFNFSHV3.mjs";
+} from "./chunk-W42AOMM6.mjs";
 import {
   Group,
   GroupHeader
-} from "./chunk-5TGGF5UJ.mjs";
+} from "./chunk-5D7OSUZ6.mjs";
 import {
   Label
-} from "./chunk-OAPIVG6M.mjs";
+} from "./chunk-CUZSHFDP.mjs";
 import {
   Rect
-} from "./chunk-BDBRQJSI.mjs";
+} from "./chunk-N6IHYBZH.mjs";
 import {
   SliderButton
-} from "./chunk-IBIEYR3L.mjs";
+} from "./chunk-JFZXSCGK.mjs";
 import {
   Switch
-} from "./chunk-SBHNIFAS.mjs";
-import "./chunk-7SZA6JUN.mjs";
+} from "./chunk-NEQRLPXK.mjs";
+import {
+  EventEmitter
+} from "./chunk-RYR5I5FT.mjs";
 import {
   __require
 } from "./chunk-Y6FXYEAI.mjs";
@@ -177,6 +179,7 @@ var Server = class {
 // src/backend/toolkit.ts
 import { WebSocketServer } from "ws";
 import { createServer } from "http";
+import { v4 as uuidv4 } from "uuid";
 var Toolkit = class {
   options;
   /**
@@ -185,6 +188,8 @@ var Toolkit = class {
   componentIDMap = new IDMap();
   connections = /* @__PURE__ */ new Map();
   rootGroup = null;
+  /** @hidden */
+  events = new EventEmitter();
   constructor(options = {}) {
     this.options = {
       ...DEFAULT_LIGHT_DESK_OPTIONS,
@@ -196,6 +201,8 @@ var Toolkit = class {
       );
     }
   }
+  addListener = this.events.addListener;
+  removeListener = this.events.removeListener;
   start = (opts) => {
     const server = new Server(
       this.options,
@@ -237,6 +244,9 @@ var Toolkit = class {
   log() {
     return this.options.log ?? null;
   }
+  getConnections = () => {
+    return [...this.connections.values()].map((c) => c.publicConnection);
+  };
   updateTree = _.throttle(
     () => {
       setImmediate(() => {
@@ -262,7 +272,18 @@ var Toolkit = class {
   };
   onNewConnection = (connection) => {
     const lastTreeSent = this.rootGroup?.getProtoInfo(this.componentIDMap) ?? void 0;
-    this.connections.set(connection, { lastTreeSent });
+    const uuid = uuidv4();
+    const publicConnection = {
+      get uuid() {
+        return uuid;
+      }
+    };
+    this.connections.set(connection, { publicConnection, lastTreeSent });
+    this.events.emit("new-connection", publicConnection);
+    connection.sendMessage({
+      type: "metadata",
+      connectionUuid: uuid
+    });
     if (lastTreeSent) {
       connection.sendMessage({
         type: "tree-full",
@@ -271,15 +292,33 @@ var Toolkit = class {
     }
   };
   onClosedConnection = (connection) => {
-    this.options.log?.debug("removing connection");
+    this.log()?.debug("removing connection");
+    const con = this.connections.get(connection);
     this.connections.delete(connection);
+    if (con) {
+      this.events.emit("closed-connection", con.publicConnection);
+    }
   };
-  onMessage = (_connection, message) => {
-    this.options.log?.debug("got message: %o", message);
+  onMessage = (connection, message) => {
+    const con = this.connections.get(connection);
+    if (!con) {
+      this.log()?.warn(`got message from unknown connection`);
+      return;
+    }
+    const { publicConnection } = con;
+    this.log()?.debug(
+      "got message: %o from %s",
+      message,
+      publicConnection.uuid
+    );
     switch (message.type) {
       case "component-message":
         if (this.rootGroup)
-          this.rootGroup.routeMessage(this.componentIDMap, message);
+          this.rootGroup.routeMessage(
+            this.componentIDMap,
+            message,
+            publicConnection
+          );
         break;
     }
   };