@livelayer/react 0.5.15 → 0.5.17

package/dist/index.mjs

@@ -1,6 +1,6 @@
 "use client";
-import { jsxs as _, jsx as n, Fragment as yt } from "react/jsx-runtime";
-import { Component as pn, useState as S, useRef as N, useEffect as A, useCallback as L, useMemo as ot, forwardRef as vt, createElement as hn } from "react";
+import { jsxs as _, jsx as n, Fragment as vt } from "react/jsx-runtime";
+import { Component as pn, useState as S, useRef as A, useEffect as N, useCallback as L, useMemo as lt, forwardRef as bt, createElement as hn } from "react";
 import { LiveKitSession as mn } from "@livelayer/sdk";
 import { createLocalAudioTrack as gn, Track as Xt, createLocalVideoTrack as yn } from "livekit-client";
 class vn extends pn {
@@ -34,8 +34,8 @@ class vn extends pn {
   }
 }
 function bn(e) {
-  const [t, r] = S("idle"), [i, o] = S("idle"), [l, c] = S([]), [d, f] = S(null), [g, b] = S(null), [s, a] = S(null), [k, E] = S(!1), [C, v] = S(null), w = N(null), z = N(e.onDataMessage);
-  z.current = e.onDataMessage, A(() => {
+  const [t, r] = S("idle"), [i, o] = S("idle"), [l, c] = S([]), [d, f] = S(null), [y, b] = S(null), [s, a] = S(null), [k, E] = S(!1), [C, v] = S(null), w = A(null), z = A(e.onDataMessage);
+  z.current = e.onDataMessage, N(() => {
     const R = {
       onConnectionStateChange: (D) => {
         r(D), D === "connected" && v(null);
@@ -84,7 +84,7 @@ function bn(e) {
   }, []), H = L(() => {
     const R = w.current;
     R && R.disconnect();
-  }, []), h = L(() => {
+  }, []), m = L(() => {
     var R;
     return ((R = w.current) == null ? void 0 : R.getRoom()) ?? null;
   }, []);
@@ -93,18 +93,18 @@ function bn(e) {
     agentState: i,
     transcript: l,
     agentConfig: d,
-    videoElement: g,
+    videoElement: y,
     audioElement: s,
     canResume: k,
     error: C,
     connect: I,
     disconnect: H,
-    getRoom: h,
+    getRoom: m,
     session: w.current
   };
 }
 function wn() {
-  const e = N(null), t = N(null), r = N(null), i = N(null), o = N(/* @__PURE__ */ new Set()), l = N(null), c = L(() => {
+  const e = A(null), t = A(null), r = A(null), i = A(null), o = A(/* @__PURE__ */ new Set()), l = A(null), c = L(() => {
     const s = t.current;
     if (!s) {
       i.current = null;
@@ -150,7 +150,7 @@ function wn() {
       }
     },
     [d, c]
-  ), g = L(() => {
+  ), y = L(() => {
     if (i.current !== null && (cancelAnimationFrame(i.current), i.current = null), r.current) {
       try {
         r.current.disconnect();
@@ -161,8 +161,8 @@ function wn() {
   }, []), b = L((s) => (o.current.add(s), () => {
     o.current.delete(s);
   }), []);
-  return A(() => () => {
-    if (g(), t.current) {
+  return N(() => () => {
+    if (y(), t.current) {
       try {
         t.current.disconnect();
       } catch {
@@ -177,10 +177,10 @@ function wn() {
       e.current = null;
     }
     o.current.clear(), l.current = null;
-  }, [g]), { attach: f, detach: g, subscribe: b };
+  }, [y]), { attach: f, detach: y, subscribe: b };
 }
 function _n() {
-  const [e, t] = S(!1), [r, i] = S(null), o = N(null), l = N(null), c = L(
+  const [e, t] = S(!1), [r, i] = S(null), o = A(null), l = A(null), c = L(
     async (s, a) => {
       if (o.current && l.current) {
         try {
@@ -208,7 +208,7 @@ function _n() {
   }, []), f = L((s) => {
     const a = o.current;
     a && (s && !a.isMuted ? (a.mute(), t(!0)) : !s && a.isMuted && (a.unmute(), t(!1)));
-  }, []), g = L(() => {
+  }, []), y = L(() => {
     const s = o.current, a = l.current;
     if (s && a) {
       try {
@@ -225,16 +225,16 @@ function _n() {
     toggleMute: d,
     setMuted: f,
     setupMic: c,
-    teardownMic: g,
+    teardownMic: y,
     clearError: b
   };
 }
 const xn = { resolution: { width: 640, height: 480, frameRate: 24 } };
 function kn() {
-  const [e, t] = S(!1), [r, i] = S(null), [o, l] = S(null), [c, d] = S(""), f = N(null), g = N(null), b = L((w) => {
+  const [e, t] = S(!1), [r, i] = S(null), [o, l] = S(null), [c, d] = S(""), f = A(null), y = A(null), b = L((w) => {
     f.current = w;
   }, []), s = L(() => {
-    const w = f.current, z = g.current;
+    const w = f.current, z = y.current;
     if (z && w) {
       const I = w.localParticipant.getTrackPublication(Xt.Source.Camera);
       if (I != null && I.track) {
@@ -246,7 +246,7 @@ function kn() {
       } else
         z.stop();
     }
-    g.current = null, l(null), t(!1);
+    y.current = null, l(null), t(!1);
   }, []), a = L(async (w) => {
     const z = f.current;
     if (z) {
@@ -255,9 +255,9 @@ function kn() {
         const I = { ...xn };
         w && (I.deviceId = w);
         const H = await yn(I);
-        await z.localParticipant.publishTrack(H), g.current = H;
-        const h = H.attach();
-        l(h), t(!0), w && d(w);
+        await z.localParticipant.publishTrack(H), y.current = H;
+        const m = H.attach();
+        l(m), t(!0), w && d(w);
         try {
           z.localParticipant.publishData(
             new TextEncoder().encode(JSON.stringify({ type: "user_camera_on" })),
@@ -277,8 +277,8 @@ function kn() {
   }, [s, a]), C = L(() => {
     s(), f.current = null, i(null), d("");
   }, [s]), v = L(() => i(null), []);
-  return A(() => () => {
-    g.current && g.current.stop();
+  return N(() => () => {
+    y.current && y.current.stop();
   }, []), {
     isEnabled: e,
     error: r,
@@ -292,9 +292,9 @@ function kn() {
   };
 }
 function Ln() {
-  const [e, t] = S(!1), [r, i] = S(null), [o, l] = S(null), c = N(null), d = L((a) => {
+  const [e, t] = S(!1), [r, i] = S(null), [o, l] = S(null), c = A(null), d = L((a) => {
     c.current = a;
-  }, []), f = L(() => l(null), []), g = L(async () => {
+  }, []), f = L(() => l(null), []), y = L(async () => {
     const a = c.current;
     if (a) {
       if (e) {
@@ -340,7 +340,7 @@ function Ln() {
       }
     f(), t(!1), i(null), c.current = null;
   }, [e, f]), s = L(() => i(null), []);
-  return { isEnabled: e, error: r, previewEl: o, toggle: g, attachRoom: d, teardown: b, clearError: s };
+  return { isEnabled: e, error: r, previewEl: o, toggle: y, attachRoom: d, teardown: b, clearError: s };
 }
 function Sn() {
   const [e, t] = S([]), [r, i] = S([]), o = L(async () => {
@@ -351,7 +351,7 @@ function Sn() {
       } catch {
       }
   }, []);
-  return A(() => {
+  return N(() => {
     if (o(), typeof navigator > "u" || !navigator.mediaDevices) return;
     const l = () => void o();
     return navigator.mediaDevices.addEventListener("devicechange", l), () => navigator.mediaDevices.removeEventListener("devicechange", l);
@@ -359,14 +359,14 @@ function Sn() {
 }
 function Cn(e, t, r = !1) {
   const [i, o] = S(null), [l, c] = S(null), [d, f] = S(!r && !!e);
-  return A(() => {
+  return N(() => {
     if (r || !e) {
       f(!1);
       return;
     }
-    const g = new AbortController(), b = t || "https://app.livelayer.studio";
+    const y = new AbortController(), b = t || "https://app.livelayer.studio";
     return f(!0), c(null), fetch(`${b}/api/widget/agent/${encodeURIComponent(e)}`, {
-      signal: g.signal
+      signal: y.signal
     }).then(async (s) => {
       if (!s.ok) {
         const a = await s.json().catch(() => ({}));
@@ -374,10 +374,10 @@ function Cn(e, t, r = !1) {
       }
       return s.json();
     }).then((s) => {
-      g.signal.aborted || (o(s), f(!1));
+      y.signal.aborted || (o(s), f(!1));
     }).catch((s) => {
-      g.signal.aborted || (c(s instanceof Error ? s.message : "Agent lookup failed"), f(!1));
-    }), () => g.abort();
+      y.signal.aborted || (c(s instanceof Error ? s.message : "Agent lookup failed"), f(!1));
+    }), () => y.abort();
   }, [e, t, r]), { info: i, error: l, loading: d };
 }
 function En(e) {
@@ -419,23 +419,23 @@ function In({
   persistKey: i = "ll-widget",
   disablePersistence: o = !1
 } = {}) {
-  const l = `${i}:display-mode`, c = N(!1), [d, f] = An({
+  const l = `${i}:display-mode`, c = A(!1), [d, f] = An({
     value: e,
     defaultValue: t,
-    onChange: (g) => {
-      e === void 0 && !o && Nn(l, g), r == null || r(g);
+    onChange: (y) => {
+      e === void 0 && !o && Nn(l, y), r == null || r(y);
     }
   });
-  return A(() => {
+  return N(() => {
     if (c.current || (c.current = !0, o || e !== void 0)) return;
-    const g = Mn(En(l));
-    g && g !== d && f(g);
+    const y = Mn(En(l));
+    y && y !== d && f(y);
   }, []), [d, f];
 }
 const Tn = 640;
 function Pn(e = Tn) {
   const [t, r] = S(!1);
-  return A(() => {
+  return N(() => {
     if (e === !1) {
       r(!1);
       return;
@@ -448,16 +448,16 @@ function Pn(e = Tn) {
     });
   }, [e]), t;
 }
-const Pt = "__llHistoryPatched", lt = "ll:pathname";
+const Pt = "__llHistoryPatched", at = "ll:pathname";
 function Dn() {
   if (typeof window > "u" || window.history[Pt]) return;
   const e = window.history.pushState, t = window.history.replaceState;
   window.history.pushState = function(...r) {
     const i = e.apply(this, r);
-    return window.dispatchEvent(new Event(lt)), i;
+    return window.dispatchEvent(new Event(at)), i;
   }, window.history.replaceState = function(...r) {
     const i = t.apply(this, r);
-    return window.dispatchEvent(new Event(lt)), i;
+    return window.dispatchEvent(new Event(at)), i;
   }, window.history[Pt] = !0;
 }
 function Dt() {
@@ -467,12 +467,12 @@ function $n(e) {
   const [t, r] = S(
     () => e ?? Dt()
   );
-  return A(() => {
+  return N(() => {
     if (e !== void 0) return;
     Dn();
     const i = () => r(Dt());
-    return i(), window.addEventListener("popstate", i), window.addEventListener(lt, i), () => {
-      window.removeEventListener("popstate", i), window.removeEventListener(lt, i);
+    return i(), window.addEventListener("popstate", i), window.addEventListener(at, i), () => {
+      window.removeEventListener("popstate", i), window.removeEventListener(at, i);
     };
   }, [e]), e ?? t;
 }
@@ -503,7 +503,7 @@ function Wn(e, t, r) {
   return e === void 0 ? !0 : zt(r, e) ? !1 : t && t.length > 0 ? zt(t, e) : !0;
 }
 function Fn(e, t, r) {
-  return ot(
+  return lt(
     () => Wn(e, t, r),
     [e, t, r]
   );
@@ -632,15 +632,15 @@ const Jn = ({
   avatarImageUrl: l,
   agentName: c
 }) => {
-  const d = Vn(e), f = d === "right" ? "left" : "right", g = t ? 80 : 72, b = !!l, [s, a] = S(null), [k, E] = S(!1), C = N(null), v = N(!1), w = L(
+  const d = Vn(e), f = d === "right" ? "left" : "right", y = t ? 80 : 72, b = !!l, [s, a] = S(null), [k, E] = S(!1), C = A(null), v = A(!1), w = L(
     (M) => {
       if (typeof window > "u") return M;
-      const O = g / 2, W = qt + O, J = window.innerHeight - qt - O;
+      const O = y / 2, W = qt + O, J = window.innerHeight - qt - O;
       return J < W ? Math.max(W, M) : Math.max(W, Math.min(J, M));
     },
-    [g]
+    [y]
   );
-  A(() => {
+  N(() => {
     const M = Gn();
     a(w(M ?? window.innerHeight / 2));
     const O = () => {
@@ -683,7 +683,7 @@ const Jn = ({
       }
     },
     []
-  ), h = L(() => {
+  ), m = L(() => {
     if (v.current) {
       v.current = !1;
       return;
@@ -709,7 +709,7 @@ const Jn = ({
     r ? "ll-hidden--speaking" : null,
     k ? "is-dragging" : null,
     b ? "ll-hidden--with-avatar" : null
-  ].filter(Boolean).join(" "), D = s === null ? void 0 : { top: `${s - g / 2}px`, transform: "none" };
+  ].filter(Boolean).join(" "), D = s === null ? void 0 : { top: `${s - y / 2}px`, transform: "none" };
   return /* @__PURE__ */ n(
     "button",
     {
@@ -719,7 +719,7 @@ const Jn = ({
       onPointerMove: I,
       onPointerUp: H,
       onPointerCancel: H,
-      onClick: h,
+      onClick: m,
       onKeyDown: R,
       "aria-label": o,
       "data-position": e,
@@ -729,7 +729,7 @@ const Jn = ({
         // as the click affordance), then the circular avatar photo
         // taking the rest of the tab. Reinforces "this is an
         // avatar-based experience" even when collapsed.
-        /* @__PURE__ */ _(yt, { children: [
+        /* @__PURE__ */ _(vt, { children: [
           /* @__PURE__ */ n(
             Bt,
             {
@@ -764,11 +764,11 @@ const Jn = ({
   className: o,
   barClassName: l
 }) => {
-  const c = N(null), d = N([]), f = ot(() => {
+  const c = A(null), d = A([]), f = lt(() => {
     const b = (Math.sqrt(5) - 1) / 2;
     return Array.from({ length: t }, (s, a) => 0.5 + a * b % 1 * 0.5);
   }, [t]);
-  A(() => e.subscribe((s) => {
+  N(() => e.subscribe((s) => {
     for (let a = 0; a < t; a++) {
       const k = d.current[a];
       if (!k) continue;
@@ -776,8 +776,8 @@ const Jn = ({
       k.style.height = `${E}px`;
     }
   }), [e, t, r, i, f]);
-  const g = ["ll-waveform", o].filter(Boolean).join(" ");
-  return /* @__PURE__ */ n("div", { ref: c, className: g, "aria-hidden": "true", children: Array.from({ length: t }, (b, s) => /* @__PURE__ */ n(
+  const y = ["ll-waveform", o].filter(Boolean).join(" ");
+  return /* @__PURE__ */ n("div", { ref: c, className: y, "aria-hidden": "true", children: Array.from({ length: t }, (b, s) => /* @__PURE__ */ n(
     "div",
     {
       ref: (a) => {
@@ -798,7 +798,7 @@ const Jn = ({
   audioLevel: c,
   onExpand: d,
   onToggleMute: f,
-  onClose: g
+  onClose: y
 }) => t ? /* @__PURE__ */ n(
   "div",
   {
@@ -906,7 +906,7 @@ const Jn = ({
           {
             type: "button",
             className: "ll-minimized__btn ll-minimized__btn--close",
-            onClick: g,
+            onClick: y,
             "aria-label": "Close widget",
             children: /* @__PURE__ */ n(Un, { className: "ll-minimized__icon" })
           }
@@ -921,8 +921,8 @@ const Jn = ({
   className: i,
   style: o
 }) => {
-  const [l, c] = S(!1), d = N(e);
-  if (A(() => {
+  const [l, c] = S(!1), d = A(e);
+  if (N(() => {
     d.current !== e && (d.current = e, c(!1));
   }, [e]), !e) return null;
   const f = {
@@ -962,7 +962,7 @@ const Jn = ({
   branding: c,
   teamMembers: d,
   currentTeamMemberId: f,
-  isSwitchingTeamMember: g,
+  isSwitchingTeamMember: y,
   teamSwitcherOpen: b,
   onToggleTeamSwitcher: s,
   onSelectTeamMember: a,
@@ -974,7 +974,7 @@ const Jn = ({
   canResume: z,
   needsUserGesture: I,
   error: H,
-  isMuted: h,
+  isMuted: m,
   micError: R,
   micDevices: q,
   isCameraEnabled: D,
@@ -984,11 +984,11 @@ const Jn = ({
   isScreenShareEnabled: J,
   screenPreviewEl: ne,
   isSpeakerMuted: ye,
-  allowCamera: Je,
-  allowScreenShare: Ke,
-  allowTyping: Xe,
-  avatarVideoContainerRef: Qe,
-  agentVideoEl: ee,
+  allowCamera: Ke,
+  allowScreenShare: Xe,
+  allowTyping: Qe,
+  avatarVideoContainerRef: Ze,
+  agentVideoEl: te,
   micGateOpen: ae,
   onConnect: ve,
   onDisconnect: xe,
@@ -997,32 +997,32 @@ const Jn = ({
   onToggleMute: Se,
   onToggleCamera: Ce,
   onSwitchCameraDevice: V,
-  onToggleScreenShare: st,
-  onToggleSpeaker: ct,
-  onSendMessage: Ze,
+  onToggleScreenShare: ct,
+  onToggleSpeaker: dt,
+  onSendMessage: et,
   onMinimize: ce,
   onClose: Ee,
   onClearMicError: He
 }) => {
   var Ie;
   const be = ((d == null ? void 0 : d.length) ?? 0) > 1, Ne = C === "connecting" || C === "connected", G = C === "connected", Q = C === "idle" || C === "disconnected" || C === "error", [Ae, re] = S(!1);
-  A(() => {
-    if (!ee) {
+  N(() => {
+    if (!te) {
       re(!1);
       return;
     }
-    if (!ee.paused && ee.readyState >= 2) {
+    if (!te.paused && te.readyState >= 2) {
       re(!0);
       return;
     }
     re(!1);
     const p = () => re(!0);
-    return ee.addEventListener("playing", p), ee.addEventListener("loadeddata", p), () => {
-      ee.removeEventListener("playing", p), ee.removeEventListener("loadeddata", p);
+    return te.addEventListener("playing", p), te.addEventListener("loadeddata", p), () => {
+      te.removeEventListener("playing", p), te.removeEventListener("loadeddata", p);
     };
-  }, [ee]);
+  }, [te]);
   const [se, we] = S(!1);
-  A(() => {
+  N(() => {
     if (!G) {
       we(!1);
       return;
@@ -1031,16 +1031,16 @@ const Jn = ({
     const p = setTimeout(() => we(!0), 8e3);
     return () => clearTimeout(p);
   }, [G, Ae]);
-  const Oe = C === "connecting" || G && !!i && !Ae && !se, te = N(null), ie = N(null);
-  A(() => {
-    const p = te.current;
+  const Oe = C === "connecting" || G && !!i && !Ae && !se, ee = A(null), ie = A(null);
+  N(() => {
+    const p = ee.current;
     p && (p.innerHTML = "", M && (M.style.width = "100%", M.style.height = "100%", M.style.objectFit = "cover", M.style.transform = "scaleX(-1)", p.appendChild(M)));
-  }, [M]), A(() => {
+  }, [M]), N(() => {
     const p = ie.current;
     p && (p.innerHTML = "", ne && (ne.style.width = "100%", ne.style.height = "100%", ne.style.objectFit = "contain", p.appendChild(ne)));
   }, [ne]);
   const [oe, de] = S(!1), [Re, ue] = S(!1);
-  A(() => {
+  N(() => {
     if (!oe && !Re && !k && !b) return;
     const p = () => {
       de(!1), ue(!1), k && E(), b && s();
@@ -1058,16 +1058,16 @@ const Jn = ({
     (p) => {
       p.preventDefault();
       const Y = fe.trim();
-      Y && (Ze(Y), Be(""));
+      Y && (et(Y), Be(""));
     },
-    [fe, Ze]
+    [fe, et]
   ), We = c.productName || "Live Layer";
   let pe = null, he = null;
   for (let p = w.length - 1; p >= 0; p--) {
     const Y = w[p];
     if (!pe && Y.role === "agent" ? pe = Y : !he && Y.role === "user" && (he = Y), pe && he) break;
   }
-  const Me = G ? (pe == null ? void 0 : pe.text) || null : l || null, et = G && (he == null ? void 0 : he.text) || null, Fe = [
+  const Me = G ? (pe == null ? void 0 : pe.text) || null : l || null, tt = G && (he == null ? void 0 : he.text) || null, Fe = [
     "ll-expanded",
     t ? "ll-expanded--mobile" : "ll-expanded--desktop"
   ].join(" ");
@@ -1101,10 +1101,10 @@ const Jn = ({
             }
           )
         ] }),
-        /* @__PURE__ */ n("div", { ref: Qe, className: "ll-expanded__video" }),
+        /* @__PURE__ */ n("div", { ref: Ze, className: "ll-expanded__video" }),
         Oe && /* @__PURE__ */ _("div", { className: "ll-expanded__overlay ll-expanded__overlay--connecting", children: [
           /* @__PURE__ */ n("div", { className: "ll-expanded__spinner" }),
-          /* @__PURE__ */ n("p", { className: "ll-expanded__overlay-text", children: g ? "Switching..." : "Connecting..." })
+          /* @__PURE__ */ n("p", { className: "ll-expanded__overlay-text", children: y ? "Switching..." : "Connecting..." })
         ] }),
         I && G && /* @__PURE__ */ _(
           "button",
@@ -1133,7 +1133,7 @@ const Jn = ({
                   "aria-expanded": be ? b : void 0,
                   children: [
                     /* @__PURE__ */ n("span", { className: "ll-hpill__label", children: r }),
-                    be && /* @__PURE__ */ n(rt, {})
+                    be && /* @__PURE__ */ n(it, {})
                   ]
                 }
               ),
@@ -1184,7 +1184,7 @@ const Jn = ({
                   title: "Language: English",
                   children: [
                     /* @__PURE__ */ n("span", { className: "ll-hpill__label", children: "EN" }),
-                    /* @__PURE__ */ n(rt, {})
+                    /* @__PURE__ */ n(it, {})
                   ]
                 }
               ),
@@ -1269,7 +1269,7 @@ const Jn = ({
         ),
         Q && /* @__PURE__ */ (() => {
           const p = z ? "Restart paused session" : C === "disconnected" ? "Reconnect to agent" : "Start video call", Y = z ? "Pick up where you left off" : null;
-          return /* @__PURE__ */ _(yt, { children: [
+          return /* @__PURE__ */ _(vt, { children: [
             C === "idle" && !z && !H && /* @__PURE__ */ _(
               "button",
               {
@@ -1314,7 +1314,7 @@ const Jn = ({
               /* @__PURE__ */ n(
                 "div",
                 {
-                  ref: te,
+                  ref: ee,
                   className: !J && D ? "ll-expanded__pip-host" : "ll-expanded__pip-host is-hidden"
                 }
               )
@@ -1330,27 +1330,27 @@ const Jn = ({
               children: /* @__PURE__ */ n("p", { className: "ll-expanded__transcript-text", children: Me })
             }
           ),
-          et && /* @__PURE__ */ n(
+          tt && /* @__PURE__ */ n(
             "div",
             {
               className: "ll-expanded__transcript ll-expanded__transcript--user",
               "data-role": "user",
-              children: /* @__PURE__ */ n("p", { className: "ll-expanded__transcript-text", children: et })
+              children: /* @__PURE__ */ n("p", { className: "ll-expanded__transcript-text", children: tt })
             }
           ),
           /* @__PURE__ */ _("div", { className: "ll-toolbar", onClick: (p) => p.stopPropagation(), children: [
-            Ke && /* @__PURE__ */ n(
+            Xe && /* @__PURE__ */ n(
               "button",
               {
                 type: "button",
                 className: `ll-tool ${J ? "is-on" : ""}`,
-                onClick: st,
+                onClick: ct,
                 "aria-label": J ? "Stop sharing screen" : "Share screen",
                 title: J ? "Stop sharing" : "Share screen",
                 children: /* @__PURE__ */ n(er, {})
               }
             ),
-            Je && /* @__PURE__ */ _("div", { className: "ll-tool-split", children: [
+            Ke && /* @__PURE__ */ _("div", { className: "ll-tool-split", children: [
               /* @__PURE__ */ n(
                 "button",
                 {
@@ -1373,7 +1373,7 @@ const Jn = ({
                   "aria-label": "Camera devices",
                   "aria-haspopup": "listbox",
                   "aria-expanded": Re,
-                  children: /* @__PURE__ */ n(rt, {})
+                  children: /* @__PURE__ */ n(it, {})
                 }
               ),
               Re && O.length > 0 && /* @__PURE__ */ n(
@@ -1397,26 +1397,26 @@ const Jn = ({
                     "button",
                     {
                       type: "button",
-                      className: `ll-tool ll-tool--left ${h ? "is-muted" : ""}`,
+                      className: `ll-tool ll-tool--left ${m ? "is-muted" : ""}`,
                       onClick: Se,
                       disabled: !ae && G,
-                      "aria-label": !ae && G ? "Microphone enables once the agent finishes its greeting" : h ? "Unmute microphone" : "Mute microphone",
-                      title: !ae && G ? "Mic enables after greeting" : h ? "Unmute" : "Mute",
-                      children: /* @__PURE__ */ n(nr, { muted: h })
+                      "aria-label": !ae && G ? "Microphone enables once the agent finishes its greeting" : m ? "Unmute microphone" : "Mute microphone",
+                      title: !ae && G ? "Mic enables after greeting" : m ? "Unmute" : "Mute",
+                      children: /* @__PURE__ */ n(nr, { muted: m })
                     }
                   ),
                   /* @__PURE__ */ n(
                     "button",
                     {
                       type: "button",
-                      className: `ll-tool ll-tool--right ${h ? "is-muted" : ""}`,
+                      className: `ll-tool ll-tool--right ${m ? "is-muted" : ""}`,
                       onClick: (p) => {
                         p.stopPropagation(), de((Y) => !Y), ue(!1);
                       },
                       "aria-label": "Microphone devices",
                       "aria-haspopup": "listbox",
                       "aria-expanded": oe,
-                      children: /* @__PURE__ */ n(rt, {})
+                      children: /* @__PURE__ */ n(it, {})
                     }
                   ),
                   oe && q.length > 0 && /* @__PURE__ */ n(
@@ -1436,7 +1436,7 @@ const Jn = ({
               {
                 type: "button",
                 className: `ll-tool ${ye ? "is-muted" : ""}`,
-                onClick: ct,
+                onClick: dt,
                 "aria-label": ye ? "Unmute speaker" : "Mute speaker",
                 title: ye ? "Unmute speaker" : "Mute speaker",
                 children: /* @__PURE__ */ n(rr, { muted: ye })
@@ -1454,7 +1454,7 @@ const Jn = ({
               }
             )
           ] }),
-          Xe && /* @__PURE__ */ _("form", { className: "ll-message-input", onSubmit: qe, children: [
+          Qe && /* @__PURE__ */ _("form", { className: "ll-message-input", onSubmit: qe, children: [
             /* @__PURE__ */ n(
               "input",
               {
@@ -1511,7 +1511,7 @@ const Jn = ({
     }
   );
 };
-function rt() {
+function it() {
   return /* @__PURE__ */ n("svg", { width: "12", height: "12", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", "aria-hidden": !0, children: /* @__PURE__ */ n("polyline", { points: "6 9 12 15 18 9" }) });
 }
 function Ft() {
@@ -1547,7 +1547,7 @@ function nr({ muted: e }) {
 function rr({ muted: e }) {
   return /* @__PURE__ */ _("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": !0, children: [
     /* @__PURE__ */ n("polygon", { points: "11 5 6 9 2 9 2 15 6 15 11 19 11 5" }),
-    e ? /* @__PURE__ */ n("line", { x1: "23", y1: "9", x2: "17", y2: "15" }) : /* @__PURE__ */ _(yt, { children: [
+    e ? /* @__PURE__ */ n("line", { x1: "23", y1: "9", x2: "17", y2: "15" }) : /* @__PURE__ */ _(vt, { children: [
       /* @__PURE__ */ n("path", { d: "M19.07 4.93a10 10 0 0 1 0 14.14" }),
       /* @__PURE__ */ n("path", { d: "M15.54 8.46a5 5 0 0 1 0 7.07" })
     ] })
@@ -1600,7 +1600,7 @@ const jt = ({ label: e, devices: t, activeId: r, onPick: i }) => /* @__PURE__ */
   '[data-ll-private="true"]',
   ".ll-widget"
 ];
-function bt(e) {
+function wt(e) {
   let t = e;
   for (; t; ) {
     for (const r of lr)
@@ -1609,8 +1609,8 @@ function bt(e) {
   }
   return !1;
 }
-function at(e) {
-  if (bt(e)) return !1;
+function st(e) {
+  if (wt(e)) return !1;
   if (e instanceof HTMLInputElement) {
     if (e.type === "password") return !1;
     const t = (e.getAttribute("autocomplete") || "").toLowerCase();
@@ -1618,7 +1618,7 @@ function at(e) {
   }
   return !0;
 }
-const it = 4096, ar = 20, sr = 20, cr = 10, dr = 10, ur = 30, Vt = 500, fr = [
+const ot = 4096, ar = 20, sr = 20, cr = 10, dr = 10, ur = 30, Vt = 500, fr = [
   '[data-ll-private="true"]',
   ".ll-widget",
   "script",
@@ -1626,7 +1626,7 @@ const it = 4096, ar = 20, sr = 20, cr = 10, dr = 10, ur = 30, Vt = 500, fr = [
   "noscript",
   "iframe"
 ];
-function Ye(e) {
+function Ge(e) {
   if (e.getAttribute("aria-hidden") === "true" || e.hasAttribute("hidden")) return !0;
   let t = e;
   for (; t; ) {
@@ -1636,7 +1636,7 @@ function Ye(e) {
   }
   return !1;
 }
-function Ge(e) {
+function Je(e) {
   if (typeof window > "u") return !0;
   const t = e.getBoundingClientRect();
   if (t.width <= 0 || t.height <= 0) return !1;
@@ -1679,35 +1679,35 @@ function pr(e, t = {}) {
   const i = typeof window < "u" && window.location.href || "", o = typeof window < "u" && window.location.pathname || "/", l = r.title || "", c = Array.from(
     r.querySelectorAll("[data-ll-region]")
   ), d = [];
-  for (const h of c) {
+  for (const m of c) {
     if (d.length >= cr) break;
-    if (Ye(h) || !Ge(h)) continue;
-    const R = h.getAttribute("data-ll-region") ?? "", q = h.getAttribute("data-ll-intent") ?? void 0, D = _e(
-      (h.innerText || h.textContent || "").trim(),
+    if (Ge(m) || !Je(m)) continue;
+    const R = m.getAttribute("data-ll-region") ?? "", q = m.getAttribute("data-ll-intent") ?? void 0, D = _e(
+      (m.innerText || m.textContent || "").trim(),
       Vt * 2
     );
     !R || !D || d.push({ id: R, intent: q, text: D });
   }
-  const f = [], g = ["H1", "H2", "H3", "H4", "H5", "H6"], b = Array.from(
+  const f = [], y = ["H1", "H2", "H3", "H4", "H5", "H6"], b = Array.from(
     r.querySelectorAll("h1, h2, h3, h4, h5, h6")
   );
-  for (const h of b) {
-    if (Ye(h) || !Ge(h)) continue;
-    const R = (h.textContent || "").trim();
-    R && f.push(`${h.tagName}: ${_e(R, 200)}`);
+  for (const m of b) {
+    if (Ge(m) || !Je(m)) continue;
+    const R = (m.textContent || "").trim();
+    R && f.push(`${m.tagName}: ${_e(R, 200)}`);
   }
   const s = Array.from(r.querySelectorAll("p, li"));
-  for (const h of s) {
-    if (Ye(h) || !Ge(h) || g.includes(h.tagName)) continue;
-    const R = (h.textContent || "").trim();
+  for (const m of s) {
+    if (Ge(m) || !Je(m) || y.includes(m.tagName)) continue;
+    const R = (m.textContent || "").trim();
     R.length > 10 && f.push(_e(R, Vt));
   }
   const a = f.join(`
 `), k = [], E = Array.from(r.querySelectorAll("a[href]"));
-  for (const h of E) {
+  for (const m of E) {
     if (k.length >= ar) break;
-    if (Ye(h) || !Ge(h)) continue;
-    const R = h.getAttribute("href") || "", q = (h.textContent || "").trim();
+    if (Ge(m) || !Je(m)) continue;
+    const R = m.getAttribute("href") || "", q = (m.textContent || "").trim();
     !R || !q || k.push({ href: R, text: _e(q, 100) });
   }
   const C = [], v = Array.from(
@@ -1715,28 +1715,28 @@ function pr(e, t = {}) {
       "input, textarea, select"
     )
   );
-  for (const h of v) {
+  for (const m of v) {
     if (C.length >= sr) break;
-    if (Ye(h) || !at(h) || !Ge(h)) continue;
-    const R = Yt(h), q = h instanceof HTMLInputElement ? h.type : h.tagName.toLowerCase();
+    if (Ge(m) || !st(m) || !Je(m)) continue;
+    const R = Yt(m), q = m instanceof HTMLInputElement ? m.type : m.tagName.toLowerCase();
     R && C.push({ label: _e(R, 100), type: q });
   }
   const w = Array.from(
     r.querySelectorAll("[data-ll-form]")
   ), z = [];
-  for (const h of w) {
+  for (const m of w) {
     if (z.length >= dr) break;
-    if (bt(h)) continue;
-    const R = h.getAttribute("data-ll-form") || "";
+    if (wt(m)) continue;
+    const R = m.getAttribute("data-ll-form") || "";
     if (!R) continue;
-    const q = h.getAttribute("data-ll-intent") || void 0, D = Array.from(
-      h.querySelectorAll(
+    const q = m.getAttribute("data-ll-intent") || void 0, D = Array.from(
+      m.querySelectorAll(
         "[data-ll-field]"
       )
     ), M = [];
     for (const O of D) {
       if (M.length >= ur) break;
-      if (!at(O)) continue;
+      if (!st(O)) continue;
       const W = O.getAttribute("data-ll-field") || "";
       if (!W) continue;
       const J = Yt(O) || W, ne = O instanceof HTMLInputElement ? O.type : O.tagName.toLowerCase();
@@ -1756,11 +1756,11 @@ function pr(e, t = {}) {
     extras: e
   };
   let H = De(JSON.stringify(I.regions)) + De(I.visibleText) + De(JSON.stringify(I.visibleLinks)) + De(JSON.stringify(I.visibleFields));
-  for (; H > it && I.visibleFields.length > 0; )
+  for (; H > ot && I.visibleFields.length > 0; )
     I.visibleFields.pop(), H = De(JSON.stringify(I.visibleFields));
-  for (; H > it && I.visibleLinks.length > 0; )
+  for (; H > ot && I.visibleLinks.length > 0; )
     I.visibleLinks.pop(), H -= 80;
-  return De(I.visibleText) > it && (I.visibleText = _e(I.visibleText, it - 100)), I;
+  return De(I.visibleText) > ot && (I.visibleText = _e(I.visibleText, ot - 100)), I;
 }
 let $e = null;
 function Gt(e, t = {}) {
@@ -1793,14 +1793,14 @@ function vr(e) {
   const r = typeof window < "u" && window.location.origin || "", i = /* @__PURE__ */ new Set(), o = [], l = Array.from(t.querySelectorAll("a[href]"));
   for (const c of l) {
     if (o.length >= mr) break;
-    if (bt(c)) continue;
+    if (wt(c)) continue;
     const d = c.getAttribute("href") || "";
     if (!yr(d)) continue;
-    let f = d, g = !0;
+    let f = d, y = !0;
     try {
       if (typeof window < "u") {
         const s = new URL(d, r);
-        g = s.origin === r, g && d.startsWith("http") && (f = s.pathname + s.search + s.hash);
+        y = s.origin === r, y && d.startsWith("http") && (f = s.pathname + s.search + s.hash);
       }
     } catch {
       continue;
@@ -1808,13 +1808,13 @@ function vr(e) {
     if (i.has(f)) continue;
     i.add(f);
     const b = (c.textContent || "").trim().slice(0, 120);
-    o.push({ href: f, text: b, internal: g });
+    o.push({ href: f, text: b, internal: y });
   }
   return o;
 }
 let ze = null;
 const br = 5e3;
-function mt() {
+function gt() {
   const e = Date.now(), t = typeof window < "u" && window.location.pathname || "/";
   if (ze && ze.pathname === t && e - ze.at < br)
     return ze.routes;
@@ -1919,7 +1919,7 @@ function Ar(e) {
     autoConnect: c = !1,
     displayMode: d,
     defaultDisplayMode: f = "expanded",
-    onDisplayModeChange: g,
+    onDisplayModeChange: y,
     position: b = "bottom-right",
     mobileBreakpoint: s = 640,
     persistKey: a = "ll-widget",
@@ -1931,7 +1931,7 @@ function Ar(e) {
     greeting: z,
     avatarImageUrl: I,
     agentName: H,
-    branding: h = {},
+    branding: m = {},
     allowCamera: R = !0,
     allowScreenShare: q = !0,
     allowTyping: D = !0,
@@ -1941,11 +1941,11 @@ function Ar(e) {
     onNavigate: J,
     onScrollToSelector: ne,
     getPageContext: ye,
-    pageContextExtras: Je,
-    getRoutes: Ke,
-    onScrollPage: Xe,
-    onClick: Qe,
-    capabilities: ee,
+    pageContextExtras: Ke,
+    getRoutes: Xe,
+    onScrollPage: Qe,
+    onClick: Ze,
+    capabilities: te,
     onConnect: ae,
     onDisconnect: ve,
     onTranscript: xe,
@@ -1954,42 +1954,42 @@ function Ar(e) {
     onAgentEvent: Se,
     onAgentCommand: Ce,
     controlledSession: V,
-    className: st,
-    style: ct,
-    zIndex: Ze = 2147483647
+    className: ct,
+    style: dt,
+    zIndex: et = 2147483647
   } = e, ce = $n(W), Ee = Fn(ce, M, O);
-  A(() => {
+  N(() => {
     hr(), wr();
   }, [ce]);
   const He = C !== void 0, [be, Ne] = S(() => {
-    var m;
-    return C ?? ((m = E == null ? void 0 : E[0]) == null ? void 0 : m.id);
-  }), G = He ? C : be, Q = ot(
-    () => (E == null ? void 0 : E.find((m) => m.id === G)) ?? null,
+    var h;
+    return C ?? ((h = E == null ? void 0 : E[0]) == null ? void 0 : h.id);
+  }), G = He ? C : be, Q = lt(
+    () => (E == null ? void 0 : E.find((h) => h.id === G)) ?? null,
     [E, G]
   ), Ae = (Q == null ? void 0 : Q.agentId) ?? t, [re, se] = In({
     value: d,
     defaultValue: f,
-    onChange: g,
+    onChange: y,
     persistKey: a,
     disablePersistence: k
-  }), we = Pn(s), Oe = wn(), te = _n(), ie = kn(), oe = Ln(), de = Sn(), [Re, ue] = S(!1), [fe, Be] = S(!1), [qe, We] = S(!1), [pe, he] = S(!1), [Me, et] = S(!1), Fe = N(J), Ie = N(ne), p = N(Xe), Y = N(Qe), dt = N(ye), wt = N(Je), _t = N(Ke), ut = N(ee), le = N(null);
-  Fe.current = J, Ie.current = ne, p.current = Xe, Y.current = Qe, dt.current = ye, wt.current = Je, _t.current = Ke, ut.current = ee;
-  function me(m) {
-    const u = ut.current;
-    return u ? u.includes(m) : !0;
+  }), we = Pn(s), Oe = wn(), ee = _n(), ie = kn(), oe = Ln(), de = Sn(), [Re, ue] = S(!1), [fe, Be] = S(!1), [qe, We] = S(!1), [pe, he] = S(!1), [Me, tt] = S(!1), Fe = A(J), Ie = A(ne), p = A(Qe), Y = A(Ze), ut = A(ye), _t = A(Ke), xt = A(Xe), ft = A(te), le = A(null);
+  Fe.current = J, Ie.current = ne, p.current = Qe, Y.current = Ze, ut.current = ye, _t.current = Ke, xt.current = Xe, ft.current = te;
+  function me(h) {
+    const u = ft.current;
+    return u ? u.includes(h) : !0;
   }
-  function ge(m, u) {
+  function ge(h, u) {
     console.warn(
-      `[LiveLayer] Agent command "${m}" blocked — capability "${u}" not in allowlist. See https://livelayer.studio/docs/react/capabilities`
+      `[LiveLayer] Agent command "${h}" blocked — capability "${u}" not in allowlist. See https://livelayer.studio/docs/react/capabilities`
     );
   }
   const Ue = L(
-    (m) => {
-      var K, Te, nt, Tt;
-      const u = m;
+    (h) => {
+      var K, Te, rt, Tt;
+      const u = h;
       if (!(!u.type || typeof u.type != "string")) {
-        if (Se == null || Se({ eventName: u.type, data: m }), u.type === "navigate") {
+        if (Se == null || Se({ eventName: u.type, data: h }), u.type === "navigate") {
           if (!me("navigate")) {
             ge("navigate", "navigate");
             return;
@@ -2088,7 +2088,7 @@ function Ar(e) {
               } catch (Z) {
                 console.warn("[LiveLayer] publishData failed.", Z);
               }
-          }, $ = wt.current, F = dt.current;
+          }, $ = _t.current, F = ut.current;
           try {
             if (F) {
               const j = F($);
@@ -2237,7 +2237,7 @@ function Ar(e) {
               );
               return;
             }
-            if (!at(F)) {
+            if (!st(F)) {
               console.warn(
                 `[LiveLayer] focus_field: field "${$}" is privacy-protected and not focusable.`
               );
@@ -2260,7 +2260,7 @@ function Ar(e) {
               );
               continue;
             }
-            if (!at(j)) {
+            if (!st(j)) {
               console.warn(
                 `[LiveLayer] fill_form: field "${$}" is privacy-protected (password / cc-* / private). Skipping.`
               );
@@ -2303,7 +2303,7 @@ function Ar(e) {
             );
             return;
           }
-          const B = typeof u.requestId == "string" ? u.requestId : void 0, $ = (nt = le.current) == null ? void 0 : nt.call(le), F = (X) => {
+          const B = typeof u.requestId == "string" ? u.requestId : void 0, $ = (rt = le.current) == null ? void 0 : rt.call(le), F = (X) => {
             const Z = $, Pe = Z == null ? void 0 : Z.localParticipant;
             if (Pe != null && Pe.publishData)
               try {
@@ -2350,7 +2350,7 @@ function Ar(e) {
             } catch (X) {
               console.warn("[LiveLayer] request_routes: publishData failed.", X);
             }
-          }, j = _t.current;
+          }, j = xt.current;
           if (j) {
             try {
               const P = j(), X = (Z) => {
@@ -2364,18 +2364,18 @@ function Ar(e) {
                 console.warn(
                   "[LiveLayer] getRoutes rejected; falling back to DOM walker.",
                   Z
-                ), F(mt());
+                ), F(gt());
               }) : X(P);
             } catch (P) {
               console.warn(
                 "[LiveLayer] getRoutes threw; falling back to DOM walker.",
                 P
-              ), F(mt());
+              ), F(gt());
             }
             return;
           }
           try {
-            F(mt());
+            F(gt());
           } catch (P) {
             console.warn("[LiveLayer] request_routes: extractRoutes threw.", P);
           }
@@ -2393,16 +2393,16 @@ function Ar(e) {
     sessionBody: l,
     onDataMessage: V ? void 0 : Ue
   });
-  A(() => {
+  N(() => {
     if (V != null && V.subscribeToDataMessages)
       return V.subscribeToDataMessages(Ue);
   }, [V, Ue]), le.current = () => {
-    var m;
-    return (m = U.getRoom) == null ? void 0 : m.call(U);
-  }, A(() => {
+    var h;
+    return (h = U.getRoom) == null ? void 0 : h.call(U);
+  }, N(() => {
     var K;
     if (!ce) return;
-    const m = (K = U.getRoom) == null ? void 0 : K.call(U), u = m == null ? void 0 : m.localParticipant;
+    const h = (K = U.getRoom) == null ? void 0 : K.call(U), u = h == null ? void 0 : h.localParticipant;
     if (u != null && u.publishData)
       try {
         const Te = new TextEncoder().encode(
@@ -2411,22 +2411,22 @@ function Ar(e) {
         u.publishData(Te, { reliable: !0 });
       } catch {
       }
-  }, [ce, U, U.connectionState]), A(() => {
+  }, [ce, U, U.connectionState]), N(() => {
     var K;
     if (typeof window > "u") return;
-    const m = ((K = window.location) == null ? void 0 : K.hostname) || "";
-    if (m === "localhost" || m === "127.0.0.1" || m === "0.0.0.0" || m.endsWith(".local") || m.endsWith(".test"))
+    const h = ((K = window.location) == null ? void 0 : K.hostname) || "";
+    if (h === "localhost" || h === "127.0.0.1" || h === "0.0.0.0" || h.endsWith(".local") || h.endsWith(".test"))
       return window.__livelayerSimulateCommand = (Te) => {
         try {
           Ue(Te);
-        } catch (nt) {
-          console.warn("[LiveLayer] simulate-command threw:", nt);
+        } catch (rt) {
+          console.warn("[LiveLayer] simulate-command threw:", rt);
         }
       }, () => {
         delete window.__livelayerSimulateCommand;
       };
   }, [Ue]);
-  const y = ot(() => V ? {
+  const g = lt(() => V ? {
     connectionState: V.connectionState,
     agentState: V.agentState,
     transcript: V.transcript,
@@ -2457,118 +2457,124 @@ function Ar(e) {
     disconnect: U.disconnect,
     getRoom: U.getRoom,
     isControlled: !1
-  }, [V, U]), xt = N(null);
-  A(() => {
-    const m = y.videoElement, u = xt.current;
-    if (!(!m || !u))
-      return u.appendChild(m), () => {
-        m.parentNode === u && u.removeChild(m);
+  }, [V, U]), kt = A(null);
+  N(() => {
+    const h = g.videoElement, u = kt.current;
+    if (!(!h || !u))
+      return u.appendChild(h), () => {
+        h.parentNode === u && u.removeChild(h);
       };
-  }, [y.videoElement]), A(() => {
-    const m = y.audioElement;
-    if (!m) return;
-    Oe.attach(m);
-    const u = m.play();
+  }, [g.videoElement]), N(() => {
+    const h = g.audioElement;
+    if (!h) return;
+    Oe.attach(h);
+    const u = h.play();
     return u && typeof u.catch == "function" && u.catch((K) => {
       (K == null ? void 0 : K.name) === "NotAllowedError" && ue(!0);
     }), () => {
       Oe.detach();
     };
-  }, [y.audioElement]), A(() => {
-    if (y.isControlled || y.connectionState !== "connected") return;
-    const m = y.getRoom();
-    if (m)
-      return te.setupMic(m, { startMuted: !0 }).catch(() => {
-      }), ie.attachRoom(m), oe.attachRoom(m), de.refresh(), () => {
-        te.teardownMic(), ie.teardown(), oe.teardown();
+  }, [g.audioElement]), N(() => {
+    if (g.isControlled || g.connectionState !== "connected") return;
+    const h = g.getRoom();
+    if (h)
+      return ee.setupMic(h, { startMuted: !0 }).catch(() => {
+      }), ie.attachRoom(h), oe.attachRoom(h), de.refresh(), () => {
+        ee.teardownMic(), ie.teardown(), oe.teardown();
       };
-  }, [y.isControlled, y.connectionState]);
-  const [ft, kt] = S(!1), pt = N("idle");
-  A(() => {
-    if (y.connectionState === "idle" || y.connectionState === "disconnected") {
-      kt(!1), pt.current = "idle";
+  }, [g.isControlled, g.connectionState]);
+  const [je, pt] = S(!1), ht = A("idle");
+  N(() => {
+    if (g.connectionState === "idle" || g.connectionState === "disconnected") {
+      pt(!1), ht.current = "idle";
       return;
     }
-    !ft && pt.current === "speaking" && y.agentState !== "speaking" && (kt(!0), te.setMuted(!1)), pt.current = y.agentState;
-  }, [y.agentState, y.connectionState, ft]), A(() => {
-    const m = y.audioElement;
-    m && (m.muted = Me);
-  }, [y.audioElement, Me]);
-  const Zt = L((m) => {
-    const u = y.getRoom();
+    !je && ht.current === "speaking" && g.agentState !== "speaking" && (pt(!0), ee.setMuted(!1)), ht.current = g.agentState;
+  }, [g.agentState, g.connectionState, je]), N(() => {
+    if (g.connectionState !== "connected" || je) return;
+    const h = setTimeout(() => {
+      pt(!0), ee.setMuted(!1);
+    }, 4e3);
+    return () => clearTimeout(h);
+  }, [g.connectionState, je]), N(() => {
+    const h = g.audioElement;
+    h && (h.muted = Me);
+  }, [g.audioElement, Me]);
+  const Zt = L((h) => {
+    const u = g.getRoom();
     if (u)
       try {
         const K = new TextEncoder().encode(
-          JSON.stringify({ type: "user_message", text: m })
+          JSON.stringify({ type: "user_message", text: h })
         );
         u.localParticipant.publishData(K, { reliable: !0 });
       } catch {
       }
-  }, [y]), en = L(() => {
-    et((m) => !m);
+  }, [g]), en = L(() => {
+    tt((h) => !h);
   }, []);
-  A(() => {
-    Le == null || Le(y.connectionState), y.connectionState === "connected" ? ae == null || ae() : y.connectionState === "disconnected" && (ve == null || ve());
-  }, [y.connectionState, ae, ve, Le]), A(() => {
-    xe == null || xe(y.transcript);
-  }, [y.transcript, xe]), A(() => {
-    ke == null || ke(y.agentState);
-  }, [y.agentState, ke]);
-  const Lt = N(!1);
-  A(() => {
-    y.isControlled || !c || Lt.current || Ee && y.connectionState === "idle" && (Lt.current = !0, y.connect());
-  }, [c, y.connectionState, y, Ee]);
+  N(() => {
+    Le == null || Le(g.connectionState), g.connectionState === "connected" ? ae == null || ae() : g.connectionState === "disconnected" && (ve == null || ve());
+  }, [g.connectionState, ae, ve, Le]), N(() => {
+    xe == null || xe(g.transcript);
+  }, [g.transcript, xe]), N(() => {
+    ke == null || ke(g.agentState);
+  }, [g.agentState, ke]);
+  const Lt = A(!1);
+  N(() => {
+    g.isControlled || !c || Lt.current || Ee && g.connectionState === "idle" && (Lt.current = !0, g.connect());
+  }, [c, g.connectionState, g, Ee]);
   const tn = L(
-    (m) => {
-      const u = E == null ? void 0 : E.find((K) => K.id === m);
-      u && (We(!1), m !== G && (Be(!0), y.disconnect(), He || Ne(m), v == null || v(u)));
+    (h) => {
+      const u = E == null ? void 0 : E.find((K) => K.id === h);
+      u && (We(!1), h !== G && (Be(!0), g.disconnect(), He || Ne(h), v == null || v(u)));
     },
     [
       E,
       G,
-      y,
+      g,
       He,
       v
     ]
   );
-  A(() => {
-    fe && y.connectionState === "connected" && Be(!1);
-  }, [y.connectionState, fe]), A(() => {
+  N(() => {
+    fe && g.connectionState === "connected" && Be(!1);
+  }, [g.connectionState, fe]), N(() => {
     if (!qe) return;
-    const m = (u) => {
+    const h = (u) => {
       u.key === "Escape" && We(!1);
     };
-    return window.addEventListener("keydown", m), () => window.removeEventListener("keydown", m);
+    return window.addEventListener("keydown", h), () => window.removeEventListener("keydown", h);
   }, [qe]);
-  const nn = !!I || !!(Q != null && Q.avatarImageUrl) || y.isControlled, je = Cn(Ae, i, nn);
-  ee === void 0 && ((Ct = je.info) != null && Ct.capabilities) && (ut.current = je.info.capabilities);
-  const tt = (Q == null ? void 0 : Q.name) ?? H ?? ((Et = y.agentConfig) == null ? void 0 : Et.name) ?? ((Nt = je.info) == null ? void 0 : Nt.name) ?? "Live Layer", ht = (Q == null ? void 0 : Q.avatarImageUrl) ?? I ?? ((At = y.agentConfig) == null ? void 0 : At.avatarImageUrl) ?? ((Rt = je.info) == null ? void 0 : Rt.avatarImageUrl) ?? null, rn = w ?? ((Mt = y.agentConfig) == null ? void 0 : Mt.idleLoopUrl) ?? ((It = je.info) == null ? void 0 : It.idleLoopUrl) ?? null, on = z ?? null, ln = L(() => se("expanded"), [se]), an = L(
+  const nn = !!I || !!(Q != null && Q.avatarImageUrl) || g.isControlled, Ve = Cn(Ae, i, nn);
+  te === void 0 && ((Ct = Ve.info) != null && Ct.capabilities) && (ft.current = Ve.info.capabilities);
+  const nt = (Q == null ? void 0 : Q.name) ?? H ?? ((Et = g.agentConfig) == null ? void 0 : Et.name) ?? ((Nt = Ve.info) == null ? void 0 : Nt.name) ?? "Live Layer", mt = (Q == null ? void 0 : Q.avatarImageUrl) ?? I ?? ((At = g.agentConfig) == null ? void 0 : At.avatarImageUrl) ?? ((Rt = Ve.info) == null ? void 0 : Rt.avatarImageUrl) ?? null, rn = w ?? ((Mt = g.agentConfig) == null ? void 0 : Mt.idleLoopUrl) ?? ((It = Ve.info) == null ? void 0 : It.idleLoopUrl) ?? null, on = z ?? null, ln = L(() => se("expanded"), [se]), an = L(
     () => se("minimized"),
     [se]
   ), St = L(() => {
-    y.disconnect(), se("hidden");
-  }, [y, se]), sn = L(() => {
-    const m = y.audioElement;
-    m && m.play().then(() => ue(!1)).catch(() => {
+    g.disconnect(), se("hidden");
+  }, [g, se]), sn = L(() => {
+    const h = g.audioElement;
+    h && h.play().then(() => ue(!1)).catch(() => {
     });
-  }, [y.audioElement]), cn = L(() => {
-    ue(!1), y.connect();
-  }, [y]), Ve = {
-    ...ct,
-    zIndex: Ze
+  }, [g.audioElement]), cn = L(() => {
+    ue(!1), g.connect();
+  }, [g]), Ye = {
+    ...dt,
+    zIndex: et
   };
-  h.primaryColor && (Ve["--ll-color-primary"] = h.primaryColor), h.accentColor && (Ve["--ll-color-accent"] = h.accentColor), h.backgroundColor && (Ve["--ll-color-bg"] = h.backgroundColor), h.textColor && (Ve["--ll-color-fg"] = h.textColor);
+  m.primaryColor && (Ye["--ll-color-primary"] = m.primaryColor), m.accentColor && (Ye["--ll-color-accent"] = m.accentColor), m.backgroundColor && (Ye["--ll-color-bg"] = m.backgroundColor), m.textColor && (Ye["--ll-color-fg"] = m.textColor);
   const dn = [
     "ll-widget",
     `ll-widget--${re}`,
     `ll-widget--${we ? "mobile" : "desktop"}`,
-    st
+    ct
   ].filter(Boolean).join(" ");
   return Ee ? /* @__PURE__ */ _(
     "div",
     {
       className: dn,
-      style: Ve,
+      style: Ye,
       "data-display-mode": re,
       "data-position": b,
       children: [
@@ -2577,11 +2583,11 @@ function Ar(e) {
           {
             position: b,
             isMobile: we,
-            isSpeaking: y.agentState === "speaking",
+            isSpeaking: g.agentState === "speaking",
             onExpand: () => se("expanded"),
-            label: `Open ${tt} widget`,
-            avatarImageUrl: ht,
-            agentName: tt
+            label: `Open ${nt} widget`,
+            avatarImageUrl: mt,
+            agentName: nt
           }
         ),
         re === "minimized" && /* @__PURE__ */ n(
@@ -2589,13 +2595,13 @@ function Ar(e) {
           {
             position: b,
             isMobile: we,
-            agentName: tt,
-            avatarImageUrl: ht,
-            agentState: y.agentState,
-            isMuted: te.isMuted,
+            agentName: nt,
+            avatarImageUrl: mt,
+            agentState: g.agentState,
+            isMuted: ee.isMuted,
             audioLevel: Oe,
             onExpand: ln,
-            onToggleMute: te.toggleMute,
+            onToggleMute: ee.toggleMute,
             onClose: St
           }
         ),
@@ -2604,21 +2610,21 @@ function Ar(e) {
           {
             position: b,
             isMobile: we,
-            agentName: tt,
-            avatarImageUrl: ht,
+            agentName: nt,
+            avatarImageUrl: mt,
             idleLoopUrl: rn,
             greeting: on,
-            branding: h,
+            branding: m,
             teamMembers: E,
             currentTeamMemberId: G,
             isSwitchingTeamMember: fe,
             teamSwitcherOpen: qe,
-            onToggleTeamSwitcher: () => We((m) => !m),
+            onToggleTeamSwitcher: () => We((h) => !h),
             onSelectTeamMember: tn,
-            connectionState: y.connectionState,
-            agentState: y.agentState,
-            transcript: y.transcript,
-            isMuted: te.isMuted,
+            connectionState: g.connectionState,
+            agentState: g.agentState,
+            transcript: g.transcript,
+            isMuted: ee.isMuted,
             micDevices: de.mics,
             isCameraEnabled: ie.isEnabled,
             cameraPreviewEl: ie.previewEl,
@@ -2631,27 +2637,27 @@ function Ar(e) {
             allowScreenShare: q,
             allowTyping: D,
             languageMenuOpen: pe,
-            onToggleLanguageMenu: () => he((m) => !m),
+            onToggleLanguageMenu: () => he((h) => !h),
             needsUserGesture: Re,
-            canResume: y.canResume,
-            micError: te.micError,
-            error: y.error,
-            avatarVideoContainerRef: xt,
-            agentVideoEl: y.videoElement,
-            micGateOpen: y.isControlled ? !0 : ft,
-            onConnect: () => void y.connect(),
-            onDisconnect: () => y.disconnect(),
+            canResume: g.canResume,
+            micError: ee.micError,
+            error: g.error,
+            avatarVideoContainerRef: kt,
+            agentVideoEl: g.videoElement,
+            micGateOpen: g.isControlled ? !0 : je,
+            onConnect: () => void g.connect(),
+            onDisconnect: () => g.disconnect(),
             onRetry: cn,
             onResumeAudio: sn,
-            onToggleMute: te.toggleMute,
+            onToggleMute: ee.toggleMute,
             onToggleCamera: () => void ie.toggle(),
-            onSwitchCameraDevice: (m) => void ie.switchDevice(m),
+            onSwitchCameraDevice: (h) => void ie.switchDevice(h),
             onToggleScreenShare: () => void oe.toggle(),
             onToggleSpeaker: en,
             onSendMessage: Zt,
             onMinimize: an,
             onClose: St,
-            onClearMicError: te.clearError
+            onClearMicError: ee.clearError
           }
         )
       ]
@@ -2670,24 +2676,24 @@ const Hr = ({
   className: l,
   style: c
 }) => {
-  const d = N(null), f = N(null), g = N(o);
-  g.current = o;
+  const d = A(null), f = A(null), y = A(o);
+  y.current = o;
   const b = L((s) => {
     var k;
     const a = s.detail;
-    (k = g.current) == null || k.call(g, a);
+    (k = y.current) == null || k.call(y, a);
   }, []);
-  return A(() => {
+  return N(() => {
     const s = d.current;
     if (!s) return;
     const a = document.createElement("livelayer-widget");
     return a.setAttribute("agent-id", e), t && a.setAttribute("base-url", t), r && a.setAttribute("api-key", r), i && a.setAttribute("mode", i), a.addEventListener("agent-event", b), s.appendChild(a), f.current = a, () => {
       a.removeEventListener("agent-event", b), s.removeChild(a), f.current = null;
     };
-  }, [e]), A(() => {
+  }, [e]), N(() => {
     f.current && (i ? f.current.setAttribute("mode", i) : f.current.removeAttribute("mode"));
   }, [i]), /* @__PURE__ */ n("div", { ref: d, className: l, style: c });
-}, Or = vt(
+}, Or = bt(
   function({ id: t, intent: r, as: i = "div", className: o, style: l, children: c }, d) {
     return hn(
       i,
@@ -2701,7 +2707,7 @@ const Hr = ({
       c
     );
   }
-), Br = vt(
+), Br = bt(
   function({ id: t, intent: r, children: i, ...o }, l) {
     return /* @__PURE__ */ n(
       "form",
@@ -2714,12 +2720,12 @@ const Hr = ({
       }
     );
   }
-), qr = vt(
+), qr = bt(
   function(t, r) {
     const { name: i, label: o, labelClassName: l } = t, c = { name: i, "data-ll-field": i };
     let d;
     if ("as" in t && t.as === "textarea") {
-      const { name: f, label: g, labelClassName: b, as: s, ...a } = t;
+      const { name: f, label: y, labelClassName: b, as: s, ...a } = t;
       d = /* @__PURE__ */ n(
         "textarea",
         {
@@ -2729,7 +2735,7 @@ const Hr = ({
         }
       );
     } else if ("as" in t && t.as === "select") {
-      const { name: f, label: g, labelClassName: b, as: s, children: a, ...k } = t;
+      const { name: f, label: y, labelClassName: b, as: s, children: a, ...k } = t;
       d = /* @__PURE__ */ n(
         "select",
         {
@@ -2740,7 +2746,7 @@ const Hr = ({
         }
       );
     } else {
-      const { name: f, label: g, labelClassName: b, as: s, ...a } = t;
+      const { name: f, label: y, labelClassName: b, as: s, ...a } = t;
       d = /* @__PURE__ */ n(
         "input",
         {
@@ -2762,24 +2768,24 @@ function Wr({
   defaultOpen: t = !1,
   storageKey: r = "ll-debug-open"
 }) {
-  const [i, o] = S(t), [l, c] = S([]), [d, f] = S(""), [g, b] = S(!1), s = N(/* @__PURE__ */ new Set()), a = N([]), k = N(g);
-  k.current = g, A(() => {
+  const [i, o] = S(t), [l, c] = S([]), [d, f] = S(""), [y, b] = S(!1), s = A(/* @__PURE__ */ new Set()), a = A([]), k = A(y);
+  k.current = y, N(() => {
     try {
       const v = localStorage.getItem(r);
       v === "1" && o(!0), v === "0" && o(!1);
     } catch {
     }
-  }, [r]), A(() => {
+  }, [r]), N(() => {
     try {
       localStorage.setItem(r, i ? "1" : "0");
     } catch {
     }
-  }, [i, r]), A(() => {
+  }, [i, r]), N(() => {
     const v = (w) => {
       (w.metaKey || w.ctrlKey) && w.shiftKey && w.key.toLowerCase() === "l" && (w.preventDefault(), o((z) => !z));
     };
     return window.addEventListener("keydown", v), () => window.removeEventListener("keydown", v);
-  }, []), A(() => {
+  }, []), N(() => {
     const v = setInterval(() => {
       if (a.current.length === 0 || k.current) return;
       const w = a.current.splice(0, a.current.length);
@@ -2789,8 +2795,8 @@ function Wr({
     }, 100);
     return () => clearInterval(v);
   }, []);
-  const E = N(!1);
-  if (A(() => {
+  const E = A(!1);
+  if (N(() => {
     !e || E.current || (E.current = !0, e((v) => {
       a.current.push({
         id: Kt++,
@@ -2800,20 +2806,20 @@ function Wr({
         data: v.data
       });
     }));
-  }, [e]), A(() => {
-    const v = console.warn, w = console.log, z = (I, H) => function(...h) {
+  }, [e]), N(() => {
+    const v = console.warn, w = console.log, z = (I, H) => function(...m) {
       try {
-        const R = typeof h[0] == "string" ? h[0] : "";
+        const R = typeof m[0] == "string" ? m[0] : "";
         R.startsWith("[LiveLayer]") && a.current.push({
           id: Kt++,
           ts: Date.now(),
           kind: I,
           type: R.slice(0, 120),
-          data: { args: h.slice(1).map((q) => Mr(q)) }
+          data: { args: m.slice(1).map((q) => Mr(q)) }
         });
       } catch {
       }
-      return H.apply(this, h);
+      return H.apply(this, m);
     };
     return console.warn = z("warn", v), console.log = z("log", w), () => {
       console.warn = v, console.log = w;
@@ -2896,9 +2902,9 @@ function Wr({
                 {
                   type: "button",
                   onClick: () => b((v) => !v),
-                  style: gt(g ? "#f59e0b" : "transparent"),
+                  style: yt(y ? "#f59e0b" : "transparent"),
                   title: "Pause / resume capture",
-                  children: g ? "▶ resume" : "⏸ pause"
+                  children: y ? "▶ resume" : "⏸ pause"
                 }
               ),
               /* @__PURE__ */ n(
@@ -2908,7 +2914,7 @@ function Wr({
                   onClick: () => {
                     c([]), a.current = [];
                   },
-                  style: gt("transparent"),
+                  style: yt("transparent"),
                   title: "Clear buffer",
                   children: "clear"
                 }
@@ -2918,7 +2924,7 @@ function Wr({
                 {
                   type: "button",
                   onClick: () => o(!1),
-                  style: gt("transparent"),
+                  style: yt("transparent"),
                   "aria-label": "Close",
                   title: "Close (Cmd/Ctrl + Shift + L)",
                   children: "✕"
@@ -3071,7 +3077,7 @@ function Rr({
     }
   );
 }
-function gt(e) {
+function yt(e) {
   return {
     background: e,
     color: "#fff",
@@ -3120,7 +3126,7 @@ export {
   pr as extractPageContext,
   vr as extractRoutes,
   Gt as getCachedPageContext,
-  mt as getCachedRoutes,
+  gt as getCachedRoutes,
   qn as matchesPattern,
   gr as normalizeRouteInput,
   Wn as shouldRenderAtPath,