@seamly/web-ui 20.5.0 → 20.7.0

package/build/dist/lib/standalone.js

@@ -221,13 +221,6 @@ module.exports = __webpack_require__(2857);
 
 /***/ }),
 
-/***/ 8604:
-/***/ (function(module, __unused_webpack_exports, __webpack_require__) {
-
-/* unused reexport */ __webpack_require__(4477);
-
-/***/ }),
-
 /***/ 4310:
 /***/ (function(module, __unused_webpack_exports, __webpack_require__) {
 
@@ -4799,21 +4792,6 @@ var path = __webpack_require__(4058);
 module.exports = path.Object.getOwnPropertyDescriptors;
 
 
-/***/ }),
-
-/***/ 3288:
-/***/ (function(module, __unused_webpack_exports, __webpack_require__) {
-
-__webpack_require__(9816);
-var path = __webpack_require__(4058);
-
-var Object = path.Object;
-
-module.exports = function getOwnPropertyNames(it) {
-  return Object.getOwnPropertyNames(it);
-};
-
-
 /***/ }),
 
 /***/ 498:
@@ -10517,25 +10495,6 @@ $({ target: 'Object', stat: true, sham: !DESCRIPTORS }, {
 });
 
 
-/***/ }),
-
-/***/ 9816:
-/***/ (function(__unused_webpack_module, __unused_webpack_exports, __webpack_require__) {
-
-var $ = __webpack_require__(6887);
-var fails = __webpack_require__(5981);
-var getOwnPropertyNames = (__webpack_require__(684).f);
-
-// eslint-disable-next-line es-x/no-object-getownpropertynames -- required for testing
-var FAILS_ON_PRIMITIVES = fails(function () { return !Object.getOwnPropertyNames(1); });
-
-// `Object.getOwnPropertyNames` method
-// https://tc39.es/ecma262/#sec-object.getownpropertynames
-$({ target: 'Object', stat: true, forced: FAILS_ON_PRIMITIVES }, {
-  getOwnPropertyNames: getOwnPropertyNames
-});
-
-
 /***/ }),
 
 /***/ 7144:
@@ -12316,16 +12275,6 @@ var parent = __webpack_require__(2766);
 module.exports = parent;
 
 
-/***/ }),
-
-/***/ 4477:
-/***/ (function(module, __unused_webpack_exports, __webpack_require__) {
-
-var parent = __webpack_require__(3288);
-
-module.exports = parent;
-
-
 /***/ }),
 
 /***/ 9534:
@@ -18010,6 +17959,7 @@ function seamly_utils_objectSpread(target) { for (var i = 1; i < arguments.lengt
 
 
 
+
 const eventTypes = {
   info: 'info',
   message: 'message',
@@ -18314,9 +18264,9 @@ const seamlyStateReducer = (state, action) => {
 
 
       if (accountHasUploads && (eventType === eventTypes.message || eventType === eventTypes.participant) && !payload.fromClient) {
-        const {
-          type: entryType
-        } = payload.entry || {};
+        var _payload$entry;
+
+        const entryType = payload === null || payload === void 0 ? void 0 : (_payload$entry = payload.entry) === null || _payload$entry === void 0 ? void 0 : _payload$entry.type;
         newOptions = seamly_utils_objectSpread(seamly_utils_objectSpread({}, newOptions), {}, {
           features: seamly_utils_objectSpread(seamly_utils_objectSpread({}, newOptions.features), {}, {
             uploads: seamly_utils_objectSpread(seamly_utils_objectSpread({}, newOptions.features.uploads), {}, {
@@ -18346,7 +18296,10 @@ const seamlyStateReducer = (state, action) => {
           // event optimistically.
           payload: seamly_utils_objectSpread(seamly_utils_objectSpread({}, incrementUnread && {
             messageStatus: payload.fromClient ? readStates.read : readStates.received
-          }), payload)
+          }), {}, {
+            // We add a randomid to use as key for mapping of Events to avoid rerendering
+            key: randomId()
+          }, payload)
         })]
       });
 
@@ -18444,12 +18397,9 @@ const seamlyStateReducer = (state, action) => {
       const newFeaturesHasUpload = newFeatures.hasOwnProperty(featureKeys.uploads); // Only set uploads if it was initialised by the account config.
 
       if (newFeaturesHasUpload) {
-        const {
-          payload: lastParticipantEventPayload
-        } = lastParticipantEvent;
-        const {
-          type: entryType
-        } = lastParticipantEventPayload.entry || {};
+        var _lastParticipantEvent, _lastParticipantEvent2;
+
+        const entryType = lastParticipantEvent === null || lastParticipantEvent === void 0 ? void 0 : (_lastParticipantEvent = lastParticipantEvent.payload) === null || _lastParticipantEvent === void 0 ? void 0 : (_lastParticipantEvent2 = _lastParticipantEvent.entry) === null || _lastParticipantEvent2 === void 0 ? void 0 : _lastParticipantEvent2.type;
         newFeatures = seamly_utils_objectSpread(seamly_utils_objectSpread({}, newFeatures), {}, {
           uploads: {
             enabled: !!(uploads && uploads.enabled),
@@ -21163,21 +21113,6 @@ const useSeamlyCommands = () => {
       }
     });
   }, [dispatch]);
-  const sendInfo = hooks_module_A(_ref2 => {
-    let {
-      type,
-      subtype
-    } = _ref2;
-    const info = {
-      type,
-      subtype,
-      id: randomId(),
-      transactionId: randomId(),
-      participant: userParticipantId,
-      fromClient: true
-    };
-    api.send('info', info);
-  }, [api]);
   const sendAction = hooks_module_A(body => {
     if (!body) {
       return;
@@ -21220,7 +21155,6 @@ const useSeamlyCommands = () => {
     connect,
     start,
     sendMessage,
-    sendInfo,
     sendAction,
     sendContext,
     reset,
@@ -21992,13 +21926,13 @@ function useLocaleNativeName(locale) {
 
 
 
-function middleware_createMiddleware() {
-  return _ref => {
-    let {
-      dispatch,
-      getState
-    } = _ref;
-    return next => action => {
+function middleware_createMiddleware(_ref) {
+  let {
+    dispatch,
+    getState
+  } = _ref;
+  return next => {
+    return action => {
       var _action$history, _action$history$trans, _action$initialState, _action$initialState$, _action$event, _action$event$payload, _action$event$payload2;
 
       const result = next(action);
@@ -22007,6 +21941,7 @@ function middleware_createMiddleware() {
         case String(seamlyActions.SET_HISTORY):
           if ((_action$history = action.history) !== null && _action$history !== void 0 && (_action$history$trans = _action$history.translation) !== null && _action$history$trans !== void 0 && _action$history$trans.enabled) {
             dispatch(enable(action.history.translation.locale));
+            dispatch(setLocale(action.history.translation.locale));
           }
 
           break;
@@ -23719,17 +23654,16 @@ const SuggestionsList = _ref => {
 
 
 
-
 
 
 const Suggestions = _ref => {
   let {
-    isAside
+    isAside = false
   } = _ref;
   // generic hooks
   const {
-    layoutMode
-  } = useConfig();
+    isInline
+  } = useSeamlyLayoutMode();
   const {
     t
   } = useI18n();
@@ -23771,11 +23705,20 @@ const Suggestions = _ref => {
   const prevHasSuggestions = hooks_module_h(false);
   const previousRenderedSuggestions = hooks_module_h([]);
   const hasSuggestions = !!suggestions.length;
-  const hideSuggestions = layoutMode === 'inline' ? (hasResponded || isOpen) && !isAside : hasResponded;
+  const hideSuggestions = isInline ? (hasResponded || isOpen) && !isAside : hasResponded;
   const prevHideSuggestions = hooks_module_h(hideSuggestions);
   const showSuggestionsContainer = hasSuggestions && !hideSuggestions;
   const renderedSuggestions = hasSuggestions ? suggestions : previousRenderedSuggestions.current;
-  previousRenderedSuggestions.current = renderedSuggestions; // click handler
+  previousRenderedSuggestions.current = renderedSuggestions;
+  const suggestionsClassNames = hooks_module_(() => {
+    const classNames = ['suggestions'];
+
+    if (isAside) {
+      classNames.push('suggestions--aside');
+    }
+
+    return css_className(classNames);
+  }, [isAside]); // click handler
 
   const handleClick = hooks_module_A(_ref2 => {
     let {
@@ -23843,7 +23786,7 @@ const Suggestions = _ref => {
     isActive: showSuggestionsContainer,
     transitionStartState: transitionStartStates.notRendered,
     children: jsxRuntime_module_e(ContainerElement, {
-      className: css_className('suggestions'),
+      className: suggestionsClassNames,
       "aria-labelledby": headingText ? sectionId : null,
       ref: containerRef,
       children: [headingText && jsxRuntime_module_e("p", {
@@ -27392,6 +27335,37 @@ const ComponentFilter = _ref => {
 
 
 
+const Events = () => {
+  const events = useEvents();
+  let prevParticipant = null;
+  return map_default()(events).call(events, event => {
+    const {
+      type,
+      payload
+    } = event;
+    const {
+      participant,
+      fromClient
+    } = payload;
+    let participantChanged = false;
+
+    if (type !== 'participant') {
+      const currentParticipant = fromClient ? 'seamly-client-participant' : participant;
+
+      if (event.type !== 'info' && prevParticipant !== currentParticipant) {
+        participantChanged = true;
+      }
+
+      prevParticipant = currentParticipant;
+    }
+
+    return jsxRuntime_module_e(event_event, {
+      event: event,
+      newParticipant: participantChanged
+    }, event.payload.key || event.payload.id);
+  });
+};
+
 const Conversation = () => {
   const {
     t
@@ -27413,36 +27387,6 @@ const Conversation = () => {
     }
   }, [events, isLoading, isOpen, loadedImageEventIds]);
 
-  const renderEvents = () => {
-    let prevParticipant = null;
-    return map_default()(events).call(events, event => {
-      const {
-        type,
-        payload
-      } = event;
-      const {
-        participant,
-        fromClient
-      } = payload;
-      let participantChanged = false;
-
-      if (type !== 'participant') {
-        const currentParticipant = fromClient ? 'seamly-client-participant' : participant;
-
-        if (event.type !== 'info' && prevParticipant !== currentParticipant) {
-          participantChanged = true;
-        }
-
-        prevParticipant = currentParticipant;
-      }
-
-      return jsxRuntime_module_e(event_event, {
-        event: event,
-        newParticipant: participantChanged
-      }, event.payload.id);
-    });
-  };
-
   const onClickHandler = e => {
     e.preventDefault();
     focusSkiplinkTarget();
@@ -27462,7 +27406,7 @@ const Conversation = () => {
         children: [jsxRuntime_module_e(privacy_disclaimer, {}), jsxRuntime_module_e("ol", {
           className: css_className('conversation'),
           children: [jsxRuntime_module_e(component_filter, {
-            children: renderEvents()
+            children: jsxRuntime_module_e(Events, {})
           }), isLoading && jsxRuntime_module_e(loader, {})]
         })]
       })
@@ -30530,46 +30474,25 @@ function store(key) {
 // EXTERNAL MODULE: ./src/javascripts/lib/debug.js
 var debug = __webpack_require__(1905);
 var debug_default = /*#__PURE__*/__webpack_require__.n(debug);
-// EXTERNAL MODULE: ./node_modules/@babel/runtime-corejs3/core-js-stable/object/get-own-property-names.js
-var get_own_property_names = __webpack_require__(8604);
-;// CONCATENATED MODULE: ./node_modules/phoenix/priv/static/phoenix.esm.js
-
-
-
-
-
-
-
-
-
-
-
-
-
+;// CONCATENATED MODULE: ./node_modules/phoenix/priv/static/phoenix.mjs
 // js/phoenix/utils.js
-var closure = value => {
+var closure = (value) => {
   if (typeof value === "function") {
     return value;
   } else {
-    let closure2 = function () {
+    let closure2 = function() {
       return value;
     };
-
     return closure2;
   }
-}; // js/phoenix/constants.js
-
+};
 
+// js/phoenix/constants.js
 var globalSelf = typeof self !== "undefined" ? self : null;
 var phxWindow = typeof window !== "undefined" ? window : null;
-var global = globalSelf || phxWindow || void 0;
+var global = globalSelf || phxWindow || global;
 var DEFAULT_VSN = "2.0.0";
-var SOCKET_STATES = {
-  connecting: 0,
-  open: 1,
-  closing: 2,
-  closed: 3
-};
+var SOCKET_STATES = { connecting: 0, open: 1, closing: 2, closed: 3 };
 var DEFAULT_TIMEOUT = 1e4;
 var WS_CLOSE_NORMAL = 1e3;
 var CHANNEL_STATES = {
@@ -30592,35 +30515,31 @@ var TRANSPORTS = {
 };
 var XHR_STATES = {
   complete: 4
-}; // js/phoenix/push.js
+};
 
+// js/phoenix/push.js
 var Push = class {
   constructor(channel, event, payload, timeout) {
     this.channel = channel;
     this.event = event;
-
-    this.payload = payload || function () {
+    this.payload = payload || function() {
       return {};
     };
-
     this.receivedResp = null;
     this.timeout = timeout;
     this.timeoutTimer = null;
     this.recHooks = [];
     this.sent = false;
   }
-
   resend(timeout) {
     this.timeout = timeout;
     this.reset();
     this.send();
   }
-
   send() {
     if (this.hasReceived("timeout")) {
       return;
     }
-
     this.startTimeout();
     this.sent = true;
     this.channel.socket.push({
@@ -30631,19 +30550,13 @@ var Push = class {
       join_ref: this.channel.joinRef()
     });
   }
-
   receive(status, callback) {
     if (this.hasReceived(status)) {
       callback(this.receivedResp.response);
     }
-
-    this.recHooks.push({
-      status,
-      callback
-    });
+    this.recHooks.push({ status, callback });
     return this;
   }
-
   reset() {
     this.cancelRefEvent();
     this.ref = null;
@@ -30651,63 +30564,44 @@ var Push = class {
     this.receivedResp = null;
     this.sent = false;
   }
-
-  matchReceive(_ref2) {
-    var _context, _context2;
-
-    let {
-      status,
-      response,
-      _ref
-    } = _ref2;
-
-    for_each_default()(_context = filter_default()(_context2 = this.recHooks).call(_context2, h => h.status === status)).call(_context, h => h.callback(response));
+  matchReceive({ status, response, _ref }) {
+    this.recHooks.filter((h) => h.status === status).forEach((h) => h.callback(response));
   }
-
   cancelRefEvent() {
     if (!this.refEvent) {
       return;
     }
-
     this.channel.off(this.refEvent);
   }
-
   cancelTimeout() {
     clearTimeout(this.timeoutTimer);
     this.timeoutTimer = null;
   }
-
   startTimeout() {
     if (this.timeoutTimer) {
       this.cancelTimeout();
     }
-
     this.ref = this.channel.socket.makeRef();
     this.refEvent = this.channel.replyEventName(this.ref);
-    this.channel.on(this.refEvent, payload => {
+    this.channel.on(this.refEvent, (payload) => {
       this.cancelRefEvent();
       this.cancelTimeout();
       this.receivedResp = payload;
       this.matchReceive(payload);
     });
-    this.timeoutTimer = set_timeout_default()(() => {
+    this.timeoutTimer = setTimeout(() => {
       this.trigger("timeout", {});
     }, this.timeout);
   }
-
   hasReceived(status) {
     return this.receivedResp && this.receivedResp.status === status;
   }
-
   trigger(status, response) {
-    this.channel.trigger(this.refEvent, {
-      status,
-      response
-    });
+    this.channel.trigger(this.refEvent, { status, response });
   }
+};
 
-}; // js/phoenix/timer.js
-
+// js/phoenix/timer.js
 var Timer = class {
   constructor(callback, timerCalc) {
     this.callback = callback;
@@ -30715,22 +30609,20 @@ var Timer = class {
     this.timer = null;
     this.tries = 0;
   }
-
   reset() {
     this.tries = 0;
     clearTimeout(this.timer);
   }
-
   scheduleTimeout() {
     clearTimeout(this.timer);
-    this.timer = set_timeout_default()(() => {
+    this.timer = setTimeout(() => {
       this.tries = this.tries + 1;
       this.callback();
     }, this.timerCalc(this.tries + 1));
   }
+};
 
-}; // js/phoenix/channel.js
-
+// js/phoenix/channel.js
 var Channel = class {
   constructor(topic, params, socket) {
     this.state = CHANNEL_STATES.closed;
@@ -30752,54 +30644,47 @@ var Channel = class {
     this.stateChangeRefs.push(this.socket.onError(() => this.rejoinTimer.reset()));
     this.stateChangeRefs.push(this.socket.onOpen(() => {
       this.rejoinTimer.reset();
-
       if (this.isErrored()) {
         this.rejoin();
       }
     }));
     this.joinPush.receive("ok", () => {
-      var _context3;
-
       this.state = CHANNEL_STATES.joined;
       this.rejoinTimer.reset();
-
-      for_each_default()(_context3 = this.pushBuffer).call(_context3, pushEvent => pushEvent.send());
-
+      this.pushBuffer.forEach((pushEvent) => pushEvent.send());
       this.pushBuffer = [];
     });
     this.joinPush.receive("error", () => {
       this.state = CHANNEL_STATES.errored;
-
       if (this.socket.isConnected()) {
         this.rejoinTimer.scheduleTimeout();
       }
     });
     this.onClose(() => {
       this.rejoinTimer.reset();
-      if (this.socket.hasLogger()) this.socket.log("channel", `close ${this.topic} ${this.joinRef()}`);
+      if (this.socket.hasLogger())
+        this.socket.log("channel", `close ${this.topic} ${this.joinRef()}`);
       this.state = CHANNEL_STATES.closed;
       this.socket.remove(this);
     });
-    this.onError(reason => {
-      if (this.socket.hasLogger()) this.socket.log("channel", `error ${this.topic}`, reason);
-
+    this.onError((reason) => {
+      if (this.socket.hasLogger())
+        this.socket.log("channel", `error ${this.topic}`, reason);
       if (this.isJoining()) {
         this.joinPush.reset();
       }
-
       this.state = CHANNEL_STATES.errored;
-
       if (this.socket.isConnected()) {
         this.rejoinTimer.scheduleTimeout();
       }
     });
     this.joinPush.receive("timeout", () => {
-      if (this.socket.hasLogger()) this.socket.log("channel", `timeout ${this.topic} (${this.joinRef()})`, this.joinPush.timeout);
+      if (this.socket.hasLogger())
+        this.socket.log("channel", `timeout ${this.topic} (${this.joinRef()})`, this.joinPush.timeout);
       let leavePush = new Push(this, CHANNEL_EVENTS.leave, closure({}), this.timeout);
       leavePush.send();
       this.state = CHANNEL_STATES.errored;
       this.joinPush.reset();
-
       if (this.socket.isConnected()) {
         this.rejoinTimer.scheduleTimeout();
       }
@@ -30808,10 +30693,7 @@ var Channel = class {
       this.trigger(this.replyEventName(ref), payload);
     });
   }
-
-  join() {
-    let timeout = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.timeout;
-
+  join(timeout = this.timeout) {
     if (this.joinedOnce) {
       throw new Error("tried to join multiple times. 'join' can only be called a single time per channel instance");
     } else {
@@ -30821,219 +30703,162 @@ var Channel = class {
       return this.joinPush;
     }
   }
-
   onClose(callback) {
     this.on(CHANNEL_EVENTS.close, callback);
   }
-
   onError(callback) {
-    return this.on(CHANNEL_EVENTS.error, reason => callback(reason));
+    return this.on(CHANNEL_EVENTS.error, (reason) => callback(reason));
   }
-
   on(event, callback) {
     let ref = this.bindingRef++;
-    this.bindings.push({
-      event,
-      ref,
-      callback
-    });
+    this.bindings.push({ event, ref, callback });
     return ref;
   }
-
   off(event, ref) {
-    var _context4;
-
-    this.bindings = filter_default()(_context4 = this.bindings).call(_context4, bind => {
+    this.bindings = this.bindings.filter((bind) => {
       return !(bind.event === event && (typeof ref === "undefined" || ref === bind.ref));
     });
   }
-
   canPush() {
     return this.socket.isConnected() && this.isJoined();
   }
-
-  push(event, payload) {
-    let timeout = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : this.timeout;
+  push(event, payload, timeout = this.timeout) {
     payload = payload || {};
-
     if (!this.joinedOnce) {
       throw new Error(`tried to push '${event}' to '${this.topic}' before joining. Use channel.join() before pushing events`);
     }
-
-    let pushEvent = new Push(this, event, function () {
+    let pushEvent = new Push(this, event, function() {
       return payload;
     }, timeout);
-
     if (this.canPush()) {
       pushEvent.send();
     } else {
       pushEvent.startTimeout();
       this.pushBuffer.push(pushEvent);
     }
-
     return pushEvent;
   }
-
-  leave() {
-    let timeout = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.timeout;
+  leave(timeout = this.timeout) {
     this.rejoinTimer.reset();
     this.joinPush.cancelTimeout();
     this.state = CHANNEL_STATES.leaving;
-
     let onClose = () => {
-      if (this.socket.hasLogger()) this.socket.log("channel", `leave ${this.topic}`);
+      if (this.socket.hasLogger())
+        this.socket.log("channel", `leave ${this.topic}`);
       this.trigger(CHANNEL_EVENTS.close, "leave");
     };
-
     let leavePush = new Push(this, CHANNEL_EVENTS.leave, closure({}), timeout);
     leavePush.receive("ok", () => onClose()).receive("timeout", () => onClose());
     leavePush.send();
-
     if (!this.canPush()) {
       leavePush.trigger("ok", {});
     }
-
     return leavePush;
   }
-
   onMessage(_event, payload, _ref) {
     return payload;
   }
-
   isMember(topic, event, payload, joinRef) {
     if (this.topic !== topic) {
       return false;
     }
-
     if (joinRef && joinRef !== this.joinRef()) {
-      if (this.socket.hasLogger()) this.socket.log("channel", "dropping outdated message", {
-        topic,
-        event,
-        payload,
-        joinRef
-      });
+      if (this.socket.hasLogger())
+        this.socket.log("channel", "dropping outdated message", { topic, event, payload, joinRef });
       return false;
     } else {
       return true;
     }
   }
-
   joinRef() {
     return this.joinPush.ref;
   }
-
-  rejoin() {
-    let timeout = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.timeout;
-
+  rejoin(timeout = this.timeout) {
     if (this.isLeaving()) {
       return;
     }
-
     this.socket.leaveOpenTopic(this.topic);
     this.state = CHANNEL_STATES.joining;
     this.joinPush.resend(timeout);
   }
-
   trigger(event, payload, ref, joinRef) {
-    var _context5;
-
     let handledPayload = this.onMessage(event, payload, ref, joinRef);
-
     if (payload && !handledPayload) {
       throw new Error("channel onMessage callbacks must return the payload, modified or unmodified");
     }
-
-    let eventBindings = filter_default()(_context5 = this.bindings).call(_context5, bind => bind.event === event);
-
+    let eventBindings = this.bindings.filter((bind) => bind.event === event);
     for (let i = 0; i < eventBindings.length; i++) {
       let bind = eventBindings[i];
       bind.callback(handledPayload, ref, joinRef || this.joinRef());
     }
   }
-
   replyEventName(ref) {
     return `chan_reply_${ref}`;
   }
-
   isClosed() {
     return this.state === CHANNEL_STATES.closed;
   }
-
   isErrored() {
     return this.state === CHANNEL_STATES.errored;
   }
-
   isJoined() {
     return this.state === CHANNEL_STATES.joined;
   }
-
   isJoining() {
     return this.state === CHANNEL_STATES.joining;
   }
-
   isLeaving() {
     return this.state === CHANNEL_STATES.leaving;
   }
+};
 
-}; // js/phoenix/ajax.js
-
+// js/phoenix/ajax.js
 var Ajax = class {
   static request(method, endPoint, accept, body, timeout, ontimeout, callback) {
     if (global.XDomainRequest) {
       let req = new global.XDomainRequest();
-      this.xdomainRequest(req, method, endPoint, body, timeout, ontimeout, callback);
+      return this.xdomainRequest(req, method, endPoint, body, timeout, ontimeout, callback);
     } else {
       let req = new global.XMLHttpRequest();
-      this.xhrRequest(req, method, endPoint, accept, body, timeout, ontimeout, callback);
+      return this.xhrRequest(req, method, endPoint, accept, body, timeout, ontimeout, callback);
     }
   }
-
   static xdomainRequest(req, method, endPoint, body, timeout, ontimeout, callback) {
     req.timeout = timeout;
     req.open(method, endPoint);
-
     req.onload = () => {
       let response = this.parseJSON(req.responseText);
       callback && callback(response);
     };
-
     if (ontimeout) {
       req.ontimeout = ontimeout;
     }
-
-    req.onprogress = () => {};
-
+    req.onprogress = () => {
+    };
     req.send(body);
+    return req;
   }
-
   static xhrRequest(req, method, endPoint, accept, body, timeout, ontimeout, callback) {
     req.open(method, endPoint, true);
     req.timeout = timeout;
     req.setRequestHeader("Content-Type", accept);
-
-    req.onerror = () => {
-      callback && callback(null);
-    };
-
+    req.onerror = () => callback && callback(null);
     req.onreadystatechange = () => {
       if (req.readyState === XHR_STATES.complete && callback) {
         let response = this.parseJSON(req.responseText);
         callback(response);
       }
     };
-
     if (ontimeout) {
       req.ontimeout = ontimeout;
     }
-
     req.send(body);
+    return req;
   }
-
   static parseJSON(resp) {
     if (!resp || resp === "") {
       return null;
     }
-
     try {
       return JSON.parse(resp);
     } catch (e) {
@@ -31041,196 +30866,168 @@ var Ajax = class {
       return null;
     }
   }
-
   static serialize(obj, parentKey) {
     let queryStr = [];
-
     for (var key in obj) {
       if (!Object.prototype.hasOwnProperty.call(obj, key)) {
         continue;
       }
-
       let paramKey = parentKey ? `${parentKey}[${key}]` : key;
       let paramVal = obj[key];
-
       if (typeof paramVal === "object") {
         queryStr.push(this.serialize(paramVal, paramKey));
       } else {
         queryStr.push(encodeURIComponent(paramKey) + "=" + encodeURIComponent(paramVal));
       }
     }
-
     return queryStr.join("&");
   }
-
   static appendParams(url, params) {
-    if (keys_default()(params).length === 0) {
+    if (Object.keys(params).length === 0) {
       return url;
     }
-
     let prefix = url.match(/\?/) ? "&" : "?";
     return `${url}${prefix}${this.serialize(params)}`;
   }
+};
 
-}; // js/phoenix/longpoll.js
-
+// js/phoenix/longpoll.js
 var LongPoll = class {
   constructor(endPoint) {
     this.endPoint = null;
     this.token = null;
     this.skipHeartbeat = true;
-
-    this.onopen = function () {};
-
-    this.onerror = function () {};
-
-    this.onmessage = function () {};
-
-    this.onclose = function () {};
-
+    this.reqs = /* @__PURE__ */ new Set();
+    this.onopen = function() {
+    };
+    this.onerror = function() {
+    };
+    this.onmessage = function() {
+    };
+    this.onclose = function() {
+    };
     this.pollEndpoint = this.normalizeEndpoint(endPoint);
     this.readyState = SOCKET_STATES.connecting;
     this.poll();
   }
-
   normalizeEndpoint(endPoint) {
     return endPoint.replace("ws://", "http://").replace("wss://", "https://").replace(new RegExp("(.*)/" + TRANSPORTS.websocket), "$1/" + TRANSPORTS.longpoll);
   }
-
   endpointURL() {
-    return Ajax.appendParams(this.pollEndpoint, {
-      token: this.token
-    });
+    return Ajax.appendParams(this.pollEndpoint, { token: this.token });
   }
-
-  closeAndRetry() {
-    this.close();
+  closeAndRetry(code, reason, wasClean) {
+    this.close(code, reason, wasClean);
     this.readyState = SOCKET_STATES.connecting;
   }
-
   ontimeout() {
     this.onerror("timeout");
-    this.closeAndRetry();
+    this.closeAndRetry(1005, "timeout", false);
+  }
+  isActive() {
+    return this.readyState === SOCKET_STATES.open || this.readyState === SOCKET_STATES.connecting;
   }
-
   poll() {
-    var _context6;
-
-    if (!(this.readyState === SOCKET_STATES.open || this.readyState === SOCKET_STATES.connecting)) {
-      return;
-    }
-
-    Ajax.request("GET", this.endpointURL(), "application/json", null, this.timeout, bind_default()(_context6 = this.ontimeout).call(_context6, this), resp => {
+    this.ajax("GET", null, () => this.ontimeout(), (resp) => {
       if (resp) {
-        var {
-          status,
-          token,
-          messages
-        } = resp;
+        var { status, token, messages } = resp;
         this.token = token;
       } else {
         status = 0;
       }
-
       switch (status) {
         case 200:
-          for_each_default()(messages).call(messages, msg => {
-            set_timeout_default()(() => {
-              this.onmessage({
-                data: msg
-              });
-            }, 0);
+          messages.forEach((msg) => {
+            setTimeout(() => this.onmessage({ data: msg }), 0);
           });
-
           this.poll();
           break;
-
         case 204:
           this.poll();
           break;
-
         case 410:
           this.readyState = SOCKET_STATES.open;
-          this.onopen();
+          this.onopen({});
           this.poll();
           break;
-
         case 403:
-          this.onerror();
-          this.close();
+          this.onerror(403);
+          this.close(1008, "forbidden", false);
           break;
-
         case 0:
         case 500:
-          this.onerror();
-          this.closeAndRetry();
+          this.onerror(500);
+          this.closeAndRetry(1011, "internal server error", 500);
           break;
-
         default:
           throw new Error(`unhandled poll status ${status}`);
       }
     });
   }
-
   send(body) {
-    var _context7;
-
-    Ajax.request("POST", this.endpointURL(), "application/json", body, this.timeout, bind_default()(_context7 = this.onerror).call(_context7, this, "timeout"), resp => {
+    this.ajax("POST", body, () => this.onerror("timeout"), (resp) => {
       if (!resp || resp.status !== 200) {
         this.onerror(resp && resp.status);
-        this.closeAndRetry();
+        this.closeAndRetry(1011, "internal server error", false);
       }
     });
   }
-
-  close(_code, _reason) {
+  close(code, reason, wasClean) {
+    for (let req of this.reqs) {
+      req.abort();
+    }
     this.readyState = SOCKET_STATES.closed;
-    this.onclose();
+    let opts = Object.assign({ code: 1e3, reason: void 0, wasClean: true }, { code, reason, wasClean });
+    if (typeof CloseEvent !== "undefined") {
+      this.onclose(new CloseEvent("close", opts));
+    } else {
+      this.onclose(opts);
+    }
   }
-
-}; // js/phoenix/presence.js
-
-var Presence = class {
-  constructor(channel) {
-    let opts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-    let events = opts.events || {
-      state: "presence_state",
-      diff: "presence_diff"
+  ajax(method, body, onCallerTimeout, callback) {
+    let req;
+    let ontimeout = () => {
+      this.reqs.delete(req);
+      onCallerTimeout();
     };
+    req = Ajax.request(method, this.endpointURL(), "application/json", body, this.timeout, ontimeout, (resp) => {
+      this.reqs.delete(req);
+      if (this.isActive()) {
+        callback(resp);
+      }
+    });
+    this.reqs.add(req);
+  }
+};
+
+// js/phoenix/presence.js
+var Presence = class {
+  constructor(channel, opts = {}) {
+    let events = opts.events || { state: "presence_state", diff: "presence_diff" };
     this.state = {};
     this.pendingDiffs = [];
     this.channel = channel;
     this.joinRef = null;
     this.caller = {
-      onJoin: function () {},
-      onLeave: function () {},
-      onSync: function () {}
+      onJoin: function() {
+      },
+      onLeave: function() {
+      },
+      onSync: function() {
+      }
     };
-    this.channel.on(events.state, newState => {
-      var _context8;
-
-      let {
-        onJoin,
-        onLeave,
-        onSync
-      } = this.caller;
+    this.channel.on(events.state, (newState) => {
+      let { onJoin, onLeave, onSync } = this.caller;
       this.joinRef = this.channel.joinRef();
       this.state = Presence.syncState(this.state, newState, onJoin, onLeave);
-
-      _forEachInstanceProperty(_context8 = this.pendingDiffs).call(_context8, diff => {
+      this.pendingDiffs.forEach((diff) => {
         this.state = Presence.syncDiff(this.state, diff, onJoin, onLeave);
       });
-
       this.pendingDiffs = [];
       onSync();
     });
-    this.channel.on(events.diff, diff => {
-      let {
-        onJoin,
-        onLeave,
-        onSync
-      } = this.caller;
-
+    this.channel.on(events.diff, (diff) => {
+      let { onJoin, onLeave, onSync } = this.caller;
       if (this.inPendingSyncState()) {
         this.pendingDiffs.push(diff);
       } else {
@@ -31239,59 +31036,41 @@ var Presence = class {
       }
     });
   }
-
   onJoin(callback) {
     this.caller.onJoin = callback;
   }
-
   onLeave(callback) {
     this.caller.onLeave = callback;
   }
-
   onSync(callback) {
     this.caller.onSync = callback;
   }
-
   list(by) {
     return Presence.list(this.state, by);
   }
-
   inPendingSyncState() {
     return !this.joinRef || this.joinRef !== this.channel.joinRef();
   }
-
   static syncState(currentState, newState, onJoin, onLeave) {
-    var _context9, _context10;
-
     let state = this.clone(currentState);
     let joins = {};
     let leaves = {};
-
-    _mapInstanceProperty(_context9 = this).call(_context9, state, (key, presence) => {
+    this.map(state, (key, presence) => {
       if (!newState[key]) {
         leaves[key] = presence;
       }
     });
-
-    _mapInstanceProperty(_context10 = this).call(_context10, newState, (key, newPresence) => {
+    this.map(newState, (key, newPresence) => {
       let currentPresence = state[key];
-
       if (currentPresence) {
-        var _context11, _context12, _context13, _context14;
-
-        let newRefs = _mapInstanceProperty(_context11 = newPresence.metas).call(_context11, m => m.phx_ref);
-
-        let curRefs = _mapInstanceProperty(_context12 = currentPresence.metas).call(_context12, m => m.phx_ref);
-
-        let joinedMetas = _filterInstanceProperty(_context13 = newPresence.metas).call(_context13, m => _indexOfInstanceProperty(curRefs).call(curRefs, m.phx_ref) < 0);
-
-        let leftMetas = _filterInstanceProperty(_context14 = currentPresence.metas).call(_context14, m => _indexOfInstanceProperty(newRefs).call(newRefs, m.phx_ref) < 0);
-
+        let newRefs = newPresence.metas.map((m) => m.phx_ref);
+        let curRefs = currentPresence.metas.map((m) => m.phx_ref);
+        let joinedMetas = newPresence.metas.filter((m) => curRefs.indexOf(m.phx_ref) < 0);
+        let leftMetas = currentPresence.metas.filter((m) => newRefs.indexOf(m.phx_ref) < 0);
         if (joinedMetas.length > 0) {
           joins[key] = newPresence;
           joins[key].metas = joinedMetas;
         }
-
         if (leftMetas.length > 0) {
           leaves[key] = this.clone(currentPresence);
           leaves[key].metas = leftMetas;
@@ -31300,137 +31079,85 @@ var Presence = class {
         joins[key] = newPresence;
       }
     });
-
-    return this.syncDiff(state, {
-      joins,
-      leaves
-    }, onJoin, onLeave);
+    return this.syncDiff(state, { joins, leaves }, onJoin, onLeave);
   }
-
   static syncDiff(state, diff, onJoin, onLeave) {
-    var _context15, _context18;
-
-    let {
-      joins,
-      leaves
-    } = this.clone(diff);
-
+    let { joins, leaves } = this.clone(diff);
     if (!onJoin) {
-      onJoin = function () {};
+      onJoin = function() {
+      };
     }
-
     if (!onLeave) {
-      onLeave = function () {};
+      onLeave = function() {
+      };
     }
-
-    _mapInstanceProperty(_context15 = this).call(_context15, joins, (key, newPresence) => {
+    this.map(joins, (key, newPresence) => {
       let currentPresence = state[key];
       state[key] = this.clone(newPresence);
-
       if (currentPresence) {
-        var _context16, _context17;
-
-        let joinedRefs = _mapInstanceProperty(_context16 = state[key].metas).call(_context16, m => m.phx_ref);
-
-        let curMetas = _filterInstanceProperty(_context17 = currentPresence.metas).call(_context17, m => _indexOfInstanceProperty(joinedRefs).call(joinedRefs, m.phx_ref) < 0);
-
+        let joinedRefs = state[key].metas.map((m) => m.phx_ref);
+        let curMetas = currentPresence.metas.filter((m) => joinedRefs.indexOf(m.phx_ref) < 0);
         state[key].metas.unshift(...curMetas);
       }
-
       onJoin(key, currentPresence, newPresence);
     });
-
-    _mapInstanceProperty(_context18 = this).call(_context18, leaves, (key, leftPresence) => {
-      var _context19, _context20;
-
+    this.map(leaves, (key, leftPresence) => {
       let currentPresence = state[key];
-
       if (!currentPresence) {
         return;
       }
-
-      let refsToRemove = _mapInstanceProperty(_context19 = leftPresence.metas).call(_context19, m => m.phx_ref);
-
-      currentPresence.metas = _filterInstanceProperty(_context20 = currentPresence.metas).call(_context20, p => {
-        return _indexOfInstanceProperty(refsToRemove).call(refsToRemove, p.phx_ref) < 0;
+      let refsToRemove = leftPresence.metas.map((m) => m.phx_ref);
+      currentPresence.metas = currentPresence.metas.filter((p) => {
+        return refsToRemove.indexOf(p.phx_ref) < 0;
       });
       onLeave(key, currentPresence, leftPresence);
-
       if (currentPresence.metas.length === 0) {
         delete state[key];
       }
     });
-
     return state;
   }
-
   static list(presences, chooser) {
-    var _context21;
-
     if (!chooser) {
-      chooser = function (key, pres) {
+      chooser = function(key, pres) {
         return pres;
       };
     }
-
-    return _mapInstanceProperty(_context21 = this).call(_context21, presences, (key, presence) => {
+    return this.map(presences, (key, presence) => {
       return chooser(key, presence);
     });
   }
-
   static map(obj, func) {
-    var _context22;
-
-    return _mapInstanceProperty(_context22 = _Object$getOwnPropertyNames(obj)).call(_context22, key => func(key, obj[key]));
+    return Object.getOwnPropertyNames(obj).map((key) => func(key, obj[key]));
   }
-
   static clone(obj) {
-    return JSON.parse(_JSON$stringify(obj));
+    return JSON.parse(JSON.stringify(obj));
   }
+};
 
-}; // js/phoenix/serializer.js
-
+// js/phoenix/serializer.js
 var serializer_default = {
   HEADER_LENGTH: 1,
   META_LENGTH: 4,
-  KINDS: {
-    push: 0,
-    reply: 1,
-    broadcast: 2
-  },
-
+  KINDS: { push: 0, reply: 1, broadcast: 2 },
   encode(msg, callback) {
     if (msg.payload.constructor === ArrayBuffer) {
       return callback(this.binaryEncode(msg));
     } else {
       let payload = [msg.join_ref, msg.ref, msg.topic, msg.event, msg.payload];
-      return callback(stringify_default()(payload));
+      return callback(JSON.stringify(payload));
     }
   },
-
   decode(rawPayload, callback) {
     if (rawPayload.constructor === ArrayBuffer) {
       return callback(this.binaryDecode(rawPayload));
     } else {
       let [join_ref, ref, topic, event, payload] = JSON.parse(rawPayload);
-      return callback({
-        join_ref,
-        ref,
-        topic,
-        event,
-        payload
-      });
+      return callback({ join_ref, ref, topic, event, payload });
     }
   },
-
   binaryEncode(message) {
-    let {
-      join_ref,
-      ref,
-      event,
-      topic,
-      payload
-    } = message;
+    let { join_ref, ref, event, topic, payload } = message;
     let metaLength = this.META_LENGTH + join_ref.length + ref.length + topic.length + event.length;
     let header = new ArrayBuffer(this.HEADER_LENGTH + metaLength);
     let view = new DataView(header);
@@ -31440,136 +31167,88 @@ var serializer_default = {
     view.setUint8(offset++, ref.length);
     view.setUint8(offset++, topic.length);
     view.setUint8(offset++, event.length);
-
-    from_default()(join_ref, char => view.setUint8(offset++, char.charCodeAt(0)));
-
-    from_default()(ref, char => view.setUint8(offset++, char.charCodeAt(0)));
-
-    from_default()(topic, char => view.setUint8(offset++, char.charCodeAt(0)));
-
-    from_default()(event, char => view.setUint8(offset++, char.charCodeAt(0)));
-
+    Array.from(join_ref, (char) => view.setUint8(offset++, char.charCodeAt(0)));
+    Array.from(ref, (char) => view.setUint8(offset++, char.charCodeAt(0)));
+    Array.from(topic, (char) => view.setUint8(offset++, char.charCodeAt(0)));
+    Array.from(event, (char) => view.setUint8(offset++, char.charCodeAt(0)));
     var combined = new Uint8Array(header.byteLength + payload.byteLength);
     combined.set(new Uint8Array(header), 0);
     combined.set(new Uint8Array(payload), header.byteLength);
     return combined.buffer;
   },
-
   binaryDecode(buffer) {
     let view = new DataView(buffer);
     let kind = view.getUint8(0);
     let decoder = new TextDecoder();
-
     switch (kind) {
       case this.KINDS.push:
         return this.decodePush(buffer, view, decoder);
-
       case this.KINDS.reply:
         return this.decodeReply(buffer, view, decoder);
-
       case this.KINDS.broadcast:
         return this.decodeBroadcast(buffer, view, decoder);
     }
   },
-
   decodePush(buffer, view, decoder) {
     let joinRefSize = view.getUint8(1);
     let topicSize = view.getUint8(2);
     let eventSize = view.getUint8(3);
     let offset = this.HEADER_LENGTH + this.META_LENGTH - 1;
-    let joinRef = decoder.decode(slice_default()(buffer).call(buffer, offset, offset + joinRefSize));
+    let joinRef = decoder.decode(buffer.slice(offset, offset + joinRefSize));
     offset = offset + joinRefSize;
-    let topic = decoder.decode(slice_default()(buffer).call(buffer, offset, offset + topicSize));
+    let topic = decoder.decode(buffer.slice(offset, offset + topicSize));
     offset = offset + topicSize;
-    let event = decoder.decode(slice_default()(buffer).call(buffer, offset, offset + eventSize));
+    let event = decoder.decode(buffer.slice(offset, offset + eventSize));
     offset = offset + eventSize;
-
-    let data = slice_default()(buffer).call(buffer, offset, buffer.byteLength);
-
-    return {
-      join_ref: joinRef,
-      ref: null,
-      topic,
-      event,
-      payload: data
-    };
+    let data = buffer.slice(offset, buffer.byteLength);
+    return { join_ref: joinRef, ref: null, topic, event, payload: data };
   },
-
   decodeReply(buffer, view, decoder) {
     let joinRefSize = view.getUint8(1);
     let refSize = view.getUint8(2);
     let topicSize = view.getUint8(3);
     let eventSize = view.getUint8(4);
     let offset = this.HEADER_LENGTH + this.META_LENGTH;
-    let joinRef = decoder.decode(slice_default()(buffer).call(buffer, offset, offset + joinRefSize));
+    let joinRef = decoder.decode(buffer.slice(offset, offset + joinRefSize));
     offset = offset + joinRefSize;
-    let ref = decoder.decode(slice_default()(buffer).call(buffer, offset, offset + refSize));
+    let ref = decoder.decode(buffer.slice(offset, offset + refSize));
     offset = offset + refSize;
-    let topic = decoder.decode(slice_default()(buffer).call(buffer, offset, offset + topicSize));
+    let topic = decoder.decode(buffer.slice(offset, offset + topicSize));
     offset = offset + topicSize;
-    let event = decoder.decode(slice_default()(buffer).call(buffer, offset, offset + eventSize));
+    let event = decoder.decode(buffer.slice(offset, offset + eventSize));
     offset = offset + eventSize;
-
-    let data = slice_default()(buffer).call(buffer, offset, buffer.byteLength);
-
-    let payload = {
-      status: event,
-      response: data
-    };
-    return {
-      join_ref: joinRef,
-      ref,
-      topic,
-      event: CHANNEL_EVENTS.reply,
-      payload
-    };
+    let data = buffer.slice(offset, buffer.byteLength);
+    let payload = { status: event, response: data };
+    return { join_ref: joinRef, ref, topic, event: CHANNEL_EVENTS.reply, payload };
   },
-
   decodeBroadcast(buffer, view, decoder) {
     let topicSize = view.getUint8(1);
     let eventSize = view.getUint8(2);
     let offset = this.HEADER_LENGTH + 2;
-    let topic = decoder.decode(slice_default()(buffer).call(buffer, offset, offset + topicSize));
+    let topic = decoder.decode(buffer.slice(offset, offset + topicSize));
     offset = offset + topicSize;
-    let event = decoder.decode(slice_default()(buffer).call(buffer, offset, offset + eventSize));
+    let event = decoder.decode(buffer.slice(offset, offset + eventSize));
     offset = offset + eventSize;
-
-    let data = slice_default()(buffer).call(buffer, offset, buffer.byteLength);
-
-    return {
-      join_ref: null,
-      ref: null,
-      topic,
-      event,
-      payload: data
-    };
+    let data = buffer.slice(offset, buffer.byteLength);
+    return { join_ref: null, ref: null, topic, event, payload: data };
   }
+};
 
-}; // js/phoenix/socket.js
-
+// js/phoenix/socket.js
 var Socket = class {
-  constructor(endPoint) {
-    var _context23, _context24;
-
-    let opts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-    this.stateChangeCallbacks = {
-      open: [],
-      close: [],
-      error: [],
-      message: []
-    };
+  constructor(endPoint, opts = {}) {
+    this.stateChangeCallbacks = { open: [], close: [], error: [], message: [] };
     this.channels = [];
     this.sendBuffer = [];
     this.ref = 0;
     this.timeout = opts.timeout || DEFAULT_TIMEOUT;
     this.transport = opts.transport || global.WebSocket || LongPoll;
     this.establishedConnections = 0;
-    this.defaultEncoder = bind_default()(_context23 = serializer_default.encode).call(_context23, serializer_default);
-    this.defaultDecoder = bind_default()(_context24 = serializer_default.decode).call(_context24, serializer_default);
+    this.defaultEncoder = serializer_default.encode.bind(serializer_default);
+    this.defaultDecoder = serializer_default.decode.bind(serializer_default);
     this.closeWasClean = false;
     this.binaryType = opts.binaryType || "arraybuffer";
     this.connectClock = 1;
-
     if (this.transport !== LongPoll) {
       this.encode = opts.encode || this.defaultEncoder;
       this.decode = opts.decode || this.defaultDecoder;
@@ -31577,42 +31256,36 @@ var Socket = class {
       this.encode = this.defaultEncoder;
       this.decode = this.defaultDecoder;
     }
-
     let awaitingConnectionOnPageShow = null;
-
     if (phxWindow && phxWindow.addEventListener) {
-      phxWindow.addEventListener("pagehide", _e => {
+      phxWindow.addEventListener("pagehide", (_e) => {
         if (this.conn) {
           this.disconnect();
           awaitingConnectionOnPageShow = this.connectClock;
         }
       });
-      phxWindow.addEventListener("pageshow", _e => {
+      phxWindow.addEventListener("pageshow", (_e) => {
         if (awaitingConnectionOnPageShow === this.connectClock) {
           awaitingConnectionOnPageShow = null;
           this.connect();
         }
       });
     }
-
     this.heartbeatIntervalMs = opts.heartbeatIntervalMs || 3e4;
-
-    this.rejoinAfterMs = tries => {
+    this.rejoinAfterMs = (tries) => {
       if (opts.rejoinAfterMs) {
         return opts.rejoinAfterMs(tries);
       } else {
         return [1e3, 2e3, 5e3][tries - 1] || 1e4;
       }
     };
-
-    this.reconnectAfterMs = tries => {
+    this.reconnectAfterMs = (tries) => {
       if (opts.reconnectAfterMs) {
         return opts.reconnectAfterMs(tries);
       } else {
         return [10, 50, 100, 150, 200, 250, 500, 1e3, 2e3][tries - 1] || 5e3;
       }
     };
-
     this.logger = opts.logger || null;
     this.longpollerTimeout = opts.longpollerTimeout || 2e4;
     this.params = closure(opts.params || {});
@@ -31624,141 +31297,129 @@ var Socket = class {
       this.teardown(() => this.connect());
     }, this.reconnectAfterMs);
   }
-
+  getLongPollTransport() {
+    return LongPoll;
+  }
   replaceTransport(newTransport) {
-    this.disconnect();
+    this.connectClock++;
+    this.closeWasClean = true;
+    this.reconnectTimer.reset();
+    this.sendBuffer = [];
+    if (this.conn) {
+      this.conn.close();
+      this.conn = null;
+    }
     this.transport = newTransport;
   }
-
   protocol() {
     return location.protocol.match(/^https/) ? "wss" : "ws";
   }
-
   endPointURL() {
-    let uri = Ajax.appendParams(Ajax.appendParams(this.endPoint, this.params()), {
-      vsn: this.vsn
-    });
-
+    let uri = Ajax.appendParams(Ajax.appendParams(this.endPoint, this.params()), { vsn: this.vsn });
     if (uri.charAt(0) !== "/") {
       return uri;
     }
-
     if (uri.charAt(1) === "/") {
       return `${this.protocol()}:${uri}`;
     }
-
     return `${this.protocol()}://${location.host}${uri}`;
   }
-
   disconnect(callback, code, reason) {
     this.connectClock++;
     this.closeWasClean = true;
     this.reconnectTimer.reset();
     this.teardown(callback, code, reason);
   }
-
   connect(params) {
-    this.connectClock++;
-
     if (params) {
       console && console.log("passing params to connect is deprecated. Instead pass :params to the Socket constructor");
       this.params = closure(params);
     }
-
     if (this.conn) {
       return;
     }
-
+    this.connectClock++;
     this.closeWasClean = false;
     this.conn = new this.transport(this.endPointURL());
     this.conn.binaryType = this.binaryType;
     this.conn.timeout = this.longpollerTimeout;
-
     this.conn.onopen = () => this.onConnOpen();
-
-    this.conn.onerror = error => this.onConnError(error);
-
-    this.conn.onmessage = event => this.onConnMessage(event);
-
-    this.conn.onclose = event => this.onConnClose(event);
+    this.conn.onerror = (error) => this.onConnError(error);
+    this.conn.onmessage = (event) => this.onConnMessage(event);
+    this.conn.onclose = (event) => this.onConnClose(event);
   }
-
   log(kind, msg, data) {
     this.logger(kind, msg, data);
   }
-
   hasLogger() {
     return this.logger !== null;
   }
-
   onOpen(callback) {
     let ref = this.makeRef();
     this.stateChangeCallbacks.open.push([ref, callback]);
     return ref;
   }
-
   onClose(callback) {
     let ref = this.makeRef();
     this.stateChangeCallbacks.close.push([ref, callback]);
     return ref;
   }
-
   onError(callback) {
     let ref = this.makeRef();
     this.stateChangeCallbacks.error.push([ref, callback]);
     return ref;
   }
-
   onMessage(callback) {
     let ref = this.makeRef();
     this.stateChangeCallbacks.message.push([ref, callback]);
     return ref;
   }
-
+  ping(callback) {
+    if (!this.isConnected()) {
+      return false;
+    }
+    let ref = this.makeRef();
+    let startTime = Date.now();
+    this.push({ topic: "phoenix", event: "heartbeat", payload: {}, ref });
+    let onMsgRef = this.onMessage((msg) => {
+      if (msg.ref === ref) {
+        this.off([onMsgRef]);
+        callback(Date.now() - startTime);
+      }
+    });
+    return true;
+  }
   onConnOpen() {
-    var _context25;
-
-    if (this.hasLogger()) this.log("transport", `connected to ${this.endPointURL()}`);
+    if (this.hasLogger())
+      this.log("transport", `connected to ${this.endPointURL()}`);
     this.closeWasClean = false;
     this.establishedConnections++;
     this.flushSendBuffer();
     this.reconnectTimer.reset();
     this.resetHeartbeat();
-
-    for_each_default()(_context25 = this.stateChangeCallbacks.open).call(_context25, _ref3 => {
-      let [, callback] = _ref3;
-      return callback();
-    });
+    this.stateChangeCallbacks.open.forEach(([, callback]) => callback());
   }
-
   heartbeatTimeout() {
     if (this.pendingHeartbeatRef) {
       this.pendingHeartbeatRef = null;
-
       if (this.hasLogger()) {
         this.log("transport", "heartbeat timeout. Attempting to re-establish connection");
       }
-
       this.abnormalClose("heartbeat timeout");
     }
   }
-
   resetHeartbeat() {
     if (this.conn && this.conn.skipHeartbeat) {
       return;
     }
-
     this.pendingHeartbeatRef = null;
     clearTimeout(this.heartbeatTimer);
-
-    set_timeout_default()(() => this.sendHeartbeat(), this.heartbeatIntervalMs);
+    setTimeout(() => this.sendHeartbeat(), this.heartbeatIntervalMs);
   }
-
   teardown(callback, code, reason) {
     if (!this.conn) {
       return callback && callback();
     }
-
     this.waitForBufferDone(() => {
       if (this.conn) {
         if (code) {
@@ -31767,248 +31428,170 @@ var Socket = class {
           this.conn.close();
         }
       }
-
       this.waitForSocketClosed(() => {
         if (this.conn) {
-          this.conn.onclose = function () {};
-
+          this.conn.onclose = function() {
+          };
           this.conn = null;
         }
-
         callback && callback();
       });
     });
   }
-
-  waitForBufferDone(callback) {
-    let tries = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 1;
-
+  waitForBufferDone(callback, tries = 1) {
     if (tries === 5 || !this.conn || !this.conn.bufferedAmount) {
       callback();
       return;
     }
-
-    set_timeout_default()(() => {
+    setTimeout(() => {
       this.waitForBufferDone(callback, tries + 1);
     }, 150 * tries);
   }
-
-  waitForSocketClosed(callback) {
-    let tries = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 1;
-
+  waitForSocketClosed(callback, tries = 1) {
     if (tries === 5 || !this.conn || this.conn.readyState === SOCKET_STATES.closed) {
       callback();
       return;
     }
-
-    set_timeout_default()(() => {
+    setTimeout(() => {
       this.waitForSocketClosed(callback, tries + 1);
     }, 150 * tries);
   }
-
   onConnClose(event) {
-    var _context26;
-
     let closeCode = event && event.code;
-    if (this.hasLogger()) this.log("transport", "close", event);
+    if (this.hasLogger())
+      this.log("transport", "close", event);
     this.triggerChanError();
     clearTimeout(this.heartbeatTimer);
-
     if (!this.closeWasClean && closeCode !== 1e3) {
       this.reconnectTimer.scheduleTimeout();
     }
-
-    for_each_default()(_context26 = this.stateChangeCallbacks.close).call(_context26, _ref4 => {
-      let [, callback] = _ref4;
-      return callback(event);
-    });
+    this.stateChangeCallbacks.close.forEach(([, callback]) => callback(event));
   }
-
   onConnError(error) {
-    var _context27;
-
-    if (this.hasLogger()) this.log("transport", error);
+    if (this.hasLogger())
+      this.log("transport", error);
     let transportBefore = this.transport;
     let establishedBefore = this.establishedConnections;
-
-    for_each_default()(_context27 = this.stateChangeCallbacks.error).call(_context27, _ref5 => {
-      let [, callback] = _ref5;
+    this.stateChangeCallbacks.error.forEach(([, callback]) => {
       callback(error, transportBefore, establishedBefore);
     });
-
     if (transportBefore === this.transport || establishedBefore > 0) {
       this.triggerChanError();
     }
   }
-
   triggerChanError() {
-    var _context28;
-
-    for_each_default()(_context28 = this.channels).call(_context28, channel => {
+    this.channels.forEach((channel) => {
       if (!(channel.isErrored() || channel.isLeaving() || channel.isClosed())) {
         channel.trigger(CHANNEL_EVENTS.error);
       }
     });
   }
-
   connectionState() {
     switch (this.conn && this.conn.readyState) {
       case SOCKET_STATES.connecting:
         return "connecting";
-
       case SOCKET_STATES.open:
         return "open";
-
       case SOCKET_STATES.closing:
         return "closing";
-
       default:
         return "closed";
     }
   }
-
   isConnected() {
     return this.connectionState() === "open";
   }
-
   remove(channel) {
-    var _context29;
-
     this.off(channel.stateChangeRefs);
-    this.channels = filter_default()(_context29 = this.channels).call(_context29, c => c.joinRef() !== channel.joinRef());
+    this.channels = this.channels.filter((c) => c.joinRef() !== channel.joinRef());
   }
-
   off(refs) {
     for (let key in this.stateChangeCallbacks) {
-      var _context30;
-
-      this.stateChangeCallbacks[key] = filter_default()(_context30 = this.stateChangeCallbacks[key]).call(_context30, _ref6 => {
-        let [ref] = _ref6;
-        return instance_index_of_default()(refs).call(refs, ref) === -1;
+      this.stateChangeCallbacks[key] = this.stateChangeCallbacks[key].filter(([ref]) => {
+        return refs.indexOf(ref) === -1;
       });
     }
   }
-
-  channel(topic) {
-    let chanParams = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+  channel(topic, chanParams = {}) {
     let chan = new Channel(topic, chanParams, this);
     this.channels.push(chan);
     return chan;
   }
-
   push(data) {
     if (this.hasLogger()) {
-      let {
-        topic,
-        event,
-        payload,
-        ref,
-        join_ref
-      } = data;
+      let { topic, event, payload, ref, join_ref } = data;
       this.log("push", `${topic} ${event} (${join_ref}, ${ref})`, payload);
     }
-
     if (this.isConnected()) {
-      this.encode(data, result => this.conn.send(result));
+      this.encode(data, (result) => this.conn.send(result));
     } else {
-      this.sendBuffer.push(() => this.encode(data, result => this.conn.send(result)));
+      this.sendBuffer.push(() => this.encode(data, (result) => this.conn.send(result)));
     }
   }
-
   makeRef() {
     let newRef = this.ref + 1;
-
     if (newRef === this.ref) {
       this.ref = 0;
     } else {
       this.ref = newRef;
     }
-
     return this.ref.toString();
   }
-
   sendHeartbeat() {
     if (this.pendingHeartbeatRef && !this.isConnected()) {
       return;
     }
-
     this.pendingHeartbeatRef = this.makeRef();
-    this.push({
-      topic: "phoenix",
-      event: "heartbeat",
-      payload: {},
-      ref: this.pendingHeartbeatRef
-    });
-    this.heartbeatTimer = set_timeout_default()(() => this.heartbeatTimeout(), this.heartbeatIntervalMs);
+    this.push({ topic: "phoenix", event: "heartbeat", payload: {}, ref: this.pendingHeartbeatRef });
+    this.heartbeatTimer = setTimeout(() => this.heartbeatTimeout(), this.heartbeatIntervalMs);
   }
-
   abnormalClose(reason) {
     this.closeWasClean = false;
-
     if (this.isConnected()) {
       this.conn.close(WS_CLOSE_NORMAL, reason);
     }
   }
-
   flushSendBuffer() {
     if (this.isConnected() && this.sendBuffer.length > 0) {
-      var _context31;
-
-      for_each_default()(_context31 = this.sendBuffer).call(_context31, callback => callback());
-
+      this.sendBuffer.forEach((callback) => callback());
       this.sendBuffer = [];
     }
   }
-
   onConnMessage(rawMessage) {
-    this.decode(rawMessage.data, msg => {
-      let {
-        topic,
-        event,
-        payload,
-        ref,
-        join_ref
-      } = msg;
-
+    this.decode(rawMessage.data, (msg) => {
+      let { topic, event, payload, ref, join_ref } = msg;
       if (ref && ref === this.pendingHeartbeatRef) {
         clearTimeout(this.heartbeatTimer);
         this.pendingHeartbeatRef = null;
-
-        set_timeout_default()(() => this.sendHeartbeat(), this.heartbeatIntervalMs);
+        setTimeout(() => this.sendHeartbeat(), this.heartbeatIntervalMs);
       }
-
-      if (this.hasLogger()) this.log("receive", `${payload.status || ""} ${topic} ${event} ${ref && "(" + ref + ")" || ""}`, payload);
-
+      if (this.hasLogger())
+        this.log("receive", `${payload.status || ""} ${topic} ${event} ${ref && "(" + ref + ")" || ""}`, payload);
       for (let i = 0; i < this.channels.length; i++) {
         const channel = this.channels[i];
-
         if (!channel.isMember(topic, event, payload, join_ref)) {
           continue;
         }
-
         channel.trigger(event, payload, ref, join_ref);
       }
-
       for (let i = 0; i < this.stateChangeCallbacks.message.length; i++) {
         let [, callback] = this.stateChangeCallbacks.message[i];
         callback(msg);
       }
     });
   }
-
   leaveOpenTopic(topic) {
-    var _context32;
-
-    let dupChannel = find_default()(_context32 = this.channels).call(_context32, c => c.topic === topic && (c.isJoined() || c.isJoining()));
-
+    let dupChannel = this.channels.find((c) => c.topic === topic && (c.isJoined() || c.isJoining()));
     if (dupChannel) {
-      if (this.hasLogger()) this.log("transport", `leaving duplicate topic "${topic}"`);
+      if (this.hasLogger())
+        this.log("transport", `leaving duplicate topic "${topic}"`);
       dupChannel.leave();
     }
   }
-
 };
 
+//# sourceMappingURL=phoenix.mjs.map
+
 ;// CONCATENATED MODULE: ./src/javascripts/lib/split-url-params.js
 
 
@@ -32759,7 +32342,7 @@ class API {
     return {
       clientName: "@seamly/web-ui",
       clientVariant: this.layoutMode,
-      clientVersion: "20.5.0",
+      clientVersion: "20.7.0",
       currentUrl: window.location.toString(),
       screenResolution: `${window.screen.width}x${window.screen.height}`,
       timezone: getTimeZone(),
@@ -32768,39 +32351,6 @@ class API {
   }
 
 }
-;// CONCATENATED MODULE: ./node_modules/redux-thunk/es/index.js
-/** A function that accepts a potential "extra argument" value to be injected later,
- * and returns an instance of the thunk middleware that uses that value
- */
-function createThunkMiddleware(extraArgument) {
-  // Standard Redux middleware definition pattern:
-  // See: https://redux.js.org/tutorials/fundamentals/part-4-store#writing-custom-middleware
-  var middleware = function middleware(_ref) {
-    var dispatch = _ref.dispatch,
-        getState = _ref.getState;
-    return function (next) {
-      return function (action) {
-        // The thunk middleware looks for any functions that were passed to `store.dispatch`.
-        // If this "action" is really a function, call it and return the result.
-        if (typeof action === 'function') {
-          // Inject the store's `dispatch` and `getState` methods, as well as any "extra arg"
-          return action(dispatch, getState, extraArgument);
-        } // Otherwise, pass the action down the middleware chain as usual
-
-
-        return next(action);
-      };
-    };
-  };
-
-  return middleware;
-}
-
-var thunk = createThunkMiddleware(); // Attach the factory function so users can create a customized version
-// with whatever "extra arg" they want to inject into their thunks
-
-thunk.withExtraArgument = createThunkMiddleware;
-/* harmony default export */ var es = (thunk);
 ;// CONCATENATED MODULE: ./src/javascripts/domains/options/middleware.js
 
 
@@ -32841,6 +32391,39 @@ function options_middleware_createMiddleware(_ref) {
 }
 ;// CONCATENATED MODULE: ./src/javascripts/domains/options/index.js
 
+;// CONCATENATED MODULE: ./node_modules/redux-thunk/es/index.js
+/** A function that accepts a potential "extra argument" value to be injected later,
+ * and returns an instance of the thunk middleware that uses that value
+ */
+function createThunkMiddleware(extraArgument) {
+  // Standard Redux middleware definition pattern:
+  // See: https://redux.js.org/tutorials/fundamentals/part-4-store#writing-custom-middleware
+  var middleware = function middleware(_ref) {
+    var dispatch = _ref.dispatch,
+        getState = _ref.getState;
+    return function (next) {
+      return function (action) {
+        // The thunk middleware looks for any functions that were passed to `store.dispatch`.
+        // If this "action" is really a function, call it and return the result.
+        if (typeof action === 'function') {
+          // Inject the store's `dispatch` and `getState` methods, as well as any "extra arg"
+          return action(dispatch, getState, extraArgument);
+        } // Otherwise, pass the action down the middleware chain as usual
+
+
+        return next(action);
+      };
+    };
+  };
+
+  return middleware;
+}
+
+var thunk = createThunkMiddleware(); // Attach the factory function so users can create a customized version
+// with whatever "extra arg" they want to inject into their thunks
+
+thunk.withExtraArgument = createThunkMiddleware;
+/* harmony default export */ var es = (thunk);
 ;// CONCATENATED MODULE: ./src/javascripts/domains/store/state-reducer.js
 // Legacy state reducer. Do not add new features here but extract/create new reducers as needed
 
@@ -32943,7 +32526,7 @@ function store_createStore() {
       api
     }), options_middleware_createMiddleware({
       api
-    }), middleware_createMiddleware()]
+    }), middleware_createMiddleware]
   });
   return store;
 }