@pepperdash/mobile-control-react-app-core 1.22.11-socket-connection-issues.2 → 1.23.0-ci-updates.1

package/dist/mobile-control-react-app-core.es.js

@@ -3,8 +3,8 @@ var m2 = (e, t, o) => t in e ? w2(e, t, { enumerable: !0, configurable: !0, writ
 var q = (e, t, o) => m2(e, typeof t != "symbol" ? t + "" : t, o);
 import M3, { AxiosError as p2 } from "axios";
 import { useDispatch as M2, useSelector as x2, Provider as Z2 } from "react-redux";
-import { createSelector as M, createSlice as u1, combineReducers as S2, configureStore as j2 } from "@reduxjs/toolkit";
-import x3, { createContext as C2, useEffect as x1, useCallback as r1, useContext as b2, useRef as M1, useMemo as n1, useState as Y, useLayoutEffect as Z3 } from "react";
+import { createSelector as M, createSlice as d1, combineReducers as S2, configureStore as j2 } from "@reduxjs/toolkit";
+import x3, { createContext as C2, useEffect as x1, useCallback as r1, useContext as b2, useRef as u1, useMemo as n1, useState as Y, useLayoutEffect as Z3 } from "react";
 import { useNavigate as y2, useRouteError as I2, isRouteErrorResponse as R2 } from "react-router-dom";
 import * as S3 from "lodash";
 const W1 = M2.withTypes(), m = x2.withTypes(), Z1 = (e) => e.appConfig, E2 = M(
@@ -22,111 +22,111 @@ const W1 = M2.withTypes(), m = x2.withTypes(), Z1 = (e) => e.appConfig, E2 = M(
 ), X8 = () => m(E2), Q8 = () => m(T2), N8 = () => m(D2), e6 = () => m(_2), j3 = (e) => e.devices, C3 = M(
   j3,
   (e) => e
-), P2 = (e) => M(
+), L2 = (e) => M(
   j3,
   (t) => t[e] ? t[e] : void 0
 ), t6 = () => m(C3);
 function _(e) {
-  return m(P2(e));
+  return m(L2(e));
 }
-const A = (e) => e.rooms, L2 = (e) => M(
-  A,
+const $ = (e) => e.rooms, P2 = (e) => M(
+  $,
   (t) => t[e] ? t[e].configuration : void 0
-), $2 = M(
-  A,
+), A2 = M(
+  $,
   (e) => e
-), A2 = (e) => M(
-  A,
+), $2 = (e) => M(
+  $,
   (t) => t[e] ? t[e] : void 0
-), B2 = (e) => M(
-  A,
+), k2 = (e) => M(
+  $,
   (t) => t[e] ? t[e].name : void 0
-), k2 = (e, t) => M(
-  A,
+), B2 = (e, t) => M(
+  $,
   (o) => o[e] ? o[e].volumes[t] : void 0
 ), O2 = (e) => M(
-  A,
+  $,
   (t) => t[e] ? t[e] : void 0
 ), W2 = (e) => M(
-  A,
+  $,
   (t) => {
     var o, c;
     return t[e] ? (c = (o = t[e]) == null ? void 0 : o.configuration) == null ? void 0 : c.sourceList : void 0;
   }
 ), V2 = (e) => M(
-  A,
+  $,
   (t) => {
     var o, c;
     return t[e] ? (c = (o = t[e]) == null ? void 0 : o.configuration) == null ? void 0 : c.audioControlPointList : void 0;
   }
 ), U2 = (e) => M(
-  A,
+  $,
   (t) => {
     var o, c;
     return t[e] ? (c = (o = t[e]) == null ? void 0 : o.configuration) == null ? void 0 : c.destinations : void 0;
   }
-), H2 = (e) => M(
-  A,
+), F2 = (e) => M(
+  $,
   (t) => {
     var o, c;
     return t[e] ? (c = (o = t[e]) == null ? void 0 : o.configuration) == null ? void 0 : c.destinationList : void 0;
   }
-), F2 = (e) => M(
-  A,
+), H2 = (e) => M(
+  $,
   (t) => {
     var o, c;
     return t[e] ? (c = (o = t[e]) == null ? void 0 : o.configuration) == null ? void 0 : c.environmentalDevices : void 0;
   }
 ), K2 = (e) => M(
-  A,
+  $,
   (t) => {
-    var o, c, r, l, v, f, h, w;
-    return (c = (o = t[e]) == null ? void 0 : o.configuration) != null && c.destinationList.programAudio ? (v = (l = (r = t[e]) == null ? void 0 : r.configuration) == null ? void 0 : l.destinationList.programAudio) == null ? void 0 : v.sinkKey : ((w = (h = (f = t[e]) == null ? void 0 : f.configuration) == null ? void 0 : h.destinationList.defaultDisplay) == null ? void 0 : w.sinkKey) || "";
+    var o, c, r, l, v, g, h, f;
+    return (c = (o = t[e]) == null ? void 0 : o.configuration) != null && c.destinationList.programAudio ? (v = (l = (r = t[e]) == null ? void 0 : r.configuration) == null ? void 0 : l.destinationList.programAudio) == null ? void 0 : v.sinkKey : ((f = (h = (g = t[e]) == null ? void 0 : g.configuration) == null ? void 0 : h.destinationList.defaultDisplay) == null ? void 0 : f.sinkKey) || "";
   }
 ), q2 = (e) => M(
-  A,
+  $,
   (t) => {
     var o, c, r;
     return t[e] ? (r = (c = (o = t[e]) == null ? void 0 : o.configuration) == null ? void 0 : c.destinationList.codecContent) == null ? void 0 : r.sinkKey : void 0;
   }
 ), G2 = (e) => M(
-  A,
+  $,
   (t) => {
     var o;
     return t[e] ? (o = t[e]) == null ? void 0 : o.isInCall : void 0;
   }
 ), Y2 = (e) => M(
-  A,
+  $,
   (t) => {
     var o;
     return t[e] ? (o = t[e]) == null ? void 0 : o.isWarmingUp : void 0;
   }
 ), z2 = (e) => M(
-  A,
+  $,
   (t) => {
     var o;
     return t[e] ? (o = t[e]) == null ? void 0 : o.isCoolingDown : void 0;
   }
 ), J2 = (e) => M(
-  A,
+  $,
   (t) => {
     var o;
     return t[e] ? (o = t[e]) == null ? void 0 : o.isOn : void 0;
   }
 ), X2 = (e) => M(
-  A,
+  $,
   (t) => {
     var o;
     return t[e] ? (o = t[e]) == null ? void 0 : o.advancedSharingActive : void 0;
   }
 ), Q2 = (e) => M(
-  A,
+  $,
   (t) => {
     var o;
     return t[e] ? (o = t[e]) == null ? void 0 : o.share : void 0;
   }
 ), N2 = (e) => M(
-  A,
+  $,
   (t) => {
     var o, c;
     return t[e] ? (c = (o = t[e]) == null ? void 0 : o.configuration) == null ? void 0 : c.zoomRoomControllerKey : void 0;
@@ -148,20 +148,20 @@ const A = (e) => e.rooms, L2 = (e) => M(
 );
 function n6(e) {
   return m(
-    L2(e)
+    P2(e)
   );
 }
 function o6() {
-  return m($2);
+  return m(A2);
 }
 function S1(e) {
-  return m(A2(e));
+  return m($2(e));
 }
 const s6 = S1, c6 = (e) => m(
-  B2(e)
+  k2(e)
 ), te = (e, t) => m(
-  k2(e, t)
-), ne = (e) => m(O2(e)) || void 0, r6 = (e) => m(W2(e)), l6 = (e) => m(V2(e)), i6 = (e) => m(U2(e)), a6 = (e) => m(H2(e)), u6 = (e) => m(F2(e)), d6 = (e) => m(K2(e)), v6 = (e) => m(q2(e)), h6 = (e) => m(G2(e)), g6 = (e) => m(Y2(e)), f6 = (e) => m(z2(e)), w6 = (e) => m(J2(e)), m6 = (e) => m(X2(e)), p6 = (e) => m(Q2(e)), M6 = (e) => m((t) => ee(t, e)), x6 = (e) => m(N2(e)), G = (e) => e.runtimeConfig, oe = M(
+  B2(e, t)
+), ne = (e) => m(O2(e)) || void 0, r6 = (e) => m(W2(e)), l6 = (e) => m(V2(e)), i6 = (e) => m(U2(e)), a6 = (e) => m(F2(e)), u6 = (e) => m(H2(e)), d6 = (e) => m(K2(e)), v6 = (e) => m(q2(e)), h6 = (e) => m(G2(e)), g6 = (e) => m(Y2(e)), f6 = (e) => m(z2(e)), w6 = (e) => m(J2(e)), m6 = (e) => m(X2(e)), p6 = (e) => m(Q2(e)), M6 = (e) => m((t) => ee(t, e)), x6 = (e) => m(N2(e)), G = (e) => e.runtimeConfig, oe = M(
   G,
   (e) => e.websocket.isConnected
 ), se = M(
@@ -216,7 +216,7 @@ const s6 = S1, c6 = (e) => m(
 ), fe = M(N, (e) => e.error), we = M(
   N,
   (e) => e.showReconnect
-), me = M(N, (e) => e.theme), pe = (e) => M(N, (t) => t.syncState.includes(e)), _6 = () => m(V1("showShutdownModal")), P6 = () => m(V1("showIncomingCallModal")), L6 = (e) => m(V1(e)), $6 = (e) => m(he(e)), A6 = (e, t) => m(ge(e, t)), Me = () => m(fe), xe = () => m(we), B6 = () => m(me), Ze = (e) => m(pe(e)), Se = {
+), me = M(N, (e) => e.theme), pe = (e) => M(N, (t) => t.syncState.includes(e)), _6 = () => m(V1("showShutdownModal")), L6 = () => m(V1("showIncomingCallModal")), P6 = (e) => m(V1(e)), A6 = (e) => m(he(e)), $6 = (e, t) => m(ge(e, t)), Me = () => m(fe), xe = () => m(we), k6 = () => m(me), Ze = (e) => m(pe(e)), Se = {
   showReconnect: !1,
   error: "",
   modalVisibility: {
@@ -225,7 +225,7 @@ const s6 = S1, c6 = (e) => m(
   },
   popoverVisibility: {},
   syncState: []
-}, R3 = u1({
+}, R3 = d1({
   name: "ui",
   initialState: Se,
   reducers: {
@@ -281,7 +281,7 @@ const s6 = S1, c6 = (e) => m(
     loginMode: "",
     modes: {}
   }
-}, E3 = u1({
+}, E3 = d1({
   name: "appConfig",
   initialState: Ce,
   reducers: {
@@ -289,24 +289,31 @@ const s6 = S1, c6 = (e) => m(
       e.config = t.payload;
     }
   }
-}), T3 = E3.actions, be = E3.reducer, v3 = {}, B1 = u1({
+}), T3 = E3.actions, be = E3.reducer, v3 = {}, k1 = d1({
   name: "devices",
   initialState: v3,
   reducers: {
     setDeviceState(e, t) {
       const o = t.payload.type, c = o.slice(o.lastIndexOf("/") + 1);
       if (!c) return;
-      const r = t.payload.content, l = e[c] ?? {}, v = S3.merge(l, r);
+      const r = t.payload.content, l = e[c] ?? {}, v = S3.mergeWith(
+        {},
+        l,
+        r,
+        (g, h) => {
+          if (Array.isArray(h)) return h.slice();
+        }
+      );
       e[c] = v;
     },
     clearDevices() {
       return v3;
     }
   }
-}), f1 = {
-  setDeviceState: B1.actions.setDeviceState,
-  clearDevices: B1.actions.clearDevices
-}, ye = B1.reducer;
+}), w1 = {
+  setDeviceState: k1.actions.setDeviceState,
+  clearDevices: k1.actions.clearDevices
+}, ye = k1.reducer;
 class Ie {
   constructor() {
     q(this, "uuid", "current-uuid");
@@ -322,24 +329,26 @@ function Re(e) {
 function Ee(e, t) {
   sessionStorage.setItem(e, t);
 }
-const g3 = {}, k1 = u1({
+const g3 = {}, B1 = d1({
   name: "rooms",
   initialState: g3,
   reducers: {
     setRoomState(e, t) {
       const o = t.payload.type, c = o.slice(o.lastIndexOf("/") + 1);
       if (!c) return;
-      const r = t.payload.content, l = e[c] ?? {}, v = S3.merge(l, r);
+      const r = t.payload.content, l = e[c] ?? {}, v = S3.mergeWith({}, l, r, (g, h) => {
+        if (Array.isArray(h)) return h;
+      });
       e[c] = v;
     },
     clearRooms() {
       return g3;
     }
   }
-}), w1 = {
-  setRoomState: k1.actions.setRoomState,
-  clearRooms: k1.actions.clearRooms
-}, Te = k1.reducer, De = {
+}), m1 = {
+  setRoomState: B1.actions.setRoomState,
+  clearRooms: B1.actions.clearRooms
+}, Te = B1.reducer, De = {
   apiVersion: "",
   serverIsRunningOnProcessorHardware: !1,
   websocket: {
@@ -370,7 +379,7 @@ const g3 = {}, k1 = u1({
     userCode: "",
     qrUrl: ""
   }
-}, D3 = u1({
+}, D3 = d1({
   name: "runtimeConfig",
   initialState: De,
   reducers: {
@@ -405,16 +414,16 @@ const g3 = {}, k1 = u1({
       e.touchpanelKey = t.payload;
     }
   }
-}), U = D3.actions, _e = D3.reducer, L1 = M3.create(), _3 = "websocket/connect", P3 = "websocket/disconnect", L3 = "websocket/sendMessage", $3 = "websocket/addEventHandler", A3 = "websocket/removeEventHandler", B3 = "websocket/reconnect", k3 = () => ({ type: _3 }), k6 = () => ({ type: P3 }), Pe = (e, t) => ({
-  type: L3,
+}), U = D3.actions, _e = D3.reducer, P1 = M3.create(), _3 = "websocket/connect", L3 = "websocket/disconnect", P3 = "websocket/sendMessage", A3 = "websocket/addEventHandler", $3 = "websocket/removeEventHandler", k3 = "websocket/reconnect", B3 = () => ({ type: _3 }), B6 = () => ({ type: L3 }), Le = (e, t) => ({
+  type: P3,
   payload: { messageType: e, content: t }
-}), Le = (e, t, o) => ({
-  type: $3,
-  payload: { eventType: e, key: t, callback: o }
-}), $e = (e, t) => ({
+}), Pe = (e, t, o) => ({
   type: A3,
+  payload: { eventType: e, key: t, callback: o }
+}), Ae = (e, t) => ({
+  type: $3,
   payload: { eventType: e, key: t }
-}), Ae = () => ({ type: B3 }), Be = () => {
+}), $e = () => ({ type: k3 }), ke = () => {
   const e = {
     client: null,
     token: null,
@@ -423,47 +432,47 @@ const g3 = {}, k1 = u1({
     eventHandlers: {}
   }, t = async (a) => {
     try {
-      const S = location.pathname.split("/").filter((b) => b.length > 0);
-      S.length >= 5 ? S.length = 5 : S.length = 2;
-      const C = `/${S.join("/")}`, Z = await L1.get(
+      const Z = location.pathname.split("/").filter((b) => b.length > 0);
+      Z.length >= 5 ? Z.length = 5 : Z.length = 2;
+      const C = `/${Z.join("/")}`, S = await P1.get(
         "/_local-config/_config.local.json",
         { baseURL: C }
       );
-      if (Z.status === 200 && Z.data) {
-        const b = Z.data.apiPath;
-        a(T3.setAppConfig(Z.data));
-        const x = await L1.get(
+      if (S.status === 200 && S.data) {
+        const b = S.data.apiPath;
+        a(T3.setAppConfig(S.data));
+        const x = await P1.get(
           `${b}/version`
         );
         x.status === 200 && x.data && a(U.setRuntimeConfig(x.data));
       }
-    } catch (S) {
-      console.error("Error getting config", S);
+    } catch (Z) {
+      console.error("Error getting config", Z);
     }
     return !0;
-  }, o = async (a, S, C) => {
+  }, o = async (a, Z, C) => {
     try {
-      const Z = await L1.get(
-        `${a}/ui/joinroom?token=${S}`
+      const S = await P1.get(
+        `${a}/ui/joinroom?token=${Z}`
       );
-      return Z.status === 200 && Z.data ? (C(U.setRoomData(Z.data)), Z.data) : null;
-    } catch (Z) {
-      return console.log(Z), Z instanceof p2 && Z.response && Z.response.status === 498 ? (console.error("Invalid token. Unable to join room"), C(
+      return S.status === 200 && S.data ? (C(U.setRoomData(S.data)), S.data) : null;
+    } catch (S) {
+      return console.log(S), S instanceof p2 && S.response && S.response.status === 498 ? (console.error("Invalid token. Unable to join room"), C(
         O.setErrorMessage(
-          `Token ${S} is invalid. Unable to join room`
+          `Token ${Z} is invalid. Unable to join room`
         )
-      ), null) : (console.error("Error getting room data", Z), Z instanceof Error ? C(O.setErrorMessage(Z.message)) : C(O.setErrorMessage("Error getting room data")), null);
+      ), null) : (console.error("Error getting room data", S), S instanceof Error ? C(O.setErrorMessage(S.message)) : C(O.setErrorMessage("Error getting room data")), null);
     }
   }, c = (a) => {
     e.reconnectTimer && (clearTimeout(e.reconnectTimer), e.reconnectTimer = null), console.log("WebSocket middleware: Starting reconnection loop..."), e.reconnectTimer = setTimeout(() => {
-      e.waitingToReconnect = !1, e.reconnectTimer = null, console.log("WebSocket middleware: Attempting automatic reconnection..."), a(k3());
+      e.waitingToReconnect = !1, e.reconnectTimer = null, console.log("WebSocket middleware: Attempting automatic reconnection..."), a(B3());
     }, 5e3);
   }, r = () => {
     e.reconnectTimer && (console.log("WebSocket middleware: Stopping reconnection loop"), clearTimeout(e.reconnectTimer), e.reconnectTimer = null);
   }, l = (a) => {
-    a(O.setShowReconnect(!0)), a(U.setWebsocketIsConnected(!1)), a(f1.clearDevices()), a(w1.clearRooms()), a(O.clearAllModals()), a(O.clearSyncState());
-  }, v = (a, S) => {
-    const C = a(), Z = S ?? C.runtimeConfig.roomData.roomKey, { clientId: b } = C.runtimeConfig.roomData, x = C.runtimeConfig.websocket.isConnected;
+    a(O.setShowReconnect(!0)), a(U.setWebsocketIsConnected(!1)), a(w1.clearDevices()), a(m1.clearRooms()), a(O.clearAllModals()), a(O.clearSyncState());
+  }, v = (a, Z) => {
+    const C = a(), S = Z ?? C.runtimeConfig.roomData.roomKey, { clientId: b } = C.runtimeConfig.roomData, x = C.runtimeConfig.websocket.isConnected;
     if (!Z || !x || !b) {
       console.log("WebSocket middleware: Cannot request room status", {
         hasRoomKey: !!Z,
@@ -472,24 +481,21 @@ const g3 = {}, k1 = u1({
       });
       return;
     }
-    console.log(
-      "WebSocket middleware: Requesting status from room:",
-      Z
-    ), e.client && x && e.client.send(
+    console.log("WebSocket middleware: Requesting status from room:", Z), e.client && x && e.client.send(
       JSON.stringify({
-        type: `/room/${Z}/status`,
+        type: `/room/${S}/status`,
         clientId: b,
         content: null
       })
     );
-  }, f = async (a, S) => {
+  }, g = async (a, Z) => {
     console.log("WebSocket middleware: Attempting to connect...");
-    const C = S(), { apiPath: Z } = C.appConfig.config, { serverIsRunningOnProcessorHardware: b } = C.runtimeConfig;
-    if (!Z || !e.token) {
+    const C = Z(), { apiPath: S } = C.appConfig.config, { serverIsRunningOnProcessorHardware: b } = C.runtimeConfig;
+    if (!S || !e.token) {
       console.log(
         "WebSocket middleware: Cannot connect - missing requirements",
         {
-          hasApiPath: !!Z,
+          hasApiPath: !!S,
           hasToken: !!e.token
         }
       );
@@ -507,7 +513,7 @@ const g3 = {}, k1 = u1({
     }
     e.waitingToReconnect = !0;
     try {
-      const x = await o(Z, e.token, a);
+      const x = await o(S, e.token, a);
       if (!x) {
         console.log(
           "WebSocket middleware: Failed to get room data, will retry..."
@@ -515,24 +521,24 @@ const g3 = {}, k1 = u1({
         return;
       }
       console.log("WebSocket middleware: Connecting to websocket");
-      const C1 = `${Z.replace("http", "ws")}/ui/join/${e.token}?clientId=${x.clientId}`, K = new WebSocket(C1);
-      e.client = K, K.onopen = (B) => {
-        console.log("WebSocket middleware: Connected", B.type, B.target), e.waitingToReconnect = !1, r(), setTimeout(() => {
+      const C1 = `${S.replace("http", "ws")}/ui/join/${e.token}?clientId=${x.clientId}`, K = new WebSocket(C1);
+      e.client = K, K.onopen = (k) => {
+        console.log("WebSocket middleware: Connected", k.type, k.target), e.waitingToReconnect = !1, r(), setTimeout(() => {
           e.client === K && K.readyState === WebSocket.OPEN && a(U.setWebsocketIsConnected(!0));
         }, 100);
-      }, K.onerror = (B) => {
-        console.error("WebSocket middleware: Error", B), l(a);
-      }, K.onclose = (B) => {
+      }, K.onerror = (k) => {
+        console.error("WebSocket middleware: Error", k), l(a);
+      }, K.onclose = (k) => {
         var D;
         if (console.log(
           "WebSocket middleware: Disconnected",
-          B.reason,
-          B.code
-        ), B.code === 4100) {
+          k.reason,
+          k.code
+        ), k.code === 4100) {
           console.log("WebSocket middleware: Closed by client (cleanup)"), r(), l(a);
           return;
         }
-        if (e.waitingToReconnect = !0, B.code === 4e3) {
+        if (e.waitingToReconnect = !0, k.code === 4e3) {
           console.log("WebSocket middleware: User code changed"), r(), a(
             U.setUserCode({ userCode: "", qrUrl: "" })
           ), a(
@@ -542,7 +548,7 @@ const g3 = {}, k1 = u1({
           ), l(a);
           return;
         }
-        if (B.code === 4002) {
+        if (k.code === 4002) {
           console.log("WebSocket middleware: Room combination changed"), r(), a(
             O.setErrorMessage(
               "Room combination changed. Click Reconnect to re-join the room"
@@ -550,8 +556,8 @@ const g3 = {}, k1 = u1({
           ), l(a);
           return;
         }
-        if (B.code === 4001)
-          if (!!((D = S().runtimeConfig) != null && D.touchpanelKey))
+        if (k.code === 4001)
+          if (!!((D = Z().runtimeConfig) != null && D.touchpanelKey))
             console.log(
               "WebSocket middleware: Code 4001 received with touchpanel key present, will auto-reconnect"
             );
@@ -581,10 +587,10 @@ const g3 = {}, k1 = u1({
           O.setErrorMessage(
             "Connection lost. Attempting to reconnect..."
           )
-        ), a(U.setWebsocketIsConnected(!1)), a(f1.clearDevices()), a(w1.clearRooms()), a(O.clearAllModals()), a(O.clearSyncState()), c(a);
-      }, K.onmessage = (B) => {
+        ), a(U.setWebsocketIsConnected(!1)), a(w1.clearDevices()), a(m1.clearRooms()), a(O.clearAllModals()), a(O.clearSyncState()), c(a);
+      }, K.onmessage = (k) => {
         try {
-          const D = JSON.parse(B.data);
+          const D = JSON.parse(k.data);
           if (D.type === "close") {
             K.close(4001, D.content);
             return;
@@ -599,7 +605,7 @@ const g3 = {}, k1 = u1({
                 );
                 break;
               case "/system/roomKey":
-                a(w1.clearRooms()), a(f1.clearDevices()), a(O.clearSyncState()), a(
+                a(m1.clearRooms()), a(w1.clearDevices()), a(O.clearSyncState()), a(
                   U.setCurrentRoomKey(
                     D.content
                   )
@@ -644,7 +650,7 @@ const g3 = {}, k1 = u1({
                 );
               }
             });
-          } else D.type.startsWith("/room/") ? a(w1.setRoomState(D)) : D.type.startsWith("/device/") && a(f1.setDeviceState(D));
+          } else D.type.startsWith("/room/") ? a(m1.setRoomState(D)) : D.type.startsWith("/device/") && a(w1.setDeviceState(D));
         } catch (D) {
           console.error("WebSocket middleware: Message handling error", D);
         }
@@ -654,60 +660,60 @@ const g3 = {}, k1 = u1({
     }
   }, h = () => {
     e.client && (console.log("WebSocket middleware: Disconnecting"), r(), e.client.close(4100, "Client requested disconnect"), e.client = null);
-  }, w = (a, S, C) => {
-    const Z = C(), b = Z.runtimeConfig.websocket.isConnected, x = Z.runtimeConfig.roomData.clientId;
+  }, f = (a, Z, C) => {
+    const S = C(), b = S.runtimeConfig.websocket.isConnected, x = S.runtimeConfig.roomData.clientId;
     e.client && b ? e.client.send(
-      JSON.stringify({ type: a, clientId: x, content: S })
+      JSON.stringify({ type: a, clientId: x, content: Z })
     ) : console.warn("WebSocket middleware: Cannot send message - not connected");
-  }, d = (a, S, C) => {
-    e.eventHandlers[a] || (e.eventHandlers[a] = {}), e.eventHandlers[a][S] = C, console.log("WebSocket middleware: Event handler added", a, S);
-  }, P = (a, S) => {
-    e.eventHandlers[a] && (delete e.eventHandlers[a][S], console.log(
+  }, u = (a, Z, C) => {
+    e.eventHandlers[a] || (e.eventHandlers[a] = {}), e.eventHandlers[a][Z] = C, console.log("WebSocket middleware: Event handler added", a, Z);
+  }, L = (a, Z) => {
+    e.eventHandlers[a] && (delete e.eventHandlers[a][Z], console.log(
       "WebSocket middleware: Event handler removed",
       a,
-      S
+      Z
     ));
-  }, H = (a) => {
-    const S = a(), { gatewayAppPath: C } = S.appConfig.config, Z = S.runtimeConfig.roomData.roomKey, b = S.runtimeConfig.roomData.systemUuid, x = S.runtimeConfig.roomData.userCode, W = `${C}?uuid=${b}&roomKey=${Z}`;
+  }, F = (a) => {
+    const Z = a(), { gatewayAppPath: C } = Z.appConfig.config, S = Z.runtimeConfig.roomData.roomKey, b = Z.runtimeConfig.roomData.systemUuid, x = Z.runtimeConfig.roomData.userCode, W = `${C}?uuid=${b}&roomKey=${S}`;
     window.location.href = x ? `${W}&Code=${x}` : W;
   };
-  return (a) => (S) => (C) => {
-    const Z = S(C);
+  return (a) => (Z) => (C) => {
+    const S = Z(C);
     if (!C || typeof C != "object" || !("type" in C))
-      return Z;
+      return S;
     const b = C;
     return (async () => {
       switch (b.type) {
         case _3: {
           let W = new URLSearchParams(window.location.search).get("token");
-          W ? (console.log("WebSocket middleware: Saving token"), Ee(h3.uuid, W)) : (W = Re(h3.uuid), console.log("WebSocket middleware: Loading token")), e.token = W, await t(a.dispatch), await f(a.dispatch, a.getState);
+          W ? (console.log("WebSocket middleware: Saving token"), Ee(h3.uuid, W)) : (W = Re(h3.uuid), console.log("WebSocket middleware: Loading token")), e.token = W, await t(a.dispatch), await g(a.dispatch, a.getState);
           break;
         }
-        case P3:
+        case L3:
           h();
           break;
-        case L3:
-          w(
+        case P3:
+          f(
             b.payload.messageType,
             b.payload.content,
             a.getState
           );
           break;
-        case $3:
-          d(
+        case A3:
+          u(
             b.payload.eventType,
             b.payload.key,
             b.payload.callback
           );
           break;
-        case A3:
-          P(
+        case $3:
+          L(
             b.payload.eventType,
             b.payload.key
           );
           break;
-        case B3:
-          H(a.getState);
+        case k3:
+          F(a.getState);
           break;
         default:
           if (C.type === U.setWebsocketIsConnected.type)
@@ -731,22 +737,22 @@ const g3 = {}, k1 = u1({
       }
     })().catch((x) => {
       console.error("WebSocket middleware: Error handling action", x);
-    }), Z;
+    }), S;
   };
-}, ke = S2({
+}, Be = S2({
   appConfig: be,
   runtimeConfig: _e,
   rooms: Te,
   devices: ye,
   ui: je
 }), Oe = j2({
-  reducer: ke,
+  reducer: Be,
   middleware: (e) => e({
     serializableCheck: {
       // Ignore WebSocket actions with callbacks
       ignoredActions: ["websocket/addEventHandler"]
     }
-  }).concat(Be())
+  }).concat(ke())
 }), f3 = M3.create();
 function O6() {
   const e = W1();
@@ -772,7 +778,7 @@ function O6() {
     return !0;
   };
 }
-var m1 = { exports: {} }, l1 = {};
+var p1 = { exports: {} }, l1 = {};
 /**
  * @license React
  * react-jsx-runtime.production.min.js
@@ -787,12 +793,12 @@ function We() {
   if (w3) return l1;
   w3 = 1;
   var e = x3, t = Symbol.for("react.element"), o = Symbol.for("react.fragment"), c = Object.prototype.hasOwnProperty, r = e.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, l = { key: !0, ref: !0, __self: !0, __source: !0 };
-  function v(f, h, w) {
-    var d, P = {}, H = null, a = null;
-    w !== void 0 && (H = "" + w), h.key !== void 0 && (H = "" + h.key), h.ref !== void 0 && (a = h.ref);
-    for (d in h) c.call(h, d) && !l.hasOwnProperty(d) && (P[d] = h[d]);
-    if (f && f.defaultProps) for (d in h = f.defaultProps, h) P[d] === void 0 && (P[d] = h[d]);
-    return { $$typeof: t, type: f, key: H, ref: a, props: P, _owner: r.current };
+  function v(g, h, f) {
+    var u, L = {}, F = null, a = null;
+    f !== void 0 && (F = "" + f), h.key !== void 0 && (F = "" + h.key), h.ref !== void 0 && (a = h.ref);
+    for (u in h) c.call(h, u) && !l.hasOwnProperty(u) && (L[u] = h[u]);
+    if (g && g.defaultProps) for (u in h = g.defaultProps, h) L[u] === void 0 && (L[u] = h[u]);
+    return { $$typeof: t, type: g, key: F, ref: a, props: L, _owner: r.current };
   }
   return l1.Fragment = o, l1.jsx = v, l1.jsxs = v, l1;
 }
@@ -808,47 +814,47 @@ var i1 = {};
  */
 var m3;
 function Ve() {
-  return m3 || (m3 = 1, process.env.NODE_ENV !== "production" && function() {
-    var e = x3, t = Symbol.for("react.element"), o = Symbol.for("react.portal"), c = Symbol.for("react.fragment"), r = Symbol.for("react.strict_mode"), l = Symbol.for("react.profiler"), v = Symbol.for("react.provider"), f = Symbol.for("react.context"), h = Symbol.for("react.forward_ref"), w = Symbol.for("react.suspense"), d = Symbol.for("react.suspense_list"), P = Symbol.for("react.memo"), H = Symbol.for("react.lazy"), a = Symbol.for("react.offscreen"), S = Symbol.iterator, C = "@@iterator";
-    function Z(s) {
+  return m3 || (m3 = 1, process.env.NODE_ENV !== "production" && (function() {
+    var e = x3, t = Symbol.for("react.element"), o = Symbol.for("react.portal"), c = Symbol.for("react.fragment"), r = Symbol.for("react.strict_mode"), l = Symbol.for("react.profiler"), v = Symbol.for("react.provider"), g = Symbol.for("react.context"), h = Symbol.for("react.forward_ref"), f = Symbol.for("react.suspense"), u = Symbol.for("react.suspense_list"), L = Symbol.for("react.memo"), F = Symbol.for("react.lazy"), a = Symbol.for("react.offscreen"), Z = Symbol.iterator, C = "@@iterator";
+    function S(s) {
       if (s === null || typeof s != "object")
         return null;
-      var i = S && s[S] || s[C];
+      var i = Z && s[Z] || s[C];
       return typeof i == "function" ? i : null;
     }
     var b = e.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
     function x(s) {
       {
-        for (var i = arguments.length, u = new Array(i > 1 ? i - 1 : 0), p = 1; p < i; p++)
-          u[p - 1] = arguments[p];
-        W("error", s, u);
+        for (var i = arguments.length, d = new Array(i > 1 ? i - 1 : 0), p = 1; p < i; p++)
+          d[p - 1] = arguments[p];
+        W("error", s, d);
       }
     }
-    function W(s, i, u) {
+    function W(s, i, d) {
       {
         var p = b.ReactDebugCurrentFrame, E = p.getStackAddendum();
-        E !== "" && (i += "%s", u = u.concat([E]));
-        var T = u.map(function(y) {
+        E !== "" && (i += "%s", d = d.concat([E]));
+        var T = d.map(function(y) {
           return String(y);
         });
         T.unshift("Warning: " + i), Function.prototype.apply.call(console[s], console, T);
       }
     }
-    var C1 = !1, K = !1, B = !1, D = !1, z = !1, o1;
+    var C1 = !1, K = !1, k = !1, D = !1, z = !1, o1;
     o1 = Symbol.for("react.module.reference");
     function b1(s) {
-      return !!(typeof s == "string" || typeof s == "function" || s === c || s === l || z || s === r || s === w || s === d || D || s === a || C1 || K || B || typeof s == "object" && s !== null && (s.$$typeof === H || s.$$typeof === P || s.$$typeof === v || s.$$typeof === f || s.$$typeof === h || // This needs to include all possible module reference object
+      return !!(typeof s == "string" || typeof s == "function" || s === c || s === l || z || s === r || s === f || s === u || D || s === a || C1 || K || k || typeof s == "object" && s !== null && (s.$$typeof === F || s.$$typeof === L || s.$$typeof === v || s.$$typeof === g || s.$$typeof === h || // This needs to include all possible module reference object
       // types supported by any Flight configuration anywhere since
       // we don't know which Flight build this will end up being used
       // with.
       s.$$typeof === o1 || s.getModuleId !== void 0));
     }
-    function U3(s, i, u) {
+    function U3(s, i, d) {
       var p = s.displayName;
       if (p)
         return p;
       var E = i.displayName || i.name || "";
-      return E !== "" ? u + "(" + E + ")" : u;
+      return E !== "" ? d + "(" + E + ")" : d;
     }
     function U1(s) {
       return s.displayName || "Context";
@@ -869,25 +875,25 @@ function Ve() {
           return "Profiler";
         case r:
           return "StrictMode";
-        case w:
+        case f:
           return "Suspense";
-        case d:
+        case u:
           return "SuspenseList";
       }
       if (typeof s == "object")
         switch (s.$$typeof) {
-          case f:
+          case g:
             var i = s;
             return U1(i) + ".Consumer";
           case v:
-            var u = s;
-            return U1(u._context) + ".Provider";
+            var d = s;
+            return U1(d._context) + ".Provider";
           case h:
             return U3(s, s.render, "ForwardRef");
-          case P:
+          case L:
             var p = s.displayName || null;
             return p !== null ? p : J(s.type) || "Memo";
-          case H: {
+          case F: {
             var E = s, T = E._payload, y = E._init;
             try {
               return J(y(T));
@@ -898,14 +904,14 @@ function Ve() {
         }
       return null;
     }
-    var X = Object.assign, s1 = 0, H1, F1, K1, q1, G1, Y1, z1;
+    var X = Object.assign, s1 = 0, F1, H1, K1, q1, G1, Y1, z1;
     function J1() {
     }
     J1.__reactDisabledLog = !0;
-    function H3() {
+    function F3() {
       {
         if (s1 === 0) {
-          H1 = console.log, F1 = console.info, K1 = console.warn, q1 = console.error, G1 = console.group, Y1 = console.groupCollapsed, z1 = console.groupEnd;
+          F1 = console.log, H1 = console.info, K1 = console.warn, q1 = console.error, G1 = console.group, Y1 = console.groupCollapsed, z1 = console.groupEnd;
           var s = {
             configurable: !0,
             enumerable: !0,
@@ -925,7 +931,7 @@ function Ve() {
         s1++;
       }
     }
-    function F3() {
+    function H3() {
       {
         if (s1--, s1 === 0) {
           var s = {
@@ -935,10 +941,10 @@ function Ve() {
           };
           Object.defineProperties(console, {
             log: X({}, s, {
-              value: H1
+              value: F1
             }),
             info: X({}, s, {
-              value: F1
+              value: H1
             }),
             warn: X({}, s, {
               value: K1
@@ -961,7 +967,7 @@ function Ve() {
       }
     }
     var y1 = b.ReactCurrentDispatcher, I1;
-    function d1(s, i, u) {
+    function v1(s, i, d) {
       {
         if (I1 === void 0)
           try {
@@ -974,25 +980,25 @@ function Ve() {
 ` + I1 + s;
       }
     }
-    var R1 = !1, v1;
+    var R1 = !1, h1;
     {
       var K3 = typeof WeakMap == "function" ? WeakMap : Map;
-      v1 = new K3();
+      h1 = new K3();
     }
     function X1(s, i) {
       if (!s || R1)
         return "";
       {
-        var u = v1.get(s);
-        if (u !== void 0)
-          return u;
+        var d = h1.get(s);
+        if (d !== void 0)
+          return d;
       }
       var p;
       R1 = !0;
       var E = Error.prepareStackTrace;
       Error.prepareStackTrace = void 0;
       var T;
-      T = y1.current, y1.current = null, H3();
+      T = y1.current, y1.current = null, F3();
       try {
         if (i) {
           var y = function() {
@@ -1028,58 +1034,58 @@ function Ve() {
       } catch (V) {
         if (V && p && typeof V.stack == "string") {
           for (var j = V.stack.split(`
-`), k = p.stack.split(`
-`), L = j.length - 1, $ = k.length - 1; L >= 1 && $ >= 0 && j[L] !== k[$]; )
-            $--;
-          for (; L >= 1 && $ >= 0; L--, $--)
-            if (j[L] !== k[$]) {
-              if (L !== 1 || $ !== 1)
+`), B = p.stack.split(`
+`), P = j.length - 1, A = B.length - 1; P >= 1 && A >= 0 && j[P] !== B[A]; )
+            A--;
+          for (; P >= 1 && A >= 0; P--, A--)
+            if (j[P] !== B[A]) {
+              if (P !== 1 || A !== 1)
                 do
-                  if (L--, $--, $ < 0 || j[L] !== k[$]) {
-                    var F = `
-` + j[L].replace(" at new ", " at ");
-                    return s.displayName && F.includes("<anonymous>") && (F = F.replace("<anonymous>", s.displayName)), typeof s == "function" && v1.set(s, F), F;
+                  if (P--, A--, A < 0 || j[P] !== B[A]) {
+                    var H = `
+` + j[P].replace(" at new ", " at ");
+                    return s.displayName && H.includes("<anonymous>") && (H = H.replace("<anonymous>", s.displayName)), typeof s == "function" && h1.set(s, H), H;
                   }
-                while (L >= 1 && $ >= 0);
+                while (P >= 1 && A >= 0);
               break;
             }
         }
       } finally {
-        R1 = !1, y1.current = T, F3(), Error.prepareStackTrace = E;
+        R1 = !1, y1.current = T, H3(), Error.prepareStackTrace = E;
       }
-      var t1 = s ? s.displayName || s.name : "", Q = t1 ? d1(t1) : "";
-      return typeof s == "function" && v1.set(s, Q), Q;
+      var t1 = s ? s.displayName || s.name : "", Q = t1 ? v1(t1) : "";
+      return typeof s == "function" && h1.set(s, Q), Q;
     }
-    function q3(s, i, u) {
+    function q3(s, i, d) {
       return X1(s, !1);
     }
     function G3(s) {
       var i = s.prototype;
       return !!(i && i.isReactComponent);
     }
-    function h1(s, i, u) {
+    function g1(s, i, d) {
       if (s == null)
         return "";
       if (typeof s == "function")
         return X1(s, G3(s));
       if (typeof s == "string")
-        return d1(s);
+        return v1(s);
       switch (s) {
-        case w:
-          return d1("Suspense");
-        case d:
-          return d1("SuspenseList");
+        case f:
+          return v1("Suspense");
+        case u:
+          return v1("SuspenseList");
       }
       if (typeof s == "object")
         switch (s.$$typeof) {
           case h:
             return q3(s.render);
-          case P:
-            return h1(s.type, i, u);
-          case H: {
+          case L:
+            return g1(s.type, i, d);
+          case F: {
             var p = s, E = p._payload, T = p._init;
             try {
-              return h1(T(E), i, u);
+              return g1(T(E), i, d);
             } catch {
             }
           }
@@ -1087,14 +1093,14 @@ function Ve() {
       return "";
     }
     var c1 = Object.prototype.hasOwnProperty, Q1 = {}, N1 = b.ReactDebugCurrentFrame;
-    function g1(s) {
+    function f1(s) {
       if (s) {
-        var i = s._owner, u = h1(s.type, s._source, i ? i.type : null);
-        N1.setExtraStackFrame(u);
+        var i = s._owner, d = g1(s.type, s._source, i ? i.type : null);
+        N1.setExtraStackFrame(d);
       } else
         N1.setExtraStackFrame(null);
     }
-    function Y3(s, i, u, p, E) {
+    function Y3(s, i, d, p, E) {
       {
         var T = Function.call.bind(c1);
         for (var y in s)
@@ -1102,14 +1108,14 @@ function Ve() {
             var j = void 0;
             try {
               if (typeof s[y] != "function") {
-                var k = Error((p || "React class") + ": " + u + " type `" + y + "` is invalid; it must be a function, usually from the `prop-types` package, but received `" + typeof s[y] + "`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.");
-                throw k.name = "Invariant Violation", k;
+                var B = Error((p || "React class") + ": " + d + " type `" + y + "` is invalid; it must be a function, usually from the `prop-types` package, but received `" + typeof s[y] + "`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.");
+                throw B.name = "Invariant Violation", B;
               }
-              j = s[y](i, y, p, u, null, "SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED");
-            } catch (L) {
-              j = L;
+              j = s[y](i, y, p, d, null, "SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED");
+            } catch (P) {
+              j = P;
             }
-            j && !(j instanceof Error) && (g1(E), x("%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).", p || "React class", u, y, typeof j), g1(null)), j instanceof Error && !(j.message in Q1) && (Q1[j.message] = !0, g1(E), x("Failed %s type: %s", u, j.message), g1(null));
+            j && !(j instanceof Error) && (f1(E), x("%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).", p || "React class", d, y, typeof j), f1(null)), j instanceof Error && !(j.message in Q1) && (Q1[j.message] = !0, f1(E), x("Failed %s type: %s", d, j.message), f1(null));
           }
       }
     }
@@ -1119,8 +1125,8 @@ function Ve() {
     }
     function J3(s) {
       {
-        var i = typeof Symbol == "function" && Symbol.toStringTag, u = i && s[Symbol.toStringTag] || s.constructor.name || "Object";
-        return u;
+        var i = typeof Symbol == "function" && Symbol.toStringTag, d = i && s[Symbol.toStringTag] || s.constructor.name || "Object";
+        return d;
       }
     }
     function X3(s) {
@@ -1164,34 +1170,34 @@ function Ve() {
     }
     function n2(s, i) {
       {
-        var u = function() {
+        var d = function() {
           o3 || (o3 = !0, x("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", i));
         };
-        u.isReactWarning = !0, Object.defineProperty(s, "key", {
-          get: u,
+        d.isReactWarning = !0, Object.defineProperty(s, "key", {
+          get: d,
           configurable: !0
         });
       }
     }
     function o2(s, i) {
       {
-        var u = function() {
+        var d = function() {
           s3 || (s3 = !0, x("%s: `ref` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", i));
         };
-        u.isReactWarning = !0, Object.defineProperty(s, "ref", {
-          get: u,
+        d.isReactWarning = !0, Object.defineProperty(s, "ref", {
+          get: d,
           configurable: !0
         });
       }
     }
-    var s2 = function(s, i, u, p, E, T, y) {
+    var s2 = function(s, i, d, p, E, T, y) {
       var j = {
         // This tag allows us to uniquely identify this as a React Element
         $$typeof: t,
         // Built-in properties that belong on the element
         type: s,
         key: i,
-        ref: u,
+        ref: d,
         props: y,
         // Record the component responsible for creating this element.
         _owner: T
@@ -1213,29 +1219,29 @@ function Ve() {
         value: E
       }), Object.freeze && (Object.freeze(j.props), Object.freeze(j)), j;
     };
-    function c2(s, i, u, p, E) {
+    function c2(s, i, d, p, E) {
       {
-        var T, y = {}, j = null, k = null;
-        u !== void 0 && (t3(u), j = "" + u), e2(i) && (t3(i.key), j = "" + i.key), N3(i) && (k = i.ref, t2(i, E));
+        var T, y = {}, j = null, B = null;
+        d !== void 0 && (t3(d), j = "" + d), e2(i) && (t3(i.key), j = "" + i.key), N3(i) && (B = i.ref, t2(i, E));
         for (T in i)
           c1.call(i, T) && !Q3.hasOwnProperty(T) && (y[T] = i[T]);
         if (s && s.defaultProps) {
-          var L = s.defaultProps;
-          for (T in L)
-            y[T] === void 0 && (y[T] = L[T]);
+          var P = s.defaultProps;
+          for (T in P)
+            y[T] === void 0 && (y[T] = P[T]);
         }
-        if (j || k) {
-          var $ = typeof s == "function" ? s.displayName || s.name || "Unknown" : s;
-          j && n2(y, $), k && o2(y, $);
+        if (j || B) {
+          var A = typeof s == "function" ? s.displayName || s.name || "Unknown" : s;
+          j && n2(y, A), B && o2(y, A);
         }
-        return s2(s, j, k, E, p, n3.current, y);
+        return s2(s, j, B, E, p, n3.current, y);
       }
     }
     var T1 = b.ReactCurrentOwner, c3 = b.ReactDebugCurrentFrame;
     function e1(s) {
       if (s) {
-        var i = s._owner, u = h1(s.type, s._source, i ? i.type : null);
-        c3.setExtraStackFrame(u);
+        var i = s._owner, d = g1(s.type, s._source, i ? i.type : null);
+        c3.setExtraStackFrame(d);
       } else
         c3.setExtraStackFrame(null);
     }
@@ -1264,10 +1270,10 @@ Check the render method of \`` + s + "`.";
       {
         var i = r3();
         if (!i) {
-          var u = typeof s == "string" ? s : s.displayName || s.name;
-          u && (i = `
+          var d = typeof s == "string" ? s : s.displayName || s.name;
+          d && (i = `
 
-Check the top-level render call using <` + u + ">.");
+Check the top-level render call using <` + d + ">.");
         }
         return i;
       }
@@ -1277,12 +1283,12 @@ Check the top-level render call using <` + u + ">.");
         if (!s._store || s._store.validated || s.key != null)
           return;
         s._store.validated = !0;
-        var u = l2(i);
-        if (l3[u])
+        var d = l2(i);
+        if (l3[d])
           return;
-        l3[u] = !0;
+        l3[d] = !0;
         var p = "";
-        s && s._owner && s._owner !== T1.current && (p = " It was passed a child from " + J(s._owner.type) + "."), e1(s), x('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.', u, p), e1(null);
+        s && s._owner && s._owner !== T1.current && (p = " It was passed a child from " + J(s._owner.type) + "."), e1(s), x('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.', d, p), e1(null);
       }
     }
     function a3(s, i) {
@@ -1290,14 +1296,14 @@ Check the top-level render call using <` + u + ">.");
         if (typeof s != "object")
           return;
         if (E1(s))
-          for (var u = 0; u < s.length; u++) {
-            var p = s[u];
+          for (var d = 0; d < s.length; d++) {
+            var p = s[d];
             _1(p) && i3(p, i);
           }
         else if (_1(s))
           s._store && (s._store.validated = !0);
         else if (s) {
-          var E = Z(s);
+          var E = S(s);
           if (typeof E == "function" && E !== s.entries)
             for (var T = E.call(s), y; !(y = T.next()).done; )
               _1(y.value) && i3(y.value, i);
@@ -1309,18 +1315,18 @@ Check the top-level render call using <` + u + ">.");
         var i = s.type;
         if (i == null || typeof i == "string")
           return;
-        var u;
+        var d;
         if (typeof i == "function")
-          u = i.propTypes;
+          d = i.propTypes;
         else if (typeof i == "object" && (i.$$typeof === h || // Note: Memo only checks outer props here.
         // Inner props are checked in the reconciler.
-        i.$$typeof === P))
-          u = i.propTypes;
+        i.$$typeof === L))
+          d = i.propTypes;
         else
           return;
-        if (u) {
+        if (d) {
           var p = J(i);
-          Y3(u, s.props, "prop", p, s);
+          Y3(d, s.props, "prop", p, s);
         } else if (i.PropTypes !== void 0 && !D1) {
           D1 = !0;
           var E = J(i);
@@ -1331,8 +1337,8 @@ Check the top-level render call using <` + u + ">.");
     }
     function a2(s) {
       {
-        for (var i = Object.keys(s.props), u = 0; u < i.length; u++) {
-          var p = i[u];
+        for (var i = Object.keys(s.props), d = 0; d < i.length; d++) {
+          var p = i[d];
           if (p !== "children" && p !== "key") {
             e1(s), x("Invalid prop `%s` supplied to `React.Fragment`. React.Fragment can only have `key` and `children` props.", p), e1(null);
             break;
@@ -1342,71 +1348,71 @@ Check the top-level render call using <` + u + ">.");
       }
     }
     var u3 = {};
-    function d3(s, i, u, p, E, T) {
+    function d3(s, i, d, p, E, T) {
       {
         var y = b1(s);
         if (!y) {
           var j = "";
           (s === void 0 || typeof s == "object" && s !== null && Object.keys(s).length === 0) && (j += " You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.");
-          var k = r2();
-          k ? j += k : j += r3();
-          var L;
-          s === null ? L = "null" : E1(s) ? L = "array" : s !== void 0 && s.$$typeof === t ? (L = "<" + (J(s.type) || "Unknown") + " />", j = " Did you accidentally export a JSX literal instead of a component?") : L = typeof s, x("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s", L, j);
-        }
-        var $ = c2(s, i, u, E, T);
-        if ($ == null)
-          return $;
+          var B = r2();
+          B ? j += B : j += r3();
+          var P;
+          s === null ? P = "null" : E1(s) ? P = "array" : s !== void 0 && s.$$typeof === t ? (P = "<" + (J(s.type) || "Unknown") + " />", j = " Did you accidentally export a JSX literal instead of a component?") : P = typeof s, x("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s", P, j);
+        }
+        var A = c2(s, i, d, E, T);
+        if (A == null)
+          return A;
         if (y) {
-          var F = i.children;
-          if (F !== void 0)
+          var H = i.children;
+          if (H !== void 0)
             if (p)
-              if (E1(F)) {
-                for (var t1 = 0; t1 < F.length; t1++)
-                  a3(F[t1], s);
-                Object.freeze && Object.freeze(F);
+              if (E1(H)) {
+                for (var t1 = 0; t1 < H.length; t1++)
+                  a3(H[t1], s);
+                Object.freeze && Object.freeze(H);
               } else
                 x("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");
             else
-              a3(F, s);
+              a3(H, s);
         }
         if (c1.call(i, "key")) {
           var Q = J(s), V = Object.keys(i).filter(function(f2) {
             return f2 !== "key";
-          }), P1 = V.length > 0 ? "{key: someKey, " + V.join(": ..., ") + ": ...}" : "{key: someKey}";
-          if (!u3[Q + P1]) {
+          }), L1 = V.length > 0 ? "{key: someKey, " + V.join(": ..., ") + ": ...}" : "{key: someKey}";
+          if (!u3[Q + L1]) {
             var g2 = V.length > 0 ? "{" + V.join(": ..., ") + ": ...}" : "{}";
             x(`A props object containing a "key" prop is being spread into JSX:
   let props = %s;
   <%s {...props} />
 React keys must be passed directly to JSX without using spread:
   let props = %s;
-  <%s key={someKey} {...props} />`, P1, Q, g2, Q), u3[Q + P1] = !0;
+  <%s key={someKey} {...props} />`, L1, Q, g2, Q), u3[Q + L1] = !0;
           }
         }
-        return s === c ? a2($) : i2($), $;
+        return s === c ? a2(A) : i2(A), A;
       }
     }
-    function u2(s, i, u) {
-      return d3(s, i, u, !0);
+    function u2(s, i, d) {
+      return d3(s, i, d, !0);
     }
-    function d2(s, i, u) {
-      return d3(s, i, u, !1);
+    function d2(s, i, d) {
+      return d3(s, i, d, !1);
     }
     var v2 = d2, h2 = u2;
     i1.Fragment = c, i1.jsx = v2, i1.jsxs = h2;
-  }()), i1;
+  })()), i1;
 }
 var p3;
 function Ue() {
-  return p3 || (p3 = 1, process.env.NODE_ENV === "production" ? m1.exports = We() : m1.exports = Ve()), m1.exports;
+  return p3 || (p3 = 1, process.env.NODE_ENV === "production" ? p1.exports = We() : p1.exports = Ve()), p1.exports;
 }
 var n = Ue();
-const He = "_mwfit_ppa3l_1", Fe = {
-  mwfit: He
+const Fe = "_mwfit_ppa3l_1", He = {
+  mwfit: Fe
 }, Ke = () => {
   const { reconnect: e } = R(), t = I3(), o = Me(), c = xe();
   return /* @__PURE__ */ n.jsxs("div", { className: "vh-100 d-flex flex-column flex-grow-1 justify-content-center align-items-center gap-5 ", children: [
-    /* @__PURE__ */ n.jsxs("div", { className: `${Fe.mwfit} mx-auto text-center`, children: [
+    /* @__PURE__ */ n.jsxs("div", { className: `${He.mwfit} mx-auto text-center`, children: [
       t === void 0 ? /* @__PURE__ */ n.jsx("h2", { children: "Connecting..." }) : /* @__PURE__ */ n.jsx("h2", { children: "Disconnected" }),
       o && /* @__PURE__ */ n.jsx("h5", { className: "mt-1", children: o })
     ] }),
@@ -1421,30 +1427,30 @@ const He = "_mwfit_ppa3l_1", Fe = {
 }), qe = ({ children: e }) => {
   const t = W1(), o = I3();
   x1(() => {
-    t(k3());
+    t(B3());
   }, [t]);
   const c = r1(
-    (h, w) => {
-      t(Pe(h, w));
+    (h, f) => {
+      t(Le(h, f));
     },
     [t]
   ), r = r1(
-    (h, w) => {
-      c(h, { value: w });
+    (h, f) => {
+      c(h, { value: f });
     },
     [c]
   ), l = r1(
-    (h, w, d) => {
-      t(Le(h, w, d));
+    (h, f, u) => {
+      t(Pe(h, f, u));
     },
     [t]
   ), v = r1(
-    (h, w) => {
-      t($e(h, w));
+    (h, f) => {
+      t(Ae(h, f));
     },
     [t]
-  ), f = r1(() => {
-    t(Ae());
+  ), g = r1(() => {
+    t($e());
   }, [t]);
   return /* @__PURE__ */ n.jsx(
     O3.Provider,
@@ -1454,7 +1460,7 @@ const He = "_mwfit_ppa3l_1", Fe = {
         sendSimpleMessage: r,
         addEventHandler: l,
         removeEventHandler: v,
-        reconnect: f
+        reconnect: g
       },
       children: o ? e : /* @__PURE__ */ n.jsx(Ke, {})
     }
@@ -1467,28 +1473,29 @@ function Ge({
   onPress: e,
   onRelease: t,
   onHold: o,
-  holdTimeMs: c = 500
+  onPressedButNotHeld: c,
+  holdTimeMs: r = 500
 }) {
-  const r = M1(null), l = M1(!1);
-  function v() {
-    l.current = !0, e == null || e(), r.current = setTimeout(() => {
-      o == null || o(), r.current = null;
-    }, c);
+  const l = u1(null), v = u1(!1), g = u1(!1);
+  function h() {
+    v.current = !0, g.current = !1, e == null || e(), l.current = setTimeout(() => {
+      g.current = !0, o == null || o(), l.current = null;
+    }, r);
   }
   function f() {
-    l.current = !1, t == null || t(), r.current && (clearTimeout(r.current), r.current = null);
+    v.current = !1, t == null || t(), l.current && (clearTimeout(l.current), l.current = null, g.current || c == null || c());
   }
-  function h() {
-    l.current && f();
+  function u() {
+    v.current && f();
   }
   return {
-    onPointerDown: v,
+    onPointerDown: h,
     onPointerUp: f,
-    onPointerLeave: h
+    onPointerLeave: u
   };
 }
-function g(e, t) {
-  const { sendMessage: c } = R(), r = M1(null);
+function w(e, t) {
+  const { sendMessage: c } = R(), r = u1(null);
   function l() {
     c(`${e}/${t}`, { value: "pressed" }), r.current || (r.current = setInterval(() => {
       c(`${e}/${t}`, { value: "held" });
@@ -1500,7 +1507,7 @@ function g(e, t) {
   return Ge({ onPress: l, onRelease: v });
 }
 function j1(e) {
-  const { sendMessage: t } = R(), o = g(`${e}`, "volumeUp"), c = g(`${e}`, "volumeDown");
+  const { sendMessage: t } = R(), o = w(`${e}`, "volumeUp"), c = w(`${e}`, "volumeDown");
   return n1(() => ({
     volumeUp: o,
     volumeDown: c,
@@ -1508,7 +1515,7 @@ function j1(e) {
   }), [e, t, o, c]);
 }
 function V6(e) {
-  const { sendMessage: t } = R(), o = g(`${e}`, "volumeUp"), c = g(`${e}`, "volumeDown");
+  const { sendMessage: t } = R(), o = w(`${e}`, "volumeUp"), c = w(`${e}`, "volumeDown");
   return n1(() => ({
     volumeUp: o,
     volumeDown: c,
@@ -1583,13 +1590,13 @@ function ze(e) {
     t(`/device/${e}/setDefaultChannelLevels`, null);
   }, r = () => {
     if ((o == null ? void 0 : o.levelControls) === void 0) return;
-    Object.keys(o == null ? void 0 : o.levelControls).forEach((f) => {
-      t(`/device/${e}/${f}/fullStatus`, null);
+    Object.keys(o == null ? void 0 : o.levelControls).forEach((g) => {
+      t(`/device/${e}/${g}/fullStatus`, null);
     });
   };
   return o ? { levelControls: o.levelControls, setDefaultChannelLevels: c, getFullStatus: r } : void 0;
 }
-function H6(e) {
+function F6(e) {
   const t = _(e), o = V3(e), c = O1(e), r = O1(e), l = Ye(e), v = ze(e);
   if (t)
     return {
@@ -1601,7 +1608,7 @@ function H6(e) {
       mainVolumeControl: l
     };
 }
-const F6 = ({ className: e }) => {
+const H6 = ({ className: e }) => {
   const [t, o] = Y();
   return x1(() => {
     setInterval(() => {
@@ -1615,8 +1622,8 @@ const F6 = ({ className: e }) => {
 };
 function K6(e) {
   const { sendMessage: t } = R(), o = _(e), c = `/device/${e}`;
-  return o ? { state: o, recallPreset: (v, f) => {
-    t(`${c}/presets/recall`, { deviceKey: v, preset: f });
+  return o ? { state: o, recallPreset: (v, g) => {
+    t(`${c}/presets/recall`, { deviceKey: v, preset: g });
   }, savePresets: (v) => {
     t(`${c}/presets/save`, v);
   } } : void 0;
@@ -1627,11 +1634,11 @@ function q6(e) {
     return { endpointState: t };
 }
 function G6(e) {
-  const t = `/device/${e}`, o = g(t, "chanUp"), c = g(t, "chanDown"), r = g(t, "lastChan"), l = g(t, "guide"), v = g(t, "info"), f = g(t, "exit");
-  return { channelUp: o, channelDown: c, lastChannel: r, guide: l, info: v, exit: f };
+  const t = `/device/${e}`, o = w(t, "chanUp"), c = w(t, "chanDown"), r = w(t, "lastChan"), l = w(t, "guide"), v = w(t, "info"), g = w(t, "exit");
+  return { channelUp: o, channelDown: c, lastChannel: r, guide: l, info: v, exit: g };
 }
 function Y6(e) {
-  const t = `/device/${e}`, o = g(t, "red"), c = g(t, "green"), r = g(t, "yellow"), l = g(t, "blue");
+  const t = `/device/${e}`, o = w(t, "red"), c = w(t, "green"), r = w(t, "yellow"), l = w(t, "blue");
   return { red: o, green: c, yellow: r, blue: l };
 }
 function z6(e) {
@@ -1647,21 +1654,21 @@ function J6(e) {
     return t.deviceInfo || void 0;
 }
 function X6(e) {
-  const t = `/device/${e}`, o = g(t, "up"), c = g(t, "down"), r = g(t, "left"), l = g(t, "right"), v = g(t, "select"), f = g(t, "menu"), h = g(t, "exit");
-  return { up: o, down: c, left: r, right: l, select: v, menu: f, exit: h };
+  const t = `/device/${e}`, o = w(t, "up"), c = w(t, "down"), r = w(t, "left"), l = w(t, "right"), v = w(t, "select"), g = w(t, "menu"), h = w(t, "exit");
+  return { up: o, down: c, left: r, right: l, select: v, menu: g, exit: h };
 }
 function Q6(e) {
-  const { sendMessage: t } = R(), o = `/device/${e}`, c = _(e), r = g(o, "cameraUp"), l = g(o, "cameraDown"), v = g(o, "cameraLeft"), f = g(o, "cameraRight"), h = g(o, "cameraZoomIn"), w = g(o, "cameraZoomOut"), d = (P) => t("/camera/recallPreset", P);
+  const { sendMessage: t } = R(), o = `/device/${e}`, c = _(e), r = w(o, "cameraUp"), l = w(o, "cameraDown"), v = w(o, "cameraLeft"), g = w(o, "cameraRight"), h = w(o, "cameraZoomIn"), f = w(o, "cameraZoomOut"), u = (L) => t("/camera/recallPreset", L);
   if (c)
     return {
       state: c,
       zoomIn: h,
-      zoomOut: w,
+      zoomOut: f,
       up: r,
       down: l,
       left: v,
-      right: f,
-      recallPreset: d
+      right: g,
+      recallPreset: u
     };
 }
 function N6(e) {
@@ -1674,7 +1681,7 @@ function N6(e) {
   } };
 }
 function et(e) {
-  const t = `/device/${e}`, o = g(t, "dvrList"), c = g(t, "record");
+  const t = `/device/${e}`, o = w(t, "dvrList"), c = w(t, "record");
   return { dvrList: o, record: c };
 }
 function tt(e) {
@@ -1709,10 +1716,10 @@ function st(e) {
   const { sendMessage: t, sendSimpleMessage: o } = R(), c = _(e), r = ne(e), l = c || r;
   return l ? {
     levelState: l,
-    setLevel: (d, P) => o(`${d}/level`, P),
-    muteToggle: (d) => t(`${d}/muteToggle`, null),
-    muteOn: (d) => t(`${d}/muteOn`, null),
-    muteOff: (d) => t(`${d}/muteOff`, null)
+    setLevel: (u, L) => o(`${u}/level`, L),
+    muteToggle: (u) => t(`${u}/muteToggle`, null),
+    muteOn: (u) => t(`${u}/muteOn`, null),
+    muteOff: (u) => t(`${u}/muteOff`, null)
   } : void 0;
 }
 function ct(e) {
@@ -1734,19 +1741,19 @@ function lt(e) {
   } };
 }
 function it(e) {
-  const t = `/device/${e}`, o = g(t, "num0"), c = g(t, "num1"), r = g(t, "num2"), l = g(t, "num3"), v = g(t, "num4"), f = g(t, "num5"), h = g(t, "num6"), w = g(t, "num7"), d = g(t, "num8"), P = g(t, "num9"), H = g(t, "numDash"), a = g(t, "numEnter");
+  const t = `/device/${e}`, o = w(t, "num0"), c = w(t, "num1"), r = w(t, "num2"), l = w(t, "num3"), v = w(t, "num4"), g = w(t, "num5"), h = w(t, "num6"), f = w(t, "num7"), u = w(t, "num8"), L = w(t, "num9"), F = w(t, "numDash"), a = w(t, "numEnter");
   return {
     digit0: o,
     digit1: c,
     digit2: r,
     digit3: l,
     digit4: v,
-    digit5: f,
+    digit5: g,
     digit6: h,
-    digit7: w,
-    digit8: d,
-    digit9: P,
-    keypadAccessoryButton1: H,
+    digit7: f,
+    digit8: u,
+    digit9: L,
+    keypadAccessoryButton1: F,
     keypadAccessoryButton2: a
   };
 }
@@ -1783,7 +1790,7 @@ function ht(e) {
   } };
 }
 function gt(e) {
-  const t = `/device/${e}`, o = g(t, "chanUp"), c = g(t, "chanDown");
+  const t = `/device/${e}`, o = w(t, "chanUp"), c = w(t, "chanDown");
   return { dvrList: o, replay: c };
 }
 function ft(e) {
@@ -1798,8 +1805,8 @@ function ft(e) {
 }
 function wt(e) {
   const { sendMessage: t } = R(), o = S1(e);
-  return o ? { shutdownPromptTimerState: o, setShutdownPromptSeconds: (f) => {
-    t(`/room/${e}/setShutdownPromptSeconds`, f);
+  return o ? { shutdownPromptTimerState: o, setShutdownPromptSeconds: (g) => {
+    t(`/room/${e}/setShutdownPromptSeconds`, g);
   }, shutdownStart: () => {
     t(`/room/${e}/shutdownStart`, null);
   }, shutdownEnd: () => {
@@ -1838,16 +1845,16 @@ function xt(e) {
   };
 }
 function Zt(e) {
-  const t = `/device/${e}`, o = g(t, "play"), c = g(t, "pause"), r = g(t, "stop"), l = g(t, "prevTrack"), v = g(t, "nextTrack"), f = g(t, "rewind"), h = g(t, "ffwd"), w = g(t, "record");
+  const t = `/device/${e}`, o = w(t, "play"), c = w(t, "pause"), r = w(t, "stop"), l = w(t, "prevTrack"), v = w(t, "nextTrack"), g = w(t, "rewind"), h = w(t, "ffwd"), f = w(t, "record");
   return {
     play: o,
     pause: c,
     stop: r,
     prevTrack: l,
     nextTrack: v,
-    rewind: f,
+    rewind: g,
     fastForward: h,
-    record: w
+    record: f
   };
 }
 function St(e) {
@@ -1884,30 +1891,30 @@ function Ct(e) {
 const bt = ({
   config: e
 }, t = !0) => {
-  const { sendMessage: o } = R(), c = M1(!1), r = n1(() => {
-    var v, f, h, w;
+  const { sendMessage: o } = R(), c = u1(!1), r = n1(() => {
+    var v, g, h, f;
     if (!e)
       return;
     const l = /* @__PURE__ */ new Set();
-    if (e.destinations && Object.values(e.destinations).forEach((d) => {
-      l.add(d);
-    }), e.destinationList && Object.values(e.destinationList).forEach((d) => {
-      l.add(d.sinkKey);
+    if (e.destinations && Object.values(e.destinations).forEach((u) => {
+      l.add(u);
+    }), e.destinationList && Object.values(e.destinationList).forEach((u) => {
+      l.add(u.sinkKey);
     }), e.audioControlPointList && Object.values((v = e.audioControlPointList) == null ? void 0 : v.levelControls).forEach(
-      (d) => {
-        d.itemKey ? l.add(d.parentDeviceKey + "--" + d.itemKey) : l.add(d.parentDeviceKey);
+      (u) => {
+        u.itemKey ? l.add(u.parentDeviceKey + "--" + u.itemKey) : l.add(u.parentDeviceKey);
       }
-    ), (f = e.touchpanelKeys) == null || f.forEach((d) => {
-      l.add(d);
-    }), (h = e.environmentalDevices) == null || h.forEach((d) => {
-      d.deviceKey && l.add(d.deviceKey);
-    }), (w = e.accessoryDeviceKeys) == null || w.forEach((d) => {
-      l.add(d);
-    }), e.audioCodecKey && l.add(e.audioCodecKey), e.videoCodecKey && l.add(e.videoCodecKey), e.matrixRoutingKey && l.add(e.matrixRoutingKey), e.roomCombinerKey && l.add(e.roomCombinerKey), e.endpointKeys && e.endpointKeys.forEach((d) => {
-      l.add(d);
+    ), (g = e.touchpanelKeys) == null || g.forEach((u) => {
+      l.add(u);
+    }), (h = e.environmentalDevices) == null || h.forEach((u) => {
+      u.deviceKey && l.add(u.deviceKey);
+    }), (f = e.accessoryDeviceKeys) == null || f.forEach((u) => {
+      l.add(u);
+    }), e.audioCodecKey && l.add(e.audioCodecKey), e.videoCodecKey && l.add(e.videoCodecKey), e.matrixRoutingKey && l.add(e.matrixRoutingKey), e.roomCombinerKey && l.add(e.roomCombinerKey), e.endpointKeys && e.endpointKeys.forEach((u) => {
+      l.add(u);
     }), e.sourceList)
-      for (const d of Object.values(e.sourceList))
-        d.sourceKey && d.sourceKey !== "$off" && l.add(d.sourceKey);
+      for (const u of Object.values(e.sourceList))
+        u.sourceKey && u.sourceKey !== "$off" && l.add(u.sourceKey);
     return l;
   }, [e]);
   return x1(() => {
@@ -1919,11 +1926,11 @@ const bt = ({
 function yt(e, t) {
   const [o, c] = Y(!1), [r, l] = Y(!1);
   return Z3(() => {
-    const { current: v } = e, f = () => {
-      const h = v && v.scrollHeight > v.clientHeight, w = v && v.scrollWidth > v.clientWidth;
-      l(h ?? !1), c(w ?? !1), t && t(h ?? !1, w ?? !1);
+    const { current: v } = e, g = () => {
+      const h = v && v.scrollHeight > v.clientHeight, f = v && v.scrollWidth > v.clientWidth;
+      l(h ?? !1), c(f ?? !1), t && t(h ?? !1, f ?? !1);
     };
-    v && f();
+    v && g();
   }, [e, t]), { overflowHorizontal: o, overflowVertical: r };
 }
 function It(e, t) {
@@ -1935,19 +1942,19 @@ function Rt(e, t) {
   return W3(c, o);
 }
 function Et(e) {
-  var f, h;
-  const [t, o] = Y(((f = e == null ? void 0 : e.current) == null ? void 0 : f.scrollLeft) ?? 0), [c, r] = Y(((h = e == null ? void 0 : e.current) == null ? void 0 : h.scrollTop) ?? 0), l = (w) => {
-    const { current: d } = e;
-    d && (console.log(d.scrollLeft), d.scrollLeft += w, console.log(d.scrollLeft));
-  }, v = (w) => {
-    const { current: d } = e;
-    d && (console.log(d.scrollTop), d.scrollTop += w, console.log(d.scrollTop));
+  var g, h;
+  const [t, o] = Y(((g = e == null ? void 0 : e.current) == null ? void 0 : g.scrollLeft) ?? 0), [c, r] = Y(((h = e == null ? void 0 : e.current) == null ? void 0 : h.scrollTop) ?? 0), l = (f) => {
+    const { current: u } = e;
+    u && (console.log(u.scrollLeft), u.scrollLeft += f, console.log(u.scrollLeft));
+  }, v = (f) => {
+    const { current: u } = e;
+    u && (console.log(u.scrollTop), u.scrollTop += f, console.log(u.scrollTop));
   };
   return Z3(() => {
-    const { current: w } = e, d = () => {
-      o((w == null ? void 0 : w.scrollLeft) ?? 0), r((w == null ? void 0 : w.scrollTop) ?? 0);
+    const { current: f } = e, u = () => {
+      o((f == null ? void 0 : f.scrollLeft) ?? 0), r((f == null ? void 0 : f.scrollTop) ?? 0);
     };
-    w && d();
+    f && u();
   }, [e]), { horizontalScrollPosition: t, verticalScrollPosition: c, scrollHorizontal: l, scrollVertical: v };
 }
 function Tt(e) {
@@ -1984,7 +1991,7 @@ function _t() {
     return () => clearInterval(l);
   }, []), { date: e, time: o };
 }
-const Pt = () => {
+const Lt = () => {
   const [e, t] = Y(!1), o = y2(), c = I2();
   let r;
   return R2(c) ? r = c.statusText : c instanceof Error ? r = c.message : typeof c == "string" ? r = c : (console.error(c), r = "Unknown error"), /* @__PURE__ */ n.jsxs("div", { className: "d-flex flex-column align-items-center gap-5", children: [
@@ -2007,7 +2014,7 @@ const Pt = () => {
     ),
     e && /* @__PURE__ */ n.jsx("p", { children: r })
   ] });
-}, Je = "_iconbtn_16qss_1", Xe = "_iconbtnvert_16qss_7", Qe = "_iconsm_16qss_18", $1 = {
+}, Je = "_iconbtn_16qss_1", Xe = "_iconbtnvert_16qss_7", Qe = "_iconsm_16qss_18", A1 = {
   iconbtn: Je,
   iconbtnvert: Xe,
   iconsm: Qe
@@ -2019,36 +2026,36 @@ const Pt = () => {
   iconClassName: r = "",
   otherContentClassName: l = "",
   disabled: v,
-  feedback: f,
+  feedback: g,
   feedbackClassName: h,
-  onPointerDown: w,
-  onPointerUp: d,
-  onPointerLeave: P,
-  ...H
+  onPointerDown: f,
+  onPointerUp: u,
+  onPointerLeave: L,
+  ...F
 }) => {
-  const [a, S] = Y(!1), C = !v && f ? h : "", Z = !v && (a || f);
+  const [a, Z] = Y(!1), C = !v && g ? h : "", S = !v && (a || g);
   return /* @__PURE__ */ n.jsxs(
     "button",
     {
       type: "button",
-      className: `${$1.iconbtn} ${o ? $1.iconbtnvert : ""} ${c} ${C}`,
-      ...H,
+      className: `${A1.iconbtn} ${o ? A1.iconbtnvert : ""} ${c} ${C}`,
+      ...F,
       disabled: v,
       onPointerDown: (b) => {
-        S(!0), w == null || w(b);
+        Z(!0), f == null || f(b);
       },
       onPointerUp: (b) => {
-        S(!1), d == null || d(b);
+        Z(!1), u == null || u(b);
       },
       onPointerLeave: (b) => {
-        S(!1), P == null || P(b);
+        Z(!1), L == null || L(b);
       },
       children: [
         e && /* @__PURE__ */ n.jsx(
           e,
           {
-            className: `${r || $1.iconsm}`,
-            active: Z,
+            className: `${r || A1.iconsm}`,
+            active: S,
             disabled: v
           }
         ),
@@ -3262,7 +3269,7 @@ const Pt = () => {
     active: e,
     disabled: o
   }
-), Lt = ({
+), Pt = ({
   active: e,
   // Just to shut up the linter on this template. Prefer deleting this lint rule
   // eslint-disable-next-line @typescript-eslint/no-unused-vars
@@ -3703,7 +3710,7 @@ const Pt = () => {
   X: E8,
   Xbox: T8
 };
-function $t({
+function At({
   name: e,
   iconsDictionary: t = _8,
   ...o
@@ -3711,32 +3718,32 @@ function $t({
   const c = t[e] ?? null;
   return c || console.error(`Icon ${e} not found in dictionary`), /* @__PURE__ */ n.jsx(Ne, { multiIcon: c, ...o });
 }
-const P8 = "_grid_1cmpp_1", L8 = "_header_1cmpp_11", $8 = "_content_1cmpp_17", A8 = "_footer_1cmpp_23", B8 = "_volume_1cmpp_29", a1 = {
-  grid: P8,
-  header: L8,
-  content: $8,
-  footer: A8,
-  volume: B8
-}, At = ({ header: e, footer: t, content: o, volume: c, showVolume: r }) => /* @__PURE__ */ n.jsxs("div", { className: a1.grid, children: [
+const L8 = "_grid_1cmpp_1", P8 = "_header_1cmpp_11", A8 = "_content_1cmpp_17", $8 = "_footer_1cmpp_23", k8 = "_volume_1cmpp_29", a1 = {
+  grid: L8,
+  header: P8,
+  content: A8,
+  footer: $8,
+  volume: k8
+}, $t = ({ header: e, footer: t, content: o, volume: c, showVolume: r }) => /* @__PURE__ */ n.jsxs("div", { className: a1.grid, children: [
   /* @__PURE__ */ n.jsx("div", { className: a1.header, children: e }),
   /* @__PURE__ */ n.jsx("div", { className: a1.content, children: o }),
   r && /* @__PURE__ */ n.jsx("div", { className: a1.volume, children: c }),
   /* @__PURE__ */ n.jsx("div", { className: a1.footer, children: t })
-] }), k8 = "_grid_11w5q_1", O8 = "_header_11w5q_11", W8 = "_content_11w5q_17", p1 = {
-  grid: k8,
+] }), B8 = "_grid_11w5q_1", O8 = "_header_11w5q_11", W8 = "_content_11w5q_17", M1 = {
+  grid: B8,
   header: O8,
   content: W8
-}, Bt = ({ className: e, header: t, content: o, leftNav: c }) => /* @__PURE__ */ n.jsxs("div", { className: `${e} ${p1.grid}`, children: [
-  /* @__PURE__ */ n.jsx("div", { className: p1.header, children: t }),
-  c && /* @__PURE__ */ n.jsx("div", { className: p1.leftNav, children: c }),
-  /* @__PURE__ */ n.jsx("div", { className: p1.content, children: o })
-] }), V8 = "_grid_1uwfo_1", U8 = "_header_1uwfo_11", H8 = "_content_1uwfo_17", A1 = {
+}, kt = ({ className: e, header: t, content: o, leftNav: c }) => /* @__PURE__ */ n.jsxs("div", { className: `${e} ${M1.grid}`, children: [
+  /* @__PURE__ */ n.jsx("div", { className: M1.header, children: t }),
+  c && /* @__PURE__ */ n.jsx("div", { className: M1.leftNav, children: c }),
+  /* @__PURE__ */ n.jsx("div", { className: M1.content, children: o })
+] }), V8 = "_grid_1uwfo_1", U8 = "_header_1uwfo_11", F8 = "_content_1uwfo_17", $1 = {
   grid: V8,
   header: U8,
-  content: H8
-}, kt = ({ className: e, header: t, content: o }) => /* @__PURE__ */ n.jsxs("div", { className: `${e} ${A1.grid}`, children: [
-  /* @__PURE__ */ n.jsx("div", { className: A1.header, children: t }),
-  /* @__PURE__ */ n.jsx("div", { className: A1.content, children: o })
+  content: F8
+}, Bt = ({ className: e, header: t, content: o }) => /* @__PURE__ */ n.jsxs("div", { className: `${e} ${$1.grid}`, children: [
+  /* @__PURE__ */ n.jsx("div", { className: $1.header, children: t }),
+  /* @__PURE__ */ n.jsx("div", { className: $1.content, children: o })
 ] });
 class Ot {
   constructor() {
@@ -3748,7 +3755,7 @@ class Ot {
 function Wt() {
   return console.log(location.pathname), location.pathname;
 }
-var F8 = /* @__PURE__ */ ((e) => (e[e.NotSet = 0] = "NotSet", e[e.Sunday = 1] = "Sunday", e[e.Monday = 2] = "Monday", e[e.Tuesday = 4] = "Tuesday", e[e.Wednesday = 8] = "Wednesday", e[e.Thursday = 16] = "Thursday", e[e.Friday = 32] = "Friday", e[e.Saturday = 64] = "Saturday", e))(F8 || {});
+var H8 = /* @__PURE__ */ ((e) => (e[e.NotSet = 0] = "NotSet", e[e.Sunday = 1] = "Sunday", e[e.Monday = 2] = "Monday", e[e.Tuesday = 4] = "Tuesday", e[e.Wednesday = 8] = "Wednesday", e[e.Thursday = 16] = "Thursday", e[e.Friday = 32] = "Friday", e[e.Saturday = 64] = "Saturday", e))(H8 || {});
 class Vt {
   constructor(t, o) {
     q(this, "path");
@@ -3758,9 +3765,9 @@ class Vt {
 }
 const Ut = "$off";
 export {
-  F6 as Clock,
-  F8 as DaysOfWeek,
-  Pt as ErrorBox,
+  H6 as Clock,
+  H8 as DaysOfWeek,
+  Lt as ErrorBox,
   Ne as IconButton,
   e8 as IconMultiAlert,
   t8 as IconMultiBan,
@@ -3787,7 +3794,7 @@ export {
   Z8 as IconMultiRoomPC,
   S8 as IconMultiShade,
   j8 as IconMultiSun,
-  Lt as IconMultiTemplate,
+  Pt as IconMultiTemplate,
   C8 as IconMultiUpArrow,
   b8 as IconMultiVolDown,
   y8 as IconMultiVolMute,
@@ -3795,36 +3802,36 @@ export {
   R8 as IconMultiWireless,
   E8 as IconMultiX,
   T8 as IconMultiXbox,
-  At as MainLayout,
+  $t as MainLayout,
   Vt as MessageHandler,
   W6 as MobileControlProvider,
   I as MultiStateIconContainer,
-  $t as NamedIconButton,
+  At as NamedIconButton,
   Ot as ShareState,
-  Bt as TechLayout,
-  kt as TechPinLayout,
-  $3 as WS_ADD_EVENT_HANDLER,
+  kt as TechLayout,
+  Bt as TechPinLayout,
+  A3 as WS_ADD_EVENT_HANDLER,
   _3 as WS_CONNECT,
-  P3 as WS_DISCONNECT,
-  B3 as WS_RECONNECT,
-  A3 as WS_REMOVE_EVENT_HANDLER,
-  L3 as WS_SEND_MESSAGE,
+  L3 as WS_DISCONNECT,
+  k3 as WS_RECONNECT,
+  $3 as WS_REMOVE_EVENT_HANDLER,
+  P3 as WS_SEND_MESSAGE,
   O3 as WebsocketContext,
   T3 as appConfigActions,
-  Be as createWebSocketMiddleware,
-  f1 as devicesActions,
+  ke as createWebSocketMiddleware,
+  w1 as devicesActions,
   Wt as getBaseLocation,
   f3 as httpClient,
   _8 as iconsDictionary,
   Ut as roomOffSourceKey,
-  w1 as roomsActions,
+  m1 as roomsActions,
   U as runtimeConfigActions,
   C3 as selectAllDevices,
   T2 as selectApiPath,
   E2 as selectAppConfig,
   ce as selectClientId,
   he as selectCurrentPopoverIdForGroup,
-  P2 as selectDeviceByKey,
+  L2 as selectDeviceByKey,
   b3 as selectDeviceInterfaceSupport,
   ve as selectDeviceSupportsInterface,
   fe as selectError,
@@ -3836,25 +3843,25 @@ export {
   _2 as selectPartnerMetadata,
   X2 as selectRoomAdvancedSharingActive,
   V2 as selectRoomAudioControlPointList,
-  A2 as selectRoomByKey,
+  $2 as selectRoomByKey,
   q2 as selectRoomCodecContentDestinationKey,
-  L2 as selectRoomConfiguration,
-  H2 as selectRoomDestinationList,
+  P2 as selectRoomConfiguration,
+  F2 as selectRoomDestinationList,
   U2 as selectRoomDestinations,
   ee as selectRoomDisplayStates,
-  F2 as selectRoomEnvironmentalDevices,
+  H2 as selectRoomEnvironmentalDevices,
   G2 as selectRoomInCall,
   z2 as selectRoomIsCoolingDown,
   J2 as selectRoomIsOn,
   Y2 as selectRoomIsWarmingUp,
   se as selectRoomKey,
   O2 as selectRoomLevelControls,
-  B2 as selectRoomName,
+  k2 as selectRoomName,
   K2 as selectRoomProgramAudioDestinationKey,
   Q2 as selectRoomShareState,
   W2 as selectRoomSourceList,
-  k2 as selectRoomVolume,
-  $2 as selectRooms,
+  B2 as selectRoomVolume,
+  A2 as selectRooms,
   ae as selectRuntimeInfo,
   ie as selectServerIsRunningOnProcessorHardware,
   ge as selectShowPopoverById,
@@ -3872,8 +3879,8 @@ export {
   X8 as useAppConfig,
   W1 as useAppDispatch,
   m as useAppSelector,
-  H6 as useAvrControl,
-  g as useButtonHeldHeartbeat,
+  F6 as useAvrControl,
+  w as useButtonHeldHeartbeat,
   Q6 as useCameraBase,
   S6 as useClientId,
   Ct as useDeviceIBasicVolume,
@@ -3886,7 +3893,7 @@ export {
   bt as useGetAllDeviceStateFromRoomConfiguration,
   t6 as useGetAllDevices,
   o6 as useGetAllRooms,
-  $6 as useGetCurrentPopoverIdForGroup,
+  A6 as useGetCurrentPopoverIdForGroup,
   _ as useGetDevice,
   V6 as useGetIBasicVolume,
   U6 as useGetIBasicVolumeWithFeedback,
@@ -3958,25 +3965,25 @@ export {
   y6 as useRuntimeInfo,
   Et as useScroll,
   b6 as useServerIsRunningOnProcessorHardware,
-  P6 as useShowIncomingCallModal,
-  L6 as useShowModal,
-  A6 as useShowPopoverById,
+  L6 as useShowIncomingCallModal,
+  P6 as useShowModal,
+  $6 as useShowPopoverById,
   xe as useShowReconnect,
   _6 as useShowShutdownModal,
   Tt as useStateIsSynced,
   Dt as useSystemControl,
   j6 as useSystemUuid,
-  B6 as useTheme,
+  k6 as useTheme,
   _t as useTimeAndDate,
   I6 as useTouchpanelKey,
   jt as useTwoWayDisplayBase,
   C6 as useUserCode,
   R as useWebsocketContext,
   I3 as useWsIsConnected,
-  Le as wsAddEventHandler,
-  k3 as wsConnect,
-  k6 as wsDisconnect,
-  Ae as wsReconnect,
-  $e as wsRemoveEventHandler,
-  Pe as wsSendMessage
+  Pe as wsAddEventHandler,
+  B3 as wsConnect,
+  B6 as wsDisconnect,
+  $e as wsReconnect,
+  Ae as wsRemoveEventHandler,
+  Le as wsSendMessage
 };