@nainudhin/video-meeting-sdk 1.8.3 → 1.9.1

package/dist/meet-sdk.mjs

@@ -352,14 +352,14 @@ function z(r, e, t) {
   const n = r.match(e);
   return n && n.length >= t && parseFloat(n[t], 10);
 }
-function O(r, e, t) {
+function I(r, e, t) {
   if (!r.RTCPeerConnection)
     return;
   if (!Object.getOwnPropertyDescriptor(
     EventTarget.prototype,
     "addEventListener"
   ).writable) {
-    Oe("Unable to polyfill events");
+    Ie("Unable to polyfill events");
     return;
   }
   const s = r.RTCPeerConnection.prototype, i = s.addEventListener;
@@ -409,14 +409,14 @@ function xn(r) {
 function Tn(r) {
   return typeof r != "boolean" ? new Error("Argument type: " + typeof r + ". Please use a boolean.") : (pt = !r, "adapter.js deprecation warnings " + (r ? "disabled" : "enabled"));
 }
-function Oe() {
+function Ie() {
   if (typeof window == "object") {
     if (ft)
       return;
     typeof console < "u" && typeof console.log == "function" && console.log.apply(console, arguments);
   }
 }
-function Ie(r, e) {
+function Oe(r, e) {
   pt && console.warn(r + " is deprecated, please use " + e + " instead.");
 }
 function Rn(r) {
@@ -487,7 +487,7 @@ function Xe(r, e, t) {
     });
   }), s;
 }
-const Ze = Oe;
+const Ze = Ie;
 function mt(r, e) {
   if (e.version >= 64)
     return;
@@ -615,7 +615,7 @@ function bt(r, e) {
         }, this.addEventListener("addstream", this._ontrackpoly)), t.apply(this, arguments);
       };
     } else
-      O(r, "track", (t) => (t.transceiver || Object.defineProperty(
+      I(r, "track", (t) => (t.transceiver || Object.defineProperty(
         t,
         "transceiver",
         { value: { receiver: t.receiver } }
@@ -702,7 +702,7 @@ function vt(r, e) {
     n && (r.RTCPeerConnection.prototype.getReceivers = function() {
       const i = n.apply(this, []);
       return i.forEach((o) => o._pc = this), i;
-    }), O(r, "track", (s) => (s.receiver._pc = s.srcElement, s)), r.RTCRtpReceiver.prototype.getStats = function() {
+    }), I(r, "track", (s) => (s.receiver._pc = s.srcElement, s)), r.RTCRtpReceiver.prototype.getStats = function() {
       const i = this;
       return this._pc.getStats().then((o) => Xe(o, i.track, !1));
     };
@@ -909,7 +909,7 @@ function ge(r, e) {
   });
 }
 function kt(r, e) {
-  e.version > 102 || O(r, "negotiationneeded", (t) => {
+  e.version > 102 || I(r, "negotiationneeded", (t) => {
     const n = t.target;
     if (!((e.version < 72 || n.getConfiguration && n.getConfiguration().sdpSemantics === "plan-b") && n.signalingState !== "stable"))
       return t;
@@ -933,7 +933,7 @@ function xt(r, e) {
     return;
   const n = r && r.MediaStreamTrack;
   if (t.getUserMedia = function(s, i, o) {
-    Ie(
+    Oe(
       "navigator.getUserMedia",
       "navigator.mediaDevices.getUserMedia"
     ), t.mediaDevices.getUserMedia(s).then(i, o);
@@ -1036,13 +1036,13 @@ function Et(r) {
   e && (r.RTCPeerConnection.prototype.getReceivers = function() {
     const n = e.apply(this, []);
     return n.forEach((s) => s._pc = this), n;
-  }), O(r, "track", (t) => (t.receiver._pc = t.srcElement, t)), r.RTCRtpReceiver.prototype.getStats = function() {
+  }), I(r, "track", (t) => (t.receiver._pc = t.srcElement, t)), r.RTCRtpReceiver.prototype.getStats = function() {
     return this._pc.getStats(this.track);
   };
 }
 function wt(r) {
   !r.RTCPeerConnection || "removeStream" in r.RTCPeerConnection.prototype || (r.RTCPeerConnection.prototype.removeStream = function(t) {
-    Ie("removeStream", "removeTrack"), this.getSenders().forEach((n) => {
+    Oe("removeStream", "removeTrack"), this.getSenders().forEach((n) => {
       n.track && t.getTracks().includes(n.track) && this.removeTrack(n);
     });
   });
@@ -1082,7 +1082,7 @@ function At(r, e) {
     return o;
   });
 }
-function Ot(r, e) {
+function It(r, e) {
   if (!(typeof r == "object" && r.RTCRtpSender) || e.version >= 110)
     return;
   const t = r.RTCRtpSender.prototype.getParameters;
@@ -1091,7 +1091,7 @@ function Ot(r, e) {
     return "encodings" in s || (s.encodings = [].concat(this.sendEncodings || [{}])), s;
   });
 }
-function It(r, e) {
+function Ot(r, e) {
   if (!(typeof r == "object" && r.RTCPeerConnection) || e.version >= 110)
     return;
   const t = r.RTCPeerConnection.prototype.createOffer;
@@ -1115,9 +1115,9 @@ const tt = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
   shimAddTransceiver: At,
   shimCreateAnswer: Dt,
-  shimCreateOffer: It,
+  shimCreateOffer: Ot,
   shimGetDisplayMedia: Pn,
-  shimGetParameters: Ot,
+  shimGetParameters: It,
   shimGetStats: Rt,
   shimGetUserMedia: xt,
   shimOnTrack: Tt,
@@ -1246,7 +1246,7 @@ function zt(r) {
       const i = [];
       for (let o = 0; o < n.iceServers.length; o++) {
         let a = n.iceServers[o];
-        a.urls === void 0 && a.url ? (Ie("RTCIceServer.url", "RTCIceServer.urls"), a = JSON.parse(JSON.stringify(a)), a.urls = a.url, delete a.url, i.push(a)) : i.push(n.iceServers[o]);
+        a.urls === void 0 && a.url ? (Oe("RTCIceServer.url", "RTCIceServer.urls"), a = JSON.parse(JSON.stringify(a)), a.urls = a.url, delete a.url, i.push(a)) : i.push(n.iceServers[o]);
       }
       n.iceServers = i;
     }
@@ -1295,7 +1295,7 @@ const nt = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
 function En(r) {
   return r && r.__esModule && Object.prototype.hasOwnProperty.call(r, "default") ? r.default : r;
 }
-var Vt = { exports: {} };
+var Ht = { exports: {} };
 (function(r) {
   const e = {};
   e.generateIdentifier = function() {
@@ -1682,12 +1682,12 @@ t=0 0\r
         return !1;
     return !0;
   }, r.exports = e;
-})(Vt);
-var Ht = Vt.exports;
-const L = /* @__PURE__ */ En(Ht), wn = /* @__PURE__ */ _n({
+})(Ht);
+var Vt = Ht.exports;
+const L = /* @__PURE__ */ En(Vt), wn = /* @__PURE__ */ _n({
   __proto__: null,
   default: L
-}, [Ht]);
+}, [Vt]);
 function J(r) {
   if (!r.RTCIceCandidate || r.RTCIceCandidate && "foundation" in r.RTCIceCandidate.prototype)
     return;
@@ -1711,13 +1711,13 @@ function J(r) {
       }, s;
     }
     return new e(n);
-  }, r.RTCIceCandidate.prototype = e.prototype, O(r, "icecandidate", (t) => (t.candidate && Object.defineProperty(t, "candidate", {
+  }, r.RTCIceCandidate.prototype = e.prototype, I(r, "icecandidate", (t) => (t.candidate && Object.defineProperty(t, "candidate", {
     value: new r.RTCIceCandidate(t.candidate),
     writable: "false"
   }), t));
 }
 function ye(r) {
-  !r.RTCIceCandidate || r.RTCIceCandidate && "relayProtocol" in r.RTCIceCandidate.prototype || O(r, "icecandidate", (e) => {
+  !r.RTCIceCandidate || r.RTCIceCandidate && "relayProtocol" in r.RTCIceCandidate.prototype || I(r, "icecandidate", (e) => {
     if (e.candidate) {
       const t = L.parseCandidate(e.candidate.candidate);
       t.type === "relay" && (e.candidate.relayProtocol = {
@@ -1804,7 +1804,7 @@ function Y(r, e) {
   r.RTCPeerConnection.prototype.createDataChannel = function() {
     const i = n.apply(this, arguments);
     return t(i, this), i;
-  }, O(r, "datachannel", (s) => (t(s.channel, s.target), s));
+  }, I(r, "datachannel", (s) => (t(s.channel, s.target), s));
 }
 function be(r) {
   if (!r.RTCPeerConnection || "connectionState" in r.RTCPeerConnection.prototype)
@@ -1916,7 +1916,7 @@ function An({ window: r } = {}, e = {
   shimFirefox: !0,
   shimSafari: !0
 }) {
-  const t = Oe, n = Rn(r), s = {
+  const t = Ie, n = Rn(r), s = {
     browserDetails: n,
     commonShim: Mn,
     extractVersion: z,
@@ -1936,7 +1936,7 @@ function An({ window: r } = {}, e = {
     case "firefox":
       if (!tt || !me || !e.shimFirefox)
         return t("Firefox shim is not included in this adapter release."), s;
-      t("adapter.js shimming firefox."), s.browserShim = tt, G(r, n), Q(r), xt(r, n), me(r, n), Rt(r, n), Tt(r), wt(r), Pt(r), Et(r), Mt(r), At(r, n), Ot(r, n), It(r, n), Dt(r, n), J(r), be(r), W(r, n), Y(r, n);
+      t("adapter.js shimming firefox."), s.browserShim = tt, G(r, n), Q(r), xt(r, n), me(r, n), Rt(r, n), Tt(r), wt(r), Pt(r), Et(r), Mt(r), At(r, n), It(r, n), Ot(r, n), Dt(r, n), J(r), be(r), W(r, n), Y(r, n);
       break;
     case "safari":
       if (!nt || !e.shimSafari)
@@ -1950,7 +1950,7 @@ function An({ window: r } = {}, e = {
   return s;
 }
 const rt = An({ window: typeof window > "u" ? void 0 : window });
-function I(r, e, t, n) {
+function O(r, e, t, n) {
   Object.defineProperty(r, e, { get: t, set: n, enumerable: !0, configurable: !0 });
 }
 class Kt {
@@ -1971,7 +1971,7 @@ class Kt {
     };
   }
 }
-function On(r) {
+function In(r) {
   let e = 0;
   for (const s of r) e += s.byteLength;
   const t = new Uint8Array(e);
@@ -2031,7 +2031,7 @@ const he = (
       "safari"
     ], this.minFirefoxVersion = 59, this.minChromeVersion = 72, this.minSafariVersion = 605;
   }
-}(), In = (r) => !r || /^[A-Za-z0-9]+(?:[ _-][A-Za-z0-9]+)*$/.test(r), Jt = () => Math.random().toString(36).slice(2), st = {
+}(), On = (r) => !r || /^[A-Za-z0-9]+(?:[ _-][A-Za-z0-9]+)*$/.test(r), Jt = () => Math.random().toString(36).slice(2), st = {
   iceServers: [
     {
       urls: "stun:stun.l.google.com:19302"
@@ -2109,7 +2109,7 @@ class Dn extends Kt {
       }
       return t;
     }(), // Ensure alphanumeric ids
-    this.validateId = In, this.randomToken = Jt;
+    this.validateId = On, this.randomToken = Jt;
   }
 }
 const k = new Dn(), Ln = "PeerJS: ";
@@ -2145,9 +2145,9 @@ class $n {
   }
 }
 var f = new $n(), De = {}, Bn = Object.prototype.hasOwnProperty, C = "~";
-function V() {
+function H() {
 }
-Object.create && (V.prototype = /* @__PURE__ */ Object.create(null), new V().__proto__ || (C = !1));
+Object.create && (H.prototype = /* @__PURE__ */ Object.create(null), new H().__proto__ || (C = !1));
 function Un(r, e, t) {
   this.fn = r, this.context = e, this.once = t || !1;
 }
@@ -2160,10 +2160,10 @@ function Wt(r, e, t, n, s) {
   ] : r._events[o].push(i) : (r._events[o] = i, r._eventsCount++), r;
 }
 function X(r, e) {
-  --r._eventsCount === 0 ? r._events = new V() : delete r._events[e];
+  --r._eventsCount === 0 ? r._events = new H() : delete r._events[e];
 }
 function S() {
-  this._events = new V(), this._eventsCount = 0;
+  this._events = new H(), this._eventsCount = 0;
 }
 S.prototype.eventNames = function() {
   var e = [], t, n;
@@ -2250,7 +2250,7 @@ S.prototype.removeListener = function(e, t, n, s) {
 };
 S.prototype.removeAllListeners = function(e) {
   var t;
-  return e ? (t = C ? C + e : e, this._events[t] && X(this, t)) : (this._events = new V(), this._eventsCount = 0), this;
+  return e ? (t = C ? C + e : e, this._events[t] && X(this, t)) : (this._events = new H(), this._eventsCount = 0), this;
 };
 S.prototype.off = S.prototype.removeListener;
 S.prototype.addListener = S.prototype.on;
@@ -2258,13 +2258,13 @@ S.prefixed = C;
 S.EventEmitter = S;
 De = S;
 var D = {};
-I(D, "ConnectionType", () => w);
-I(D, "PeerErrorType", () => y);
-I(D, "BaseConnectionErrorType", () => ve);
-I(D, "DataConnectionErrorType", () => Le);
-I(D, "SerializationType", () => ie);
-I(D, "SocketEventType", () => E);
-I(D, "ServerMessageType", () => v);
+O(D, "ConnectionType", () => w);
+O(D, "PeerErrorType", () => y);
+O(D, "BaseConnectionErrorType", () => ve);
+O(D, "DataConnectionErrorType", () => Le);
+O(D, "SerializationType", () => ie);
+O(D, "SocketEventType", () => E);
+O(D, "ServerMessageType", () => v);
 var w = /* @__PURE__ */ function(r) {
   return r.Data = "data", r.Media = "media", r;
 }({}), y = /* @__PURE__ */ function(r) {
@@ -2801,7 +2801,7 @@ class le extends $e {
     };
     if (n.data[e.n] = new Uint8Array(e.data), n.count++, this._chunkedData[t] = n, n.total === n.count) {
       delete this._chunkedData[t];
-      const s = On(n.data);
+      const s = In(n.data);
       this._handleDataMessage({
         data: s
       });
@@ -3169,8 +3169,8 @@ const q = class q extends Qt {
 };
 Ae = new WeakMap(), B(q, Ae, q.DEFAULT_KEY = "peerjs");
 let Se = q;
-var Vn = Se;
-class Hn {
+var Hn = Se;
+class Vn {
   constructor(e) {
     this.config = e, this.peer = null, this.localStream = null, this.connections = {}, this.callbacks = {
       onStream: null,
@@ -3188,7 +3188,7 @@ class Hn {
   async initialize(e, t = 0) {
     return new Promise((n, s) => {
       const i = t === 0 ? e : `${e}-r${Math.random().toString(36).slice(2, 6)}`;
-      this.peer = new Vn(i, {
+      this.peer = new Hn(i, {
         host: this.config.peerServer.host,
         port: this.config.peerServer.port,
         path: this.config.peerServer.path || "/peerjs",
@@ -3465,7 +3465,7 @@ function Xn() {
   });
 }
 let ue;
-function H(r) {
+function V(r) {
   return r.reduce((e, t) => e + t.length, 0);
 }
 function K(r, e) {
@@ -3485,17 +3485,17 @@ function Zn(r, e) {
     transform(o, a) {
       for (t.push(o); ; ) {
         if (n === 0) {
-          if (H(t) < 1)
+          if (V(t) < 1)
             break;
           const c = K(t, 1);
           i = (c[0] & 128) === 128, s = c[0] & 127, s < 126 ? n = 3 : s === 126 ? n = 1 : n = 2;
         } else if (n === 1) {
-          if (H(t) < 2)
+          if (V(t) < 2)
             break;
           const c = K(t, 2);
           s = new DataView(c.buffer, c.byteOffset, c.length).getUint16(0), n = 3;
         } else if (n === 2) {
-          if (H(t) < 8)
+          if (V(t) < 8)
             break;
           const c = K(t, 8), h = new DataView(c.buffer, c.byteOffset, c.length), l = h.getUint32(0);
           if (l > Math.pow(2, 21) - 1) {
@@ -3504,7 +3504,7 @@ function Zn(r, e) {
           }
           s = l * Math.pow(2, 32) + h.getUint32(4), n = 3;
         } else {
-          if (H(t) < s)
+          if (V(t) < s)
             break;
           const c = K(t, s);
           a.enqueue(Ue(i ? c : ue.decode(c), e)), n = 0;
@@ -4543,7 +4543,7 @@ function Te(r, e) {
   }
   return r;
 }
-function Or(r, e) {
+function Ir(r, e) {
   return r.data = Re(r.data, e), delete r.attachments, r;
 }
 function Re(r, e) {
@@ -4561,7 +4561,7 @@ function Re(r, e) {
       Object.prototype.hasOwnProperty.call(r, t) && (r[t] = Re(r[t], e));
   return r;
 }
-const Ir = [
+const Or = [
   "connect",
   // used on the client side
   "connect_error",
@@ -4724,7 +4724,7 @@ class Fe extends b {
         return typeof t == "string" || ht(t);
       case g.EVENT:
       case g.BINARY_EVENT:
-        return Array.isArray(t) && (typeof t[0] == "number" || typeof t[0] == "string" && Ir.indexOf(t[0]) === -1);
+        return Array.isArray(t) && (typeof t[0] == "number" || typeof t[0] == "string" && Or.indexOf(t[0]) === -1);
       case g.ACK:
       case g.BINARY_ACK:
         return Array.isArray(t);
@@ -4751,7 +4751,7 @@ class Lr {
    */
   takeBinaryData(e) {
     if (this.buffers.push(e), this.buffers.length === this.reconPack.attachments) {
-      const t = Or(this.reconPack, this.buffers);
+      const t = Ir(this.reconPack, this.buffers);
       return this.finishedReconstruction(), t;
     }
     return null;
@@ -5934,7 +5934,7 @@ class qe {
     this.ctx.fillStyle = "#0d0d0d", this.ctx.fillRect(0, 0, this.width, this.height);
     const e = Array.from(this.videos.values());
     if (e.length === 0) return;
-    const { cols: t, rows: n } = Vr(e.length), s = this.width / t, i = this.height / n;
+    const { cols: t, rows: n } = Hr(e.length), s = this.width / t, i = this.height / n;
     e.forEach((o, a) => {
       const c = a % t, h = Math.floor(a / t), l = c * s, d = h * i;
       this.ctx.fillStyle = "#1a1a1a", this.ctx.fillRect(l, d, s, i);
@@ -5947,10 +5947,10 @@ class qe {
         }
       } else
         qr(this.ctx, o.label || "Peer", l, d, s, i);
-      const Ve = o.label || "Peer";
+      const He = o.label || "Peer";
       this.ctx.font = "bold 16px system-ui, sans-serif";
-      const fn = this.ctx.measureText(Ve), He = 10, pn = 6, gn = fn.width + He * 2, ce = 24, Ke = l + 12, Je = d + i - ce - 12;
-      this.ctx.fillStyle = "rgba(0,0,0,0.65)", this.ctx.fillRect(Ke, Je, gn, ce), this.ctx.fillStyle = "#fff", this.ctx.fillText(Ve, Ke + He, Je + ce - pn - 2);
+      const fn = this.ctx.measureText(He), Ve = 10, pn = 6, gn = fn.width + Ve * 2, ce = 24, Ke = l + 12, Je = d + i - ce - 12;
+      this.ctx.fillStyle = "rgba(0,0,0,0.65)", this.ctx.fillRect(Ke, Je, gn, ce), this.ctx.fillStyle = "#fff", this.ctx.fillText(He, Ke + Ve, Je + ce - pn - 2);
     });
   }
   addStream(e, t, n = {}) {
@@ -6021,7 +6021,7 @@ function qr(r, e, t, n, s, i) {
   const o = t + s / 2, a = n + i / 2, c = Math.min(s, i) * 0.22;
   r.fillStyle = jr(e), r.beginPath(), r.arc(o, a, c, 0, Math.PI * 2), r.fill(), r.fillStyle = "#fff", r.font = `600 ${Math.floor(c)}px system-ui, sans-serif`, r.textAlign = "center", r.textBaseline = "middle", r.fillText(Fr(e), o, a + 1), r.textAlign = "start", r.textBaseline = "alphabetic";
 }
-function Vr(r) {
+function Hr(r) {
   if (r <= 1) return { cols: 1, rows: 1 };
   if (r === 2) return { cols: 2, rows: 1 };
   if (r <= 4) return { cols: 2, rows: 2 };
@@ -6030,7 +6030,7 @@ function Vr(r) {
   const e = 4;
   return { cols: e, rows: Math.ceil(r / e) };
 }
-function Hr(r, e) {
+function Vr(r, e) {
   return r.includes("pdf") || /\.pdf$/i.test(e) ? "📕" : r.includes("word") || /\.docx?$/i.test(e) ? "📘" : r.includes("sheet") || r.includes("excel") || /\.(xlsx?|csv)$/i.test(e) ? "📗" : r.startsWith("text/") ? "📄" : "📎";
 }
 class Kr {
@@ -6118,9 +6118,13 @@ class Kr {
     const o = document.createElement("div");
     o.id = `video-${e}`, o.dataset.peerId = e, o.style.cssText = "position: relative; background-color: #2a2a2a; border-radius: 8px; overflow: hidden; aspect-ratio: 16/9;";
     const a = document.createElement("video");
-    a.srcObject = t, a.autoplay = !0, a.playsInline = !0, a.muted = n, a.style.cssText = "width: 100%; height: 100%; object-fit: cover;";
-    const c = document.createElement("div");
-    c.textContent = n ? "You" : s || "Peer", c.style.cssText = "position: absolute; bottom: 10px; left: 10px; background-color: rgba(0,0,0,0.7); padding: 5px 10px; border-radius: 4px; font-size: 14px;", o.appendChild(a), o.appendChild(c), i.appendChild(o), this.videoElements[e] = o;
+    a.srcObject = t, a.autoplay = !0, a.playsInline = !0, a.muted = n;
+    const c = t && t.getVideoTracks && t.getVideoTracks().some((u) => !(u.getSettings ? u.getSettings() : {}).displaySurface), h = n && c;
+    a.style.cssText = "width: 100%; height: 100%; object-fit: cover;" + (h ? " transform: scaleX(-1);" : ""), a.dataset.mirror = h ? "1" : "0";
+    const l = document.createElement("div");
+    l.textContent = n ? "You" : s || "Peer", l.style.cssText = "position: absolute; bottom: 10px; left: 10px; background-color: rgba(0,0,0,0.7); padding: 5px 10px; border-radius: 4px; font-size: 14px;", o.appendChild(a), o.appendChild(l);
+    const d = i.querySelector("#others-strip");
+    d && e !== this._presentingPeer ? d.appendChild(o) : i.appendChild(o), this.videoElements[e] = o, this._presentingPeer && this.setPresentingPeer(this._presentingPeer);
   }
   renderPanelTabs() {
     return [
@@ -6185,7 +6189,7 @@ class Kr {
         <img src="${i}" alt="${s}" style="max-width:100%; border-radius:6px; display:block;" />
         <div style="font-size:11px; color:#888; margin-top:2px;">${s} · ${n} KB</div>
       </a>`;
-    const o = Hr(e.contentType || "", e.fileName || "");
+    const o = Vr(e.contentType || "", e.fileName || "");
     return `<a href="${i}" target="_blank" rel="noreferrer" style="display:flex; align-items:center; gap:8px; padding:8px 10px; background:#333; border-radius:6px; text-decoration:none; color:#ddd; font-size:13px;">
       <span style="font-size:22px;">${o}</span>
       <div style="min-width:0; flex:1; overflow:hidden;">
@@ -6302,20 +6306,43 @@ class Kr {
   setPresentingPeer(e) {
     if (!this.container) return;
     const t = this.container.querySelector("#video-container");
-    t && (e ? (t.setAttribute("data-hero", e), t.style.gridTemplateColumns = "1fr", t.style.gridAutoRows = "auto") : (t.removeAttribute("data-hero"), t.style.gridTemplateColumns = "repeat(auto-fit, minmax(300px, 1fr))", t.style.gridAutoRows = "minmax(200px, 1fr)"), Object.entries(this.videoElements).forEach(([n, s]) => {
-      e && n === e ? (s.style.gridColumn = "1 / -1", s.style.aspectRatio = "16 / 9", s.style.maxHeight = "65vh") : e ? (s.style.gridColumn = "", s.style.maxHeight = "160px", s.style.aspectRatio = "16 / 9") : (s.style.gridColumn = "", s.style.maxHeight = "", s.style.aspectRatio = "16 / 9");
-    }));
+    if (!t) return;
+    this._presentingPeer = e || null, e ? (t.setAttribute("data-hero", e), t.style.display = "flex", t.style.flexDirection = "column", t.style.gap = "10px", t.style.gridTemplateColumns = "", t.style.gridAutoRows = "", t.style.overflow = "hidden") : (t.removeAttribute("data-hero"), t.style.display = "grid", t.style.flexDirection = "", t.style.gridTemplateColumns = "repeat(auto-fit, minmax(300px, 1fr))", t.style.gridAutoRows = "minmax(200px, 1fr)", t.style.overflow = "");
+    let n = t.querySelector("#others-strip");
+    if (e)
+      n || (n = document.createElement("div"), n.id = "others-strip", n.style.cssText = "flex: 0 0 auto; display:flex; gap:8px; height:120px; overflow-x:auto; overflow-y:hidden;", t.appendChild(n));
+    else if (n) {
+      for (; n.firstChild; ) t.appendChild(n.firstChild);
+      n.remove();
+    }
+    Object.entries(this.videoElements).forEach(([s, i]) => {
+      e && s === e ? (i.parentNode === n && t.insertBefore(i, n), i.style.gridColumn = "", i.style.flex = "1 1 auto", i.style.minHeight = "0", i.style.width = "100%", i.style.aspectRatio = "", i.style.maxHeight = "") : e ? (i.parentNode !== n && n.appendChild(i), i.style.flex = "0 0 auto", i.style.width = "213px", i.style.height = "120px", i.style.minHeight = "", i.style.aspectRatio = "", i.style.maxHeight = "", i.style.gridColumn = "") : (i.parentNode === n && t.appendChild(i), i.style.flex = "", i.style.width = "", i.style.height = "", i.style.minHeight = "", i.style.gridColumn = "", i.style.maxHeight = "", i.style.aspectRatio = "16 / 9");
+    });
   }
-  setParticipants(e) {
+  setParticipants(e, t = {}) {
     if (!this.container) return;
-    const t = this.container.querySelector("#participants-list"), n = this.container.querySelector("#participants-count");
-    n && (n.textContent = `(${e.length})`), t && (t.innerHTML = e.map((s) => {
-      const i = s.isYou ? " (You)" : s.isHost ? " · host" : "", o = this.escapeHtml(s.label) + i;
+    const n = this.container.querySelector("#participants-list"), s = this.container.querySelector("#participants-count");
+    if (s && (s.textContent = `(${e.length})`), !n) return;
+    const i = !!t.showControls;
+    n.innerHTML = e.map((o, a) => {
+      const c = o.isYou ? " (You)" : o.isHost ? " · host" : "", h = this.escapeHtml(o.label) + c, l = `<span style="display:inline-block; width:8px; height:8px; border-radius:50%; background:${o.isSharing ? "#a3e635" : "#6366f1"};"></span>`, d = i && !o.isHost && !o.isYou && o.userId ? `<span style="margin-left:auto; display:inline-flex; gap:4px;">
+              <button data-idx="${a}" data-perm="code" title="Toggle code edit" style="padding:2px 6px; font-size:10px; border-radius:4px; border:1px solid ${o.canEditCode ? "#22c55e" : "#3a3a3a"}; background:${o.canEditCode ? "#052e16" : "#1a1a1a"}; color:${o.canEditCode ? "#4ade80" : "#888"}; cursor:pointer;">Code</button>
+              <button data-idx="${a}" data-perm="board" title="Toggle whiteboard draw" style="padding:2px 6px; font-size:10px; border-radius:4px; border:1px solid ${o.canDrawBoard ? "#22c55e" : "#3a3a3a"}; background:${o.canDrawBoard ? "#052e16" : "#1a1a1a"}; color:${o.canDrawBoard ? "#4ade80" : "#888"}; cursor:pointer;">Board</button>
+            </span>` : "";
       return `<div style="font-size:12px; color:#ccc; padding:2px 0; display:flex; align-items:center; gap:6px;">
-          <span style="display:inline-block; width:8px; height:8px; border-radius:50%; background:${s.isSharing ? "#a3e635" : "#6366f1"};"></span>
-          ${o}${s.isSharing ? " · presenting" : ""}
+          ${l}
+          ${h}${o.isSharing ? " · presenting" : ""}
+          ${d}
         </div>`;
-    }).join(""));
+    }).join(""), i && this._onParticipantPermToggle && n.querySelectorAll("button[data-perm]").forEach((o) => {
+      o.addEventListener("click", () => {
+        const a = e[parseInt(o.getAttribute("data-idx"), 10)], c = o.getAttribute("data-perm");
+        this._onParticipantPermToggle(a, c);
+      });
+    });
+  }
+  onParticipantPermToggle(e) {
+    this._onParticipantPermToggle = e;
   }
   setPauseButtonVisible(e) {
     const t = this.container && this.container.querySelector("#toggle-pause");
@@ -6592,7 +6619,7 @@ class Zr {
       recordingVideoBps: d,
       recordingAudioBps: u,
       panels: m
-    }, this.myRole = null, this.roleResolvers = [], this.currentRoom = this.config.roomId, this.currentUser = this.config.user, this.peerManager = new Hn(this.config), this.socketManager = new Nr(this.config), this.mediaManager = new zr(), this.uiManager = new Kr({
+    }, this.myRole = null, this.roleResolvers = [], this.currentRoom = this.config.roomId, this.currentUser = this.config.user, this.peerManager = new Vn(this.config), this.socketManager = new Nr(this.config), this.mediaManager = new zr(), this.uiManager = new Kr({
       recording: n,
       screenShare: e.screenShare !== !1,
       panels: m
@@ -6663,18 +6690,28 @@ class Zr {
     const e = [];
     if (this.currentUser && e.push({
       label: this.currentUser.name || "You",
+      userId: this.currentUser.id,
       isYou: !0,
       isHost: this.myRole === "organizer",
       isSharing: this.peerManager && this.peerManager.isScreenSharing && this.peerManager.isScreenSharing()
-    }), this.peerLabels)
-      for (const [t, n] of this.peerLabels.entries())
+    }), this.peerLabels) {
+      const t = `${this.config.workspace}-${this.currentRoom}-`;
+      for (const [n, s] of this.peerLabels.entries()) {
+        const i = n.startsWith(t) ? n.slice(t.length) : n;
         e.push({
-          label: n,
+          label: s,
+          userId: i,
           isYou: !1,
-          isHost: this.hostPeerId === t,
-          isSharing: this.presentingPeerId === t
+          isHost: this.hostPeerId === n,
+          isSharing: this.presentingPeerId === n,
+          canEditCode: this.codePermsByUser ? !!this.codePermsByUser.get(i) : !1,
+          canDrawBoard: this.boardPermsByUser ? !!this.boardPermsByUser.get(i) : !1
         });
-    this.uiManager.setParticipants(e);
+      }
+    }
+    this.uiManager.setParticipants(e, {
+      showControls: this.myRole === "organizer"
+    });
   }
   waitForRole(e = 3e3) {
     return this.myRole ? Promise.resolve(this.myRole) : new Promise((t) => {
@@ -6716,7 +6753,17 @@ class Zr {
     }).catch((s) => console.warn("Chat history fetch failed:", s && s.message)), console.log("MeetSDK mounted");
   }
   setupCollabPanels() {
-    if (this.uiManager && !this.uiManager._panelWired && (this.uiManager.wirePanelTabs(), this.uiManager._panelWired = !0), this.config.panels.includes("code")) {
+    if (this.uiManager && !this.uiManager._panelWired && (this.uiManager.wirePanelTabs(), this.uiManager._panelWired = !0), this.codePermsByUser = this.codePermsByUser || /* @__PURE__ */ new Map(), this.boardPermsByUser = this.boardPermsByUser || /* @__PURE__ */ new Map(), this.uiManager && this.uiManager.onParticipantPermToggle && this.uiManager.onParticipantPermToggle((e, t) => {
+      if (!(this.myRole !== "organizer" || !e || !e.userId)) {
+        if (t === "code") {
+          const n = !this.codePermsByUser.get(e.userId);
+          this.grantCodeEdit(e.userId, e.label, n);
+        } else if (t === "board") {
+          const n = !this.boardPermsByUser.get(e.userId);
+          this.grantWhiteboardDraw(e.userId, e.label, n);
+        }
+      }
+    }), this.config.panels.includes("code")) {
       const e = this.uiManager.getPanelSlot("code");
       e && (this.codeSandbox = new Jr({
         container: e,
@@ -6735,14 +6782,16 @@ class Zr {
         if (t && Array.isArray(t.editPermissions)) {
           const n = t.editPermissions.find((s) => s.userId === this.currentUser.id);
           this._codeEditPermission = !!(n && n.canEdit);
+          for (const s of t.editPermissions) this.codePermsByUser.set(s.userId, !!s.canEdit);
         }
-        this.codeSandbox.handleStateSync(t);
+        this.codeSandbox.handleStateSync(t), this.refreshParticipantsPanel();
       }), this.socketManager.onRaw("code-permission-changed", (t) => {
-        if (t && t.targetUserId === this.currentUser.id && (this._codeEditPermission = !!t.canEdit), Array.isArray(t && t.editPermissions)) {
+        if (t && t.targetUserId === this.currentUser.id && (this._codeEditPermission = !!t.canEdit), t && t.targetUserId && this.codePermsByUser.set(t.targetUserId, !!t.canEdit), Array.isArray(t && t.editPermissions)) {
           const n = t.editPermissions.find((s) => s.userId === this.currentUser.id);
           n && (this._codeEditPermission = !!n.canEdit);
+          for (const s of t.editPermissions) this.codePermsByUser.set(s.userId, !!s.canEdit);
         }
-        this.codeSandbox.refreshPermissionUI();
+        this.codeSandbox.refreshPermissionUI(), this.refreshParticipantsPanel();
       }), this.socketManager.emit("code-state-request", { roomId: this.currentRoom }));
     }
     if (this.config.panels.includes("whiteboard")) {
@@ -6763,14 +6812,16 @@ class Zr {
         if (t && Array.isArray(t.drawPermissions)) {
           const n = t.drawPermissions.find((s) => s.userId === this.currentUser.id);
           this._whiteboardDrawPermission = !!(n && n.canDraw);
+          for (const s of t.drawPermissions) this.boardPermsByUser.set(s.userId, !!s.canDraw);
         }
-        this.whiteboard.handleStateSync(t);
+        this.whiteboard.handleStateSync(t), this.refreshParticipantsPanel();
       }), this.socketManager.onRaw("whiteboard-permission-changed", (t) => {
-        if (t && t.targetUserId === this.currentUser.id && (this._whiteboardDrawPermission = !!t.canDraw), Array.isArray(t && t.drawPermissions)) {
+        if (t && t.targetUserId === this.currentUser.id && (this._whiteboardDrawPermission = !!t.canDraw), t && t.targetUserId && this.boardPermsByUser.set(t.targetUserId, !!t.canDraw), Array.isArray(t && t.drawPermissions)) {
           const n = t.drawPermissions.find((s) => s.userId === this.currentUser.id);
           n && (this._whiteboardDrawPermission = !!n.canDraw);
+          for (const s of t.drawPermissions) this.boardPermsByUser.set(s.userId, !!s.canDraw);
         }
-        this.whiteboard.refreshPermissionUI();
+        this.whiteboard.refreshPermissionUI(), this.refreshParticipantsPanel();
       }), this.socketManager.emit("whiteboard-state-request", { roomId: this.currentRoom }));
     }
   }