@livo-tv/sdk 1.2.0 → 1.2.2

package/dist/studio/index.js

@@ -1,7 +1,7 @@
 "use client";
 import { createContext, useContext, useState, useRef, useEffect, useCallback, useMemo } from 'react';
 import { createPortal } from 'react-dom';
-import { Loader2, Share2, MicOff, Mic, Video, VideoOff, Settings, X, Link2, EyeOff, Eye, Users, MonitorUp, MessageSquare, Maximize, PictureInPicture2, PhoneOff, Undo2, Volume2, XIcon, Pin, MessageSquareOff, MoreVertical } from 'lucide-react';
+import { Loader2, Share2, MicOff, Mic, Video, VideoOff, Settings, X, Link2, EyeOff, Eye, MonitorUp, MessageSquare, Users, Maximize, PictureInPicture2, PhoneOff, Undo2, Volume2, XIcon, Pin, MessageSquareOff, MoreVertical } from 'lucide-react';
 import { toast } from 'sonner';
 import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';
 import { clsx } from 'clsx';
@@ -740,6 +740,12 @@ function parseStudioJoinStatus(value) {
   if (value.streamStatus !== null && streamStatus === null) return null;
   return { ready: value.ready, streamStatus };
 }
+function parsePublicStreamStatus(value) {
+  if (!isRecord(value)) return null;
+  const nested = isRecord(value.stream) ? value.stream : value;
+  const status = readString(nested, "status");
+  return status;
+}
 function studioErrorCode(error) {
   if (!error || typeof error !== "object") return null;
   const body = "body" in error ? error.body : null;
@@ -747,6 +753,90 @@ function studioErrorCode(error) {
   return body.error;
 }
 
+// src/studio/lib/studio-sounds.ts
+var CHAT_DEBOUNCE_MS = 400;
+var CHAT_HZ = 880;
+var CHAT_MS = 80;
+var REQUEST_LOW_HZ = 660;
+var REQUEST_HIGH_HZ = 880;
+var REQUEST_NOTE_MS = 80;
+var GAIN = 0.1;
+var ctx = null;
+var lastChatAt = 0;
+function audioContextCtor() {
+  if (typeof window === "undefined") return null;
+  return window.AudioContext || window.webkitAudioContext || null;
+}
+function prefersReducedMotion() {
+  if (typeof window === "undefined" || typeof window.matchMedia !== "function") {
+    return false;
+  }
+  return window.matchMedia("(prefers-reduced-motion: reduce)").matches;
+}
+function ensureContext() {
+  const AudioCtx = audioContextCtor();
+  if (!AudioCtx) return null;
+  if (!ctx || ctx.state === "closed") {
+    ctx = new AudioCtx();
+  }
+  return ctx;
+}
+function unlockStudioSounds() {
+  const context = ensureContext();
+  if (!context) return;
+  void context.resume();
+}
+function playTone(context, frequency, startAt, durationSec) {
+  const oscillator = context.createOscillator();
+  const gain = context.createGain();
+  oscillator.type = "sine";
+  oscillator.frequency.value = frequency;
+  gain.gain.setValueAtTime(GAIN, startAt);
+  gain.gain.exponentialRampToValueAtTime(1e-3, startAt + durationSec);
+  oscillator.connect(gain);
+  gain.connect(context.destination);
+  oscillator.start(startAt);
+  oscillator.stop(startAt + durationSec);
+}
+function playNow(context, kind) {
+  const now = context.currentTime;
+  if (kind === "chat") {
+    playTone(context, CHAT_HZ, now, CHAT_MS / 1e3);
+    return;
+  }
+  playTone(context, REQUEST_LOW_HZ, now, REQUEST_NOTE_MS / 1e3);
+  playTone(
+    context,
+    REQUEST_HIGH_HZ,
+    now + REQUEST_NOTE_MS / 1e3,
+    REQUEST_NOTE_MS / 1e3
+  );
+}
+function playStudioSound(kind) {
+  if (prefersReducedMotion()) return;
+  if (kind === "chat") {
+    const at = Date.now();
+    if (at - lastChatAt < CHAT_DEBOUNCE_MS) return;
+    lastChatAt = at;
+  }
+  const context = ensureContext();
+  if (!context) return;
+  const run = () => {
+    if (context.state !== "running") return;
+    playNow(context, kind);
+  };
+  if (context.state === "running") {
+    run();
+    return;
+  }
+  void context.resume().then(run, () => void 0);
+}
+if (typeof document !== "undefined") {
+  document.addEventListener("pointerdown", unlockStudioSounds, {
+    passive: true
+  });
+}
+
 // src/studio/lib/bridge.ts
 function postLivoEvent(type, payload) {
   if (typeof window === "undefined") return;
@@ -1160,9 +1250,9 @@ function AudioWaveform({
     if (!canvas || !track || reducedMotion) return;
     const AudioCtx = window.AudioContext || window.webkitAudioContext;
     if (!AudioCtx) return;
-    const ctx = new AudioCtx();
-    const source = ctx.createMediaStreamSource(new MediaStream([track]));
-    const analyser = ctx.createAnalyser();
+    const ctx2 = new AudioCtx();
+    const source = ctx2.createMediaStreamSource(new MediaStream([track]));
+    const analyser = ctx2.createAnalyser();
     analyser.fftSize = 64;
     source.connect(analyser);
     const data = new Uint8Array(analyser.frequencyBinCount);
@@ -1191,7 +1281,7 @@ function AudioWaveform({
     frame = requestAnimationFrame(draw);
     return () => {
       cancelAnimationFrame(frame);
-      void ctx.close();
+      void ctx2.close();
     };
   }, [track, reducedMotion]);
   if (reducedMotion) {
@@ -1477,10 +1567,10 @@ async function playSpeakerTest(deviceId) {
   if (!AudioCtx) {
     throw new Error("AudioContext unavailable");
   }
-  const ctx = new AudioCtx();
-  void ctx.resume();
-  const oscillator = ctx.createOscillator();
-  const gain = ctx.createGain();
+  const ctx2 = new AudioCtx();
+  void ctx2.resume();
+  const oscillator = ctx2.createOscillator();
+  const gain = ctx2.createGain();
   oscillator.type = "sine";
   oscillator.frequency.value = TEST_HZ;
   gain.gain.value = 0.18;
@@ -1490,7 +1580,7 @@ async function playSpeakerTest(deviceId) {
     const probe = document.createElement("audio");
     const canRoute = Boolean(deviceId) && typeof probe.setSinkId === "function";
     if (canRoute && deviceId) {
-      const destination = ctx.createMediaStreamDestination();
+      const destination = ctx2.createMediaStreamDestination();
       gain.connect(destination);
       audio = probe;
       audio.autoplay = true;
@@ -1501,13 +1591,13 @@ async function playSpeakerTest(deviceId) {
         await audio.play();
       } catch {
         gain.disconnect();
-        gain.connect(ctx.destination);
+        gain.connect(ctx2.destination);
         audio.srcObject = null;
         audio.remove();
         audio = null;
       }
     } else {
-      gain.connect(ctx.destination);
+      gain.connect(ctx2.destination);
     }
     oscillator.start();
     await new Promise((resolve) => {
@@ -1519,7 +1609,7 @@ async function playSpeakerTest(deviceId) {
       audio.srcObject = null;
       audio.remove();
     }
-    await ctx.close();
+    await ctx2.close();
   }
 }
 function StudioDeviceSelectGroup({
@@ -1754,6 +1844,7 @@ function SettingsCameraPreview({
       el.srcObject = null;
       return;
     }
+    el.setAttribute("webkit-playsinline", "");
     el.srcObject = new MediaStream([track]);
     void el.play().catch(() => void 0);
     return () => {
@@ -1773,7 +1864,7 @@ function SettingsCameraPreview({
       autoPlay: true,
       muted: true,
       playsInline: true,
-      className: "absolute inset-0 size-full -scale-x-100 object-cover"
+      className: "livo-studio-inline-video absolute inset-0 size-full -scale-x-100 object-cover"
     }
   ) });
 }
@@ -1872,6 +1963,7 @@ function WaitingCameraPreview({
       el.srcObject = null;
       return;
     }
+    el.setAttribute("webkit-playsinline", "");
     el.srcObject = new MediaStream([track]);
     void el.play().catch(() => void 0);
     return () => {
@@ -1891,7 +1983,7 @@ function WaitingCameraPreview({
       autoPlay: true,
       muted: true,
       playsInline: true,
-      className: "absolute inset-0 size-full -scale-x-100 object-cover"
+      className: "livo-studio-inline-video absolute inset-0 size-full -scale-x-100 object-cover"
     }
   ) });
 }
@@ -2078,6 +2170,7 @@ function PipTrackVideo({
       el.srcObject = null;
       return;
     }
+    el.setAttribute("webkit-playsinline", "");
     el.srcObject = new MediaStream([track]);
     void el.play().catch(() => void 0);
     return () => {
@@ -2092,7 +2185,7 @@ function PipTrackVideo({
       playsInline: true,
       muted: true,
       className: cn(
-        "absolute inset-0 size-full",
+        "livo-studio-inline-video absolute inset-0 size-full",
         fit === "contain" ? "object-contain" : "object-cover"
       )
     }
@@ -2188,7 +2281,7 @@ function BubbleGroup({ className, ...props }) {
   );
 }
 var bubbleVariants = cva(
-  "group/bubble relative flex w-fit max-w-[80%] min-w-0 flex-col gap-1 group-data-[align=end]/message:self-end data-[align=end]:self-end data-[variant=ghost]:max-w-full",
+  "group/bubble relative flex w-fit min-w-0 max-w-[80%] flex-col gap-1 group-data-[align=end]/message:self-end data-[align=end]:self-end data-[variant=ghost]:max-w-full",
   {
     variants: {
       variant: {
@@ -2233,7 +2326,7 @@ function BubbleContent({
     props: mergeProps(
       {
         className: cn(
-          "w-fit max-w-full min-w-0 overflow-hidden rounded-xl border border-transparent px-3 py-2 text-sm leading-relaxed wrap-break-word group-data-[align=end]/bubble:self-end [button]:text-left [button,a]:transition-colors [button,a]:outline-none [button,a]:focus-visible:border-ring [button,a]:focus-visible:ring-3 [button,a]:focus-visible:ring-ring/50",
+          "w-auto max-w-full rounded-xl border border-transparent px-3 py-2 text-sm leading-relaxed [overflow-wrap:break-word] group-data-[align=end]/bubble:self-end [button]:text-left [button,a]:transition-colors [button,a]:outline-none [button,a]:focus-visible:border-ring [button,a]:focus-visible:ring-3 [button,a]:focus-visible:ring-ring/50",
           className
         )
       },
@@ -2414,17 +2507,24 @@ function StudioChatPanel({
             }
           ),
           groups.map((group) => {
-            const bubbles = group.rows.map((row) => /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-col gap-1", children: [
-              /* @__PURE__ */ jsx(
-                Bubble,
-                {
-                  align: group.mine ? "end" : "start",
-                  variant: group.mine ? "default" : "secondary",
-                  children: /* @__PURE__ */ jsx(BubbleContent, { children: row.text })
-                }
-              ),
-              messageActions(row, group.mine)
-            ] }, row.id));
+            const bubbles = group.rows.map((row) => /* @__PURE__ */ jsxs(
+              "div",
+              {
+                className: group.mine ? "ml-auto flex w-fit max-w-full flex-col gap-1" : "flex w-fit max-w-full flex-col gap-1",
+                children: [
+                  /* @__PURE__ */ jsx(
+                    Bubble,
+                    {
+                      align: group.mine ? "end" : "start",
+                      variant: group.mine ? "default" : "secondary",
+                      children: /* @__PURE__ */ jsx(BubbleContent, { children: row.text })
+                    }
+                  ),
+                  messageActions(row, group.mine)
+                ]
+              },
+              row.id
+            ));
             if (group.mine) {
               return /* @__PURE__ */ jsx(BubbleGroup, { className: "items-end", children: bubbles }, group.rows[0].id);
             }
@@ -2585,7 +2685,7 @@ function StudioSidePanel({
   const panelists = participants.filter((row) => isOnStage(row.stageStatus));
   const audience = participants.filter((row) => !isOnStage(row.stageStatus));
   return /* @__PURE__ */ jsxs("aside", { className: "bg-background flex min-h-0 w-full flex-1 flex-col border-t md:w-80 md:flex-none md:border-l md:border-t-0", children: [
-    /* @__PURE__ */ jsxs("div", { className: "flex border-b", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex", children: [
       /* @__PURE__ */ jsxs(
         Button,
         {
@@ -3036,7 +3136,9 @@ function StudioTileVideo({
 }) {
   const ref = useRef(null);
   useEffect(() => {
-    meeting.attachVideo(participantId, ref.current, kind);
+    const el = ref.current;
+    el?.setAttribute("webkit-playsinline", "");
+    meeting.attachVideo(participantId, el, kind);
     return () => meeting.attachVideo(participantId, null, kind);
   }, [kind, meeting, participantId]);
   return /* @__PURE__ */ jsx(
@@ -3049,7 +3151,7 @@ function StudioTileVideo({
       disablePictureInPicture: true,
       controlsList: "nodownload noplaybackrate noremoteplayback",
       className: cn(
-        "absolute inset-0 size-full",
+        "livo-studio-tile-video absolute inset-0 size-full",
         "pointer-events-none",
         contain ? "object-contain" : "object-cover",
         mirror && "-scale-x-100"
@@ -3239,14 +3341,24 @@ function StudioToolbar({
         children: selfStageStatus === "ON_STAGE" ? /* @__PURE__ */ jsx(EyeOff, {}) : /* @__PURE__ */ jsx(Eye, {})
       }
     ) : null,
-    session.role === "guest" && stageEnabled && selfStageStatus !== "ON_STAGE" ? /* @__PURE__ */ jsx(
+    session.role === "guest" && stageEnabled ? /* @__PURE__ */ jsx(
       ControlIcon,
       {
-        label: selfStageStatus === "REQUESTED_TO_JOIN_STAGE" ? labels.stageRequested : labels.askToGoOnAir,
+        label: selfStageStatus === "ON_STAGE" ? labels.goOffAir : selfStageStatus === "REQUESTED_TO_JOIN_STAGE" ? labels.stageRequested : labels.askToGoOnAir,
         pressed: selfStageStatus === "REQUESTED_TO_JOIN_STAGE",
-        disabled: selfStageStatus === "REQUESTED_TO_JOIN_STAGE",
-        onClick: onAskStage,
-        children: /* @__PURE__ */ jsx(Users, {})
+        disabled: selfStageStatus === "REQUESTED_TO_JOIN_STAGE" || selfStageStatus === "ON_STAGE" && !canLeaveStage,
+        onClick: () => {
+          if (selfStageStatus === "ON_STAGE") {
+            if (!canLeaveStage) {
+              toast.message(labels.offAirLastVisible);
+              return;
+            }
+            onLeaveStage();
+            return;
+          }
+          onAskStage();
+        },
+        children: selfStageStatus === "ON_STAGE" ? /* @__PURE__ */ jsx(EyeOff, {}) : /* @__PURE__ */ jsx(Eye, {})
       }
     ) : null,
     showScreenControl ? canShareFreely ? /* @__PURE__ */ jsx(
@@ -3421,6 +3533,12 @@ function StudioRoom({
   const seenWaitlisted = useRef(/* @__PURE__ */ new Set());
   const knockPrimed = useRef(false);
   const peopleAutoOpened = useRef(false);
+  const seenChatIds = useRef(/* @__PURE__ */ new Set());
+  const chatSoundPrimed = useRef(false);
+  const seenStageRequests = useRef(/* @__PURE__ */ new Set());
+  const stageRequestPrimed = useRef(false);
+  const awaitingStageDecision = useRef(false);
+  const prevStageStatus = useRef(null);
   const grantCheckTimers = useRef([]);
   const screenNoticePrimed = useRef(false);
   const lastSelfMedia = useRef({
@@ -3449,6 +3567,9 @@ function StudioRoom({
   const rejected = isStudioRejected(roomState);
   useBeforeUnload(active && !sessionOver);
   useWakeLock(active && !sessionOver);
+  useEffect(() => {
+    unlockStudioSounds();
+  }, []);
   useEffect(() => {
     if (onAir) {
       setPublishing(false);
@@ -3674,9 +3795,57 @@ function StudioRoom({
   const incoming = chatMessages.filter((row) => row.userId !== selfUserId);
   const unread = sideTab === "chat" ? 0 : Math.max(0, incoming.length - seenIncoming);
   const peopleBadge = waitlisted.length + stageRequests.length;
+  const selfStageStatus = self?.stageStatus ?? meeting.stageStatus();
   useEffect(() => {
     if (sideTab === "chat") setSeenIncoming(incoming.length);
   }, [incoming.length, sideTab]);
+  useEffect(() => {
+    if (!chatSoundPrimed.current) {
+      for (const row of incoming) seenChatIds.current.add(row.id);
+      chatSoundPrimed.current = true;
+      return;
+    }
+    for (const row of incoming) {
+      if (seenChatIds.current.has(row.id)) continue;
+      seenChatIds.current.add(row.id);
+      playStudioSound("chat");
+    }
+  }, [incoming]);
+  useEffect(() => {
+    if (session.role !== "moderator") return;
+    if (!stageRequestPrimed.current) {
+      for (const row of stageRequests) {
+        seenStageRequests.current.add(row.userId);
+      }
+      stageRequestPrimed.current = true;
+      return;
+    }
+    for (const row of stageRequests) {
+      if (seenStageRequests.current.has(row.userId)) continue;
+      seenStageRequests.current.add(row.userId);
+      playStudioSound("request");
+    }
+  }, [session.role, stageRequests]);
+  useEffect(() => {
+    const next = selfStageStatus;
+    const prev = prevStageStatus.current;
+    prevStageStatus.current = next;
+    if (session.role !== "guest") return;
+    if (next === "REQUESTED_TO_JOIN_STAGE") {
+      awaitingStageDecision.current = true;
+      return;
+    }
+    if (!awaitingStageDecision.current) return;
+    if (next === "ACCEPTED_TO_JOIN_STAGE" || next === "ON_STAGE") {
+      awaitingStageDecision.current = false;
+      toast.success(labels.stageApproved);
+      return;
+    }
+    if (next === "OFF_STAGE" && prev === "REQUESTED_TO_JOIN_STAGE") {
+      awaitingStageDecision.current = false;
+      toast.message(labels.stageDenied);
+    }
+  }, [labels.stageApproved, labels.stageDenied, selfStageStatus, session.role]);
   useEffect(() => {
     if (session.role === "moderator" && waitlisted.length > 0 && !peopleAutoOpened.current) {
       peopleAutoOpened.current = true;
@@ -3693,7 +3862,10 @@ function StudioRoom({
       if (seenWaitlisted.current.has(guest.id)) continue;
       seenWaitlisted.current.add(guest.id);
       toast.message(labels.knock.replace("{name}", guest.name));
-      if (session.role === "moderator") setSideTab("people");
+      if (session.role === "moderator") {
+        playStudioSound("request");
+        setSideTab("people");
+      }
     }
   }, [labels.knock, session.role, waitlisted]);
   useEffect(() => {
@@ -3730,6 +3902,7 @@ function StudioRoom({
       }
       if (message.type === "share-request") {
         if (session.role !== "moderator") return;
+        playStudioSound("request");
         toast.message(labels.shareRequestFrom.replace("{name}", message.name), {
           id: `share-request:${message.participantId}`,
           action: {
@@ -4105,10 +4278,13 @@ function StudioRoom({
           size: "icon-sm",
           "aria-label": labels.share,
           onClick: () => {
-            void navigator.clipboard.writeText(
-              playerWatchUrl(session.stream.id, playerOrigin)
-            );
-            toast.success(labels.shareCopied);
+            void shareOrCopyLink({
+              url: playerWatchUrl(session.stream.id, playerOrigin),
+              title: session.stream.title
+            }).then((result) => {
+              if (result === "copied") toast.success(labels.shareCopied);
+              if (result === "failed") toast.error(labels.shareFailed);
+            });
           },
           children: /* @__PURE__ */ jsx(Share2, {})
         }
@@ -4441,6 +4617,7 @@ function StudioDevicePreflight({
         setMicOk(Boolean(audio));
         setAudioTrack(audio);
         if (videoRef.current) {
+          videoRef.current.setAttribute("webkit-playsinline", "");
           videoRef.current.srcObject = video ? next : null;
         }
         bindEnded(next, gen);
@@ -4470,7 +4647,7 @@ function StudioDevicePreflight({
         autoPlay: true,
         muted: true,
         playsInline: true,
-        className: "bg-muted aspect-video w-full rounded-xl object-cover"
+        className: "livo-studio-inline-video bg-muted aspect-video w-full rounded-xl object-cover"
       }
     ) : /* @__PURE__ */ jsx("div", { className: "bg-muted flex aspect-video w-full items-center justify-center rounded-xl", children: /* @__PURE__ */ jsx("p", { className: "text-muted-foreground text-sm", children: cameraOffLabel }) }),
     /* @__PURE__ */ jsx(
@@ -4731,44 +4908,42 @@ function screenShareTrack(meeting, participantId) {
   }
   return findParticipant(meeting, participantId)?.screenShareTracks?.video ?? null;
 }
-var pendingAudioPlay = /* @__PURE__ */ new Set();
-function replayPendingAudio() {
-  for (const el of pendingAudioPlay) {
-    void el.play().then(
-      () => {
-        pendingAudioPlay.delete(el);
-      },
-      () => void 0
-    );
+var pendingMediaPlay = /* @__PURE__ */ new Set();
+function tryPlay(el) {
+  if (typeof el.play !== "function") return;
+  void el.play().then(
+    () => {
+      pendingMediaPlay.delete(el);
+    },
+    () => {
+      pendingMediaPlay.add(el);
+    }
+  );
+}
+function replayPendingMedia() {
+  for (const el of pendingMediaPlay) {
+    tryPlay(el);
   }
 }
 if (typeof document !== "undefined") {
-  document.addEventListener("pointerdown", replayPendingAudio, {
+  document.addEventListener("pointerdown", replayPendingMedia, {
     passive: true
   });
 }
 function bindTrackElement(el, track, kind) {
   if (!track) {
     el.srcObject = null;
-    if (el instanceof HTMLAudioElement) pendingAudioPlay.delete(el);
+    pendingMediaPlay.delete(el);
     return;
   }
   const current = el.srcObject;
   const currentTrack = current instanceof MediaStream ? kind === "video" ? current.getVideoTracks()[0] : current.getAudioTracks()[0] : void 0;
   if (currentTrack?.id === track.id) {
+    if (el.paused) tryPlay(el);
     return;
   }
   el.srcObject = new MediaStream([track]);
-  if (typeof el.play === "function") {
-    void el.play().then(
-      () => {
-        if (el instanceof HTMLAudioElement) pendingAudioPlay.delete(el);
-      },
-      () => {
-        if (el instanceof HTMLAudioElement) pendingAudioPlay.add(el);
-      }
-    );
-  }
+  tryPlay(el);
 }
 function roomLeftState(payload, fallback) {
   if (typeof payload === "string" && payload) return payload;
@@ -5255,7 +5430,15 @@ function studioMeetingFromRtk(raw) {
         notifyStage();
         return;
       }
-      await meeting.stage?.join?.();
+      try {
+        await meeting.stage?.join?.();
+      } catch {
+        const userId = meeting.self?.userId;
+        if (userId) {
+          await meeting.stage?.grantAccess?.([userId]);
+        }
+        await meeting.stage?.join?.();
+      }
       joinedStageLocally = true;
       await republishCameraIfOn();
       notifyStage();
@@ -5545,7 +5728,11 @@ function useRealtimeKitMeeting(authToken, generation = 0) {
   const [meeting, setMeeting] = useState(null);
   const [error, setError] = useState(null);
   useEffect(() => {
-    if (!authToken) return;
+    if (!authToken) {
+      setMeeting(null);
+      setError(null);
+      return;
+    }
     let cancelled = false;
     let handle = null;
     setError(null);
@@ -5720,6 +5907,21 @@ async function getStudioJoinStatus(token, apiUrl = defaultApiUrl(), fetchFn = fe
     throw error;
   }
 }
+async function getPublicStreamStatus(streamId, apiUrl = defaultApiUrl(), fetchFn = fetch) {
+  try {
+    const body = await publicJson(
+      `${apiUrl.replace(/\/$/, "")}/public/streams/${encodeURIComponent(streamId)}`,
+      {},
+      fetchFn
+    );
+    return parsePublicStreamStatus(body);
+  } catch (error) {
+    if (error instanceof StudioApiError && (error.status === 404 || error.status === 410)) {
+      return "ended";
+    }
+    return null;
+  }
+}
 var POLL_INTERVAL_MS = 5e3;
 function LivoHostStudio({
   token,
@@ -5814,6 +6016,7 @@ function LivoHostStudio({
   );
 }
 var POLL_INTERVAL_MS2 = 5e3;
+var PREVIEW_POLL_INTERVAL_MS = 2e3;
 function LivoGuestStudio({
   token,
   apiUrl,
@@ -5825,6 +6028,7 @@ function LivoGuestStudio({
 }) {
   const reducedMotion = usePrefersReducedMotion();
   const [session, setSession] = useState(null);
+  const [status, setStatus] = useState(null);
   const [error, setError] = useState(null);
   const [displayName, setDisplayName] = useState("");
   const [guestId, setGuestId] = useState("");
@@ -5874,6 +6078,7 @@ function LivoGuestStudio({
       );
       setWaitingForHost(false);
       setRetryAfterMs(null);
+      setStatus(null);
       setSession(next);
     } catch (err) {
       const code = studioErrorCode(err);
@@ -5890,9 +6095,9 @@ function LivoGuestStudio({
         setError(err instanceof Error ? err.message : lobbyLabels.joinError);
         setWaitingForHost(false);
       }
-      setJoining(false);
     } finally {
       joinInFlight.current = false;
+      setJoining(false);
     }
   }, [apiUrl, displayName, guestId, lobbyLabels, token]);
   useEffect(() => {
@@ -5921,6 +6126,31 @@ function LivoGuestStudio({
       window.clearInterval(id);
     };
   }, [apiUrl, join, lobbyLabels.endedTitle, token, waitingForHost]);
+  useEffect(() => {
+    if (!session) return;
+    const current = status ?? session.stream.status;
+    if (current === "ended" || current === "error") return;
+    let cancelled = false;
+    const poll = async () => {
+      const next = await getPublicStreamStatus(session.stream.id, apiUrl);
+      if (!cancelled && next) setStatus(next);
+    };
+    void poll();
+    const intervalMs = current === "public" ? POLL_INTERVAL_MS2 : PREVIEW_POLL_INTERVAL_MS;
+    const id = window.setInterval(() => void poll(), intervalMs);
+    return () => {
+      cancelled = true;
+      window.clearInterval(id);
+    };
+  }, [apiUrl, session, status]);
+  const liveSession = useMemo(() => {
+    if (!session) return null;
+    if (!status) return session;
+    return {
+      ...session,
+      stream: { ...session.stream, status }
+    };
+  }, [session, status]);
   useEffect(() => {
     if (retryAfterMs == null) return;
     const id = window.setTimeout(() => {
@@ -5933,7 +6163,7 @@ function LivoGuestStudio({
   if (meetingError) {
     return /* @__PURE__ */ jsx("p", { className: "text-destructive p-6", role: "alert", children: meetingError });
   }
-  if (!session || !meeting) {
+  if (!liveSession || !meeting) {
     return /* @__PURE__ */ jsx(
       StudioGuestLobby,
       {
@@ -5958,7 +6188,7 @@ function LivoGuestStudio({
   return /* @__PURE__ */ jsx(
     StudioRoom,
     {
-      session,
+      session: liveSession,
       meeting,
       control: {
         livestream: async () => "starting",
@@ -5967,7 +6197,12 @@ function LivoGuestStudio({
       },
       onRejoin: () => {
         setSession(null);
+        setStatus(null);
         setSessionGen((n) => n + 1);
+        setJoining(false);
+        setWaitingForHost(false);
+        setError(null);
+        joinInFlight.current = false;
       },
       reducedMotion,
       labels,
@@ -6109,6 +6344,8 @@ function studioRoomLabels(t) {
     admitAllAudience: t("admitAllAudience"),
     askToGoOnAir: t("askToGoOnAir"),
     stageRequested: t("stageRequested"),
+    stageApproved: t("stageApproved"),
+    stageDenied: t("stageDenied"),
     stageRequests: t("stageRequests"),
     people: t("people"),
     panelists: t("panelists"),
@@ -6146,6 +6383,6 @@ function studioRoomLabels(t) {
   };
 }
 
-export { LivoGuestStudio, LivoHostStudio, StudioApiError, StudioControlClient, StudioControlError, StudioGuestLobby, StudioRoom, StudioSkeleton, StudioWindowGate, StudioWindowGateContext, applyEmbedTheme, controlActionsFromClient, createStudioControlClient, decodeEmbedTheme, getStudioJoinStatus, joinStudioGuest, redeemStudioHost, studioErrorCode, studioRoomLabels, usePrefersReducedMotion, useRealtimeKitMeeting, useStudioWindowGate };
+export { LivoGuestStudio, LivoHostStudio, StudioApiError, StudioControlClient, StudioControlError, StudioGuestLobby, StudioRoom, StudioSkeleton, StudioWindowGate, StudioWindowGateContext, applyEmbedTheme, controlActionsFromClient, createStudioControlClient, decodeEmbedTheme, getPublicStreamStatus, getStudioJoinStatus, joinStudioGuest, redeemStudioHost, studioErrorCode, studioRoomLabels, usePrefersReducedMotion, useRealtimeKitMeeting, useStudioWindowGate };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map