@q9labsai/chalk-react 4.1.17 → 5.0.0

package/dist/chunk-OLBFC6RS.js

@@ -1,1422 +0,0 @@
-import {
-  createRecordingWhiteboardCursor,
-  recordingWhiteboardFileAssetId,
-  recordingWhiteboardFileIds,
-  recordingWhiteboardSceneAppState
-} from "./chunk-VHM3SYMY.js";
-import {
-  ChalkBackdrop,
-  ChalkBadge,
-  ChalkButton,
-  ChalkDialogPanel,
-  ChalkEmptyState,
-  ChalkIconButton,
-  ChalkPanel,
-  ChalkProvider,
-  ChalkTextarea,
-  ChatPanelPresentation,
-  ControlBarPresentation,
-  EntranceSurface,
-  MediaRequestDialog,
-  ParticipantTileSurface,
-  QuietSpace,
-  ReactionsOverlayPresentation,
-  ScreenSharePresentation,
-  SettingsDialog,
-  SkinProvider,
-  SpaceDrawer,
-  SpacePresentation,
-  SpaceView,
-  Stage,
-  StageContentTileSurface,
-  StatusSurface,
-  WhiteboardView,
-  chalkThemeStyle,
-  getThemeMode,
-  useCan,
-  useConnection,
-  useMedia,
-  useOffline,
-  useParticipants,
-  useSelf,
-  useSkin,
-  useSpaceClient,
-  useWhiteboard
-} from "./chunk-C7PNVYDZ.js";
-import {
-  WHITEBOARD_ITEM_ID,
-  screenShareItemId
-} from "./chunk-VLAZKVNN.js";
-import {
-  captureFeedbackScreenshot,
-  collectBrowserFeedbackEvidence
-} from "./chunk-FFPNO2MY.js";
-import {
-  Cancel01Icon2 as Cancel01Icon,
-  Download01Icon2 as Download01Icon,
-  FileTextIcon,
-  Loading01Icon,
-  PlayIcon2 as PlayIcon,
-  RefreshIcon2 as RefreshIcon,
-  Video01Icon2 as Video01Icon,
-  cn
-} from "./chunk-S6OVGZD5.js";
-
-// src/components/entrance/Entrance.tsx
-import { useEffect, useState } from "react";
-import { describeMediaCaptureError } from "@q9labsai/chalk-client";
-import { jsx } from "react/jsx-runtime";
-function Entrance({
-  spaceName,
-  logoUrl,
-  defaultDisplayName = "",
-  defaults,
-  joining = false,
-  error,
-  theme,
-  generatedAvatars = true,
-  onJoin,
-  onCancel,
-  onPrepare,
-  audioInputDevices,
-  videoInputDevices,
-  audioOutputDevices,
-  selectedAudioInput: selectedAudioInputProp,
-  selectedVideoInput: selectedVideoInputProp,
-  selectedAudioOutput: selectedAudioOutputProp,
-  onAudioInputChange,
-  onVideoInputChange,
-  onAudioOutputChange
-}) {
-  useEffect(() => {
-    void onPrepare?.().catch(() => void 0);
-  }, [onPrepare]);
-  const [displayName, setDisplayName] = useState(defaultDisplayName);
-  const [microphone, setMicrophone] = useState(defaults?.microphone ?? true);
-  const [camera, setCamera] = useState(defaults?.camera ?? true);
-  const [selectedAudioInput, setSelectedAudioInput] = useState(selectedAudioInputProp ?? "");
-  const [selectedVideoInput, setSelectedVideoInput] = useState(selectedVideoInputProp ?? "");
-  const [selectedAudioOutput, setSelectedAudioOutput] = useState(selectedAudioOutputProp ?? "");
-  const [enumeratedDevices, setEnumeratedDevices] = useState({ audioInputDevices: [], videoInputDevices: [], audioOutputDevices: [] });
-  const [previewError, setPreviewError] = useState(null);
-  const [previewStream, setPreviewStream] = useState(null);
-  useEffect(() => {
-    if (selectedAudioInputProp !== void 0) setSelectedAudioInput(selectedAudioInputProp ?? "");
-  }, [selectedAudioInputProp]);
-  useEffect(() => {
-    if (selectedVideoInputProp !== void 0) setSelectedVideoInput(selectedVideoInputProp ?? "");
-  }, [selectedVideoInputProp]);
-  useEffect(() => {
-    if (selectedAudioOutputProp !== void 0) setSelectedAudioOutput(selectedAudioOutputProp ?? "");
-  }, [selectedAudioOutputProp]);
-  const hasMissingDeviceList = audioInputDevices === void 0 || videoInputDevices === void 0 || audioOutputDevices === void 0;
-  useEffect(() => {
-    if (!hasMissingDeviceList || !navigator.mediaDevices?.enumerateDevices) return;
-    let cancelled = false;
-    void navigator.mediaDevices.enumerateDevices().then((devices) => {
-      if (cancelled) return;
-      setEnumeratedDevices({
-        audioInputDevices: devicesOfKind(devices, "audioinput"),
-        videoInputDevices: devicesOfKind(devices, "videoinput"),
-        audioOutputDevices: devicesOfKind(devices, "audiooutput")
-      });
-    }).catch(() => void 0);
-    return () => {
-      cancelled = true;
-    };
-  }, [hasMissingDeviceList]);
-  const effectiveAudioInputDevices = audioInputDevices ?? enumeratedDevices.audioInputDevices;
-  const effectiveVideoInputDevices = videoInputDevices ?? enumeratedDevices.videoInputDevices;
-  const effectiveAudioOutputDevices = audioOutputDevices ?? enumeratedDevices.audioOutputDevices;
-  useEffect(() => {
-    if (!navigator.mediaDevices?.getUserMedia || !microphone && !camera) {
-      setPreviewStream((current) => {
-        stopTracks(current);
-        return null;
-      });
-      return;
-    }
-    let cancelled = false;
-    let requestedStream = null;
-    void navigator.mediaDevices.getUserMedia({ audio: captureConstraint(microphone, selectedAudioInput), video: captureConstraint(camera, selectedVideoInput) }).then((stream) => {
-      requestedStream = stream;
-      if (cancelled) {
-        stopTracks(stream);
-        return;
-      }
-      setPreviewError(null);
-      setPreviewStream((current) => {
-        stopTracks(current);
-        return stream;
-      });
-    }).catch((cause) => {
-      if (!cancelled) setPreviewError(describeMediaCaptureError(cause).message);
-    });
-    return () => {
-      cancelled = true;
-      stopTracks(requestedStream);
-    };
-  }, [camera, microphone, selectedAudioInput, selectedVideoInput]);
-  useEffect(() => () => stopTracks(previewStream), [previewStream]);
-  const submit = () => {
-    const normalizedDisplayName = displayName.trim();
-    if (!normalizedDisplayName || joining) return;
-    void onJoin({
-      displayName: normalizedDisplayName,
-      microphone,
-      camera,
-      ...selectedAudioInput ? { audioInputDeviceId: selectedAudioInput } : {},
-      ...selectedVideoInput ? { videoInputDeviceId: selectedVideoInput } : {},
-      ...selectedAudioOutput ? { audioOutputDeviceId: selectedAudioOutput } : {}
-    });
-  };
-  const selectAudioInput = (deviceId) => {
-    setSelectedAudioInput(deviceId);
-    void onAudioInputChange?.(deviceId);
-  };
-  const selectVideoInput = (deviceId) => {
-    setSelectedVideoInput(deviceId);
-    void onVideoInputChange?.(deviceId);
-  };
-  const selectAudioOutput = (deviceId) => {
-    setSelectedAudioOutput(deviceId);
-    void onAudioOutputChange?.(deviceId);
-  };
-  return /* @__PURE__ */ jsx(
-    EntranceSurface,
-    {
-      spaceName,
-      logoUrl,
-      displayName,
-      microphone,
-      camera,
-      joining,
-      error,
-      theme,
-      generatedAvatars,
-      previewError,
-      previewStream,
-      onDisplayNameChange: setDisplayName,
-      onMicrophoneChange: setMicrophone,
-      onCameraChange: setCamera,
-      audioInputDevices: effectiveAudioInputDevices,
-      videoInputDevices: effectiveVideoInputDevices,
-      audioOutputDevices: effectiveAudioOutputDevices,
-      selectedAudioInput,
-      selectedVideoInput,
-      selectedAudioOutput,
-      onAudioInputChange: selectAudioInput,
-      onVideoInputChange: selectVideoInput,
-      onAudioOutputChange: selectAudioOutput,
-      onSubmit: submit,
-      onCancel
-    }
-  );
-}
-function devicesOfKind(devices, kind) {
-  return devices.filter((device) => device.kind === kind).map(({ deviceId, label }) => ({ deviceId, label }));
-}
-function captureConstraint(enabled, deviceId) {
-  if (!enabled) return false;
-  return deviceId ? { deviceId: { exact: deviceId } } : true;
-}
-function stopTracks(stream) {
-  stream?.getTracks().forEach((track) => track.stop());
-}
-
-// src/components/feedback/FeedbackDialog.tsx
-import { useCallback, useEffect as useEffect2, useRef, useState as useState2 } from "react";
-import { jsx as jsx2, jsxs } from "react/jsx-runtime";
-var CATEGORIES = [
-  { value: "bug", label: "Bug" },
-  { value: "feature_request", label: "Feature request" },
-  { value: "other", label: "Other" }
-];
-function FeedbackDialog({ isOpen, onClose, client, source = "embedded", captureRootRef }) {
-  const skin = useSkin();
-  const [category, setCategory] = useState2("bug");
-  const [message, setMessage] = useState2("");
-  const [prepared, setPrepared] = useState2(null);
-  const [screenshotUrl, setScreenshotUrl] = useState2();
-  const [screenshotFailure, setScreenshotFailure] = useState2();
-  const [preparing, setPreparing] = useState2(false);
-  const [submitting, setSubmitting] = useState2(false);
-  const [prepareError, setPrepareError] = useState2();
-  const [submitError, setSubmitError] = useState2();
-  const [submitted, setSubmitted] = useState2(false);
-  const openedRef = useRef(false);
-  const preparationRef = useRef(0);
-  const primaryText = skin === "classic" ? "!text-white" : "!text-[var(--chalk-accent-text)]";
-  const prepareFeedback = useCallback(
-    async (includeScreenshot) => {
-      const generation = ++preparationRef.current;
-      setPreparing(true);
-      setPrepared(null);
-      setScreenshotUrl(void 0);
-      setScreenshotFailure(void 0);
-      setPrepareError(void 0);
-      try {
-        const evidence = collectBrowserFeedbackEvidence();
-        const next = await client.feedback.prepare({
-          source,
-          evidence,
-          screenshot_provider: () => includeScreenshot ? captureFeedbackScreenshot(captureRootRef.current) : { state: "removed" }
-        });
-        if (generation !== preparationRef.current) return;
-        setPrepared(next);
-        setScreenshotUrl(next.screenshot ? `data:${next.screenshot.mime_type};base64,${next.screenshot.data_base64}` : void 0);
-        setScreenshotFailure(next.evidence.screenshot.state === "captured" || next.evidence.screenshot.state === "partial" ? void 0 : next.evidence.screenshot.failure_code);
-      } catch (cause) {
-        if (generation !== preparationRef.current) return;
-        setPrepared(null);
-        setScreenshotUrl(void 0);
-        setPrepareError(cause instanceof Error ? cause.message : "Feedback evidence is unavailable. You can still send this message.");
-      } finally {
-        if (generation === preparationRef.current) setPreparing(false);
-      }
-    },
-    [captureRootRef, client, source]
-  );
-  useEffect2(() => {
-    if (!isOpen) {
-      openedRef.current = false;
-      preparationRef.current += 1;
-      return;
-    }
-    if (openedRef.current) return;
-    openedRef.current = true;
-    setCategory("bug");
-    setMessage("");
-    setPrepared(null);
-    setScreenshotUrl(void 0);
-    setScreenshotFailure(void 0);
-    setPrepareError(void 0);
-    setSubmitError(void 0);
-    setSubmitted(false);
-    void prepareFeedback(true);
-  }, [isOpen, prepareFeedback]);
-  useEffect2(() => {
-    if (!isOpen) return;
-    const onKeyDown = (event) => {
-      if (event.key === "Escape") onClose();
-    };
-    window.addEventListener("keydown", onKeyDown);
-    return () => window.removeEventListener("keydown", onKeyDown);
-  }, [isOpen, onClose]);
-  if (!isOpen) return null;
-  const reviseFeedback = () => {
-    if (!submitError) return;
-    setSubmitError(void 0);
-    setPrepared(null);
-    void prepareFeedback(screenshotUrl !== void 0);
-  };
-  const submit = (event) => {
-    event.preventDefault();
-    const normalizedMessage = message.trim();
-    if (!normalizedMessage || submitting) return;
-    setSubmitting(true);
-    setSubmitError(void 0);
-    const send = async () => {
-      try {
-        if (prepared) {
-          await prepared.send({ category, message: normalizedMessage });
-        } else {
-          const evidence = collectBrowserFeedbackEvidence();
-          await client.feedback.send({ category, message: normalizedMessage, source, evidence: { ...evidence, screenshot: { state: "unavailable", failure_code: "capture_failed" } } });
-        }
-        setSubmitted(true);
-      } catch (cause) {
-        setSubmitError(cause instanceof Error ? cause.message : "Feedback could not be sent. Please try again.");
-      } finally {
-        setSubmitting(false);
-      }
-    };
-    void send();
-  };
-  return /* @__PURE__ */ jsxs("div", { "data-chalk-feedback-private": true, "data-chalk-skin": skin, className: "fixed inset-0 z-[70]", onMouseDown: onClose, children: [
-    /* @__PURE__ */ jsx2(ChalkBackdrop, { className: "z-0 !bg-[color-mix(in_srgb,var(--chalk-app-canvas)_90%,transparent)] !backdrop-blur-[1px]" }),
-    /* @__PURE__ */ jsx2("div", { className: "relative z-10 grid h-full place-items-center p-4", children: /* @__PURE__ */ jsxs(
-      ChalkDialogPanel,
-      {
-        className: cn("chalk-textured-surface w-full max-w-lg overflow-hidden !rounded-[14px] !border border-[var(--chalk-app-line-strong)] bg-[var(--chalk-app-panel)] text-[var(--chalk-app-text)] !p-0 shadow-[var(--chalk-app-shadow-sm)]"),
-        "aria-modal": "true",
-        "aria-labelledby": "chalk-feedback-title",
-        onMouseDown: (event) => event.stopPropagation(),
-        children: [
-          /* @__PURE__ */ jsxs("header", { className: "flex items-start justify-between gap-5 border-b border-[var(--chalk-app-line)] px-6 py-5", children: [
-            /* @__PURE__ */ jsxs("div", { children: [
-              /* @__PURE__ */ jsx2("h2", { id: "chalk-feedback-title", className: "text-xl font-semibold tracking-[-0.025em]", children: "Send feedback" }),
-              /* @__PURE__ */ jsx2("p", { className: "mt-1 text-sm text-[var(--chalk-app-text-muted)]", children: "Tell Chalk what happened. We\u2019ll include safe technical context to help us understand it." })
-            ] }),
-            /* @__PURE__ */ jsx2(ChalkIconButton, { type: "button", onClick: onClose, size: "sm", "aria-label": "Close feedback dialog", className: "!h-9 !w-9 !rounded-[8px] text-[var(--chalk-app-text-muted)]", children: /* @__PURE__ */ jsx2(Cancel01Icon, { size: 19 }) })
-          ] }),
-          submitted ? /* @__PURE__ */ jsxs("div", { className: "space-y-5 p-6", children: [
-            /* @__PURE__ */ jsx2("p", { role: "status", className: "text-sm leading-6 text-[var(--chalk-app-text)]", children: "Thanks. Chalk received your feedback." }),
-            /* @__PURE__ */ jsx2(ChalkButton, { type: "button", variant: "solid", tone: "accent", className: cn("w-full", primaryText), onClick: onClose, children: "Done" })
-          ] }) : /* @__PURE__ */ jsxs("form", { className: "space-y-5 p-6", onSubmit: submit, children: [
-            /* @__PURE__ */ jsxs("fieldset", { className: "space-y-2", children: [
-              /* @__PURE__ */ jsx2("legend", { className: "text-sm font-semibold", children: "What kind of feedback is this?" }),
-              /* @__PURE__ */ jsx2("div", { className: "grid gap-2 sm:grid-cols-3", children: CATEGORIES.map((option) => /* @__PURE__ */ jsxs("label", { className: cn("flex cursor-pointer items-center gap-2 rounded-md border border-[var(--chalk-app-line)] px-3 py-2 text-sm", category === option.value && "border-[var(--chalk-app-control-active-line)] bg-[var(--chalk-app-control-active)]/10"), children: [
-                /* @__PURE__ */ jsx2(
-                  "input",
-                  {
-                    type: "radio",
-                    name: "feedback-category",
-                    value: option.value,
-                    checked: category === option.value,
-                    onChange: () => {
-                      setCategory(option.value);
-                      reviseFeedback();
-                    }
-                  }
-                ),
-                /* @__PURE__ */ jsx2("span", { children: option.label })
-              ] }, option.value)) })
-            ] }),
-            /* @__PURE__ */ jsxs("label", { className: "block text-sm font-semibold", htmlFor: "chalk-feedback-message", children: [
-              "Message",
-              /* @__PURE__ */ jsx2(
-                ChalkTextarea,
-                {
-                  id: "chalk-feedback-message",
-                  className: "mt-2",
-                  required: true,
-                  maxLength: 8e3,
-                  value: message,
-                  onChange: (event) => {
-                    setMessage(event.target.value);
-                    reviseFeedback();
-                  },
-                  placeholder: "What should we know?",
-                  "aria-describedby": "chalk-feedback-message-help"
-                }
-              )
-            ] }),
-            /* @__PURE__ */ jsx2("p", { id: "chalk-feedback-message-help", className: "text-xs text-[var(--chalk-app-text-muted)]", children: "One message is enough. Please don\u2019t include secrets or private content." }),
-            /* @__PURE__ */ jsxs("div", { className: "space-y-2", "aria-live": "polite", children: [
-              /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-3", children: [
-                /* @__PURE__ */ jsx2("p", { className: "text-sm font-semibold", children: "Screenshot" }),
-                /* @__PURE__ */ jsxs("div", { className: "flex gap-2", children: [
-                  /* @__PURE__ */ jsxs(ChalkButton, { type: "button", variant: "outline", disabled: preparing, onClick: () => void prepareFeedback(true), className: "!h-8 !rounded-[7px] !px-2.5 !text-xs", children: [
-                    /* @__PURE__ */ jsx2(RefreshIcon, { size: 14 }),
-                    "Refresh"
-                  ] }),
-                  /* @__PURE__ */ jsx2(ChalkButton, { type: "button", variant: "outline", disabled: submitting || !preparing && !screenshotUrl, onClick: () => void prepareFeedback(false), className: "!h-8 !rounded-[7px] !px-2.5 !text-xs", children: "Remove" })
-                ] })
-              ] }),
-              screenshotUrl ? /* @__PURE__ */ jsx2("img", { src: screenshotUrl, alt: "Screenshot preview", className: "max-h-36 w-full rounded-md border border-[var(--chalk-app-line)] object-cover" }) : /* @__PURE__ */ jsx2("p", { className: "rounded-md border border-dashed border-[var(--chalk-app-line)] px-3 py-3 text-xs text-[var(--chalk-app-text-muted)]", children: preparing ? "Preparing screenshot\u2026" : screenshotFailure ? "Screenshot unavailable. You can still send feedback." : "No screenshot attached." })
-            ] }),
-            prepareError ? /* @__PURE__ */ jsx2("p", { className: "text-xs text-[var(--chalk-app-text-muted)]", children: prepareError }) : null,
-            submitError ? /* @__PURE__ */ jsx2("p", { role: "alert", className: "text-sm text-[var(--chalk-app-danger)]", children: submitError }) : null,
-            /* @__PURE__ */ jsx2(ChalkButton, { type: "submit", variant: "solid", tone: "accent", loading: submitting, disabled: !message.trim(), className: cn("w-full", primaryText), children: "Send feedback" })
-          ] })
-        ]
-      }
-    ) })
-  ] });
-}
-
-// src/components/chalk/Chalk.tsx
-import { createSpaceClient } from "@q9labsai/chalk-client";
-import { useCallback as useCallback2, useEffect as useEffect4, useMemo, useRef as useRef2, useState as useState4 } from "react";
-
-// src/internal/useWhiteboardSceneSubscription.ts
-import { useEffect as useEffect3, useState as useState3 } from "react";
-var errorMessage = (cause) => cause instanceof Error ? cause : new Error("Whiteboard could not connect.");
-var summaryError = (summary) => summary.error ? new Error(summary.error.message) : errorMessage(void 0);
-var MAX_RECOVERY_ATTEMPTS = 3;
-var recoveryDelayMs = (attempt) => 250 * 2 ** attempt;
-function useWhiteboardSceneSubscription(transport, active) {
-  const [subscription, setSubscription] = useState3({ status: "closed" });
-  useEffect3(() => {
-    if (!active || !transport) {
-      setSubscription({ status: "closed" });
-      return;
-    }
-    let disposed = false;
-    let starting = false;
-    let startupSettled = false;
-    let ready = false;
-    let recoveryAttempts = 0;
-    let recoveryTimer;
-    let latestSummary;
-    const observesSummary = transport.subscribeSummary !== void 0;
-    const clearRecoveryTimer = () => {
-      if (recoveryTimer === void 0) return;
-      globalThis.clearTimeout(recoveryTimer);
-      recoveryTimer = void 0;
-    };
-    const recover = (cause) => {
-      if (disposed || recoveryTimer !== void 0 || starting) return;
-      if (recoveryAttempts >= MAX_RECOVERY_ATTEMPTS) {
-        setSubscription({ status: "failed", error: errorMessage(cause) });
-        return;
-      }
-      const attempt = recoveryAttempts++;
-      setSubscription({ status: "loading" });
-      recoveryTimer = globalThis.setTimeout(() => {
-        recoveryTimer = void 0;
-        start();
-      }, recoveryDelayMs(attempt));
-    };
-    const handleSummary = (summary) => {
-      latestSummary = summary;
-      if (disposed) return;
-      if (summary.status === "unsubscribed") {
-        setSubscription({ status: "loading" });
-        return;
-      }
-      if (summary.status === "ready") {
-        if (!starting || startupSettled) {
-          recoveryAttempts = 0;
-          ready = true;
-          setSubscription({ status: "ready", transport });
-        }
-        return;
-      }
-      if (summary.status === "loading" || summary.status === "recovering") {
-        if (!ready) setSubscription({ status: "loading" });
-        return;
-      }
-      if (summary.status === "failed") {
-        starting = false;
-        setSubscription({ status: "loading" });
-        recover(summaryError(summary));
-      }
-    };
-    const start = () => {
-      if (disposed || starting) return;
-      clearRecoveryTimer();
-      starting = true;
-      startupSettled = false;
-      setSubscription({ status: "loading" });
-      void Promise.resolve().then(() => transport.startSceneSubscription()).then(
-        () => {
-          starting = false;
-          startupSettled = true;
-          if (disposed) return;
-          if (!latestSummary || latestSummary.status === "ready") {
-            recoveryAttempts = 0;
-            ready = true;
-            setSubscription({ status: "ready", transport });
-          }
-        },
-        (cause) => {
-          starting = false;
-          if (!disposed && observesSummary) recover(cause);
-          else if (!disposed) setSubscription({ status: "failed", error: errorMessage(cause) });
-        }
-      );
-    };
-    setSubscription({ status: "loading" });
-    const unsubscribeSummary = transport.subscribeSummary?.(handleSummary);
-    start();
-    return () => {
-      disposed = true;
-      clearRecoveryTimer();
-      unsubscribeSummary?.();
-      void Promise.resolve(transport.stopSceneSubscription());
-    };
-  }, [active, transport]);
-  return subscription;
-}
-
-// src/whiteboard/wire-adapters.ts
-function fromWhiteboardWireElement(element) {
-  return {
-    id: element.id,
-    type: element.type,
-    version: element.version,
-    versionNonce: element.version_nonce,
-    index: element.index,
-    isDeleted: element.is_deleted,
-    payload: element.payload
-  };
-}
-function toWhiteboardWireElement(element) {
-  return {
-    id: element.id,
-    type: element.type,
-    version: element.version,
-    version_nonce: element.versionNonce,
-    index: element.index,
-    is_deleted: element.isDeleted,
-    payload: element.payload
-  };
-}
-function toWhiteboardCollaborationEvent(event) {
-  if (event.type === "snapshot" || event.type === "update") {
-    return {
-      ...event,
-      elements: event.elements.map(toWhiteboardWireElement)
-    };
-  }
-  if (event.type === "cursor") {
-    return {
-      type: "cursor",
-      participantId: event.participantId,
-      displayName: event.displayName,
-      x: event.x,
-      y: event.y,
-      occurredAt: event.occurredAt
-    };
-  }
-  return event;
-}
-
-// src/components/chalk/Chalk.tsx
-import { Fragment, jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
-function Chalk(props) {
-  const colorScheme = useResolvedColorScheme(props.theme?.palette ? getThemeMode(props.theme.palette) : props.theme?.colorScheme);
-  const skin = props.theme?.skin ?? "classic";
-  const suppliedClient = props.client;
-  const getAccessRef = useRef2(props.getAccess);
-  getAccessRef.current = props.getAccess;
-  const getLatestAccess = useCallback2((context) => {
-    const latestGetAccess = getAccessRef.current;
-    if (!latestGetAccess) return Promise.reject(new Error("Chalk cannot refresh access after getAccess was removed."));
-    return latestGetAccess(context);
-  }, []);
-  const ownedClient = useMemo(() => {
-    if (suppliedClient) return null;
-    if (!props.space || !getAccessRef.current) throw new Error("Chalk requires either client or both space and getAccess.");
-    return createSpaceClient({ space: props.space, getAccess: getLatestAccess });
-  }, [getLatestAccess, props.space, suppliedClient]);
-  const client = suppliedClient ?? ownedClient;
-  const feedbackRootRef = useRef2(null);
-  useEffect4(() => {
-    if (!ownedClient) return;
-    return () => {
-      void ownedClient.leave().catch(() => void 0).finally(() => ownedClient.dispose());
-    };
-  }, [ownedClient]);
-  return /* @__PURE__ */ jsx3(SkinProvider, { skin, children: /* @__PURE__ */ jsx3(
-    "div",
-    {
-      ref: feedbackRootRef,
-      "data-chalk": true,
-      "data-chalk-feedback-root": true,
-      "data-chalk-theme": colorScheme,
-      "data-chalk-palette": props.theme?.palette,
-      "data-chalk-texture": props.theme?.texture,
-      "data-chalk-skin": skin,
-      className: "chalk-root h-full min-h-0 w-full",
-      style: chalkThemeStyle(props.theme, colorScheme),
-      children: /* @__PURE__ */ jsx3(ChalkProvider, { client, children: /* @__PURE__ */ jsx3(SpaceExperience, { ...props, feedbackRootRef, resolvedColorScheme: colorScheme }) })
-    }
-  ) });
-}
-function SpaceExperience(props) {
-  const client = useSpaceClient();
-  const connection = useConnection();
-  const offline = useOffline();
-  const participants = useParticipants();
-  const previousStatus = useRef2(connection.status);
-  const hasObservedStatus = useRef2(false);
-  const hasBeenLive = useRef2(connection.status === "live" || connection.status === "reconnecting");
-  const autoJoinAttempted = useRef2(false);
-  const previousClient = useRef2(client);
-  const [joinError, setJoinError] = useState4(null);
-  const lastEpisode = useRef2(connection.episode);
-  const lastParticipantCount = useRef2(participants.roster.length);
-  const [retryPending, setRetryPending] = useState4(false);
-  const [episodeEnded, setEpisodeEnded] = useState4(false);
-  const [endedAt, setEndedAt] = useState4(null);
-  const entrance = props.entrance ?? true;
-  const spaceName = props.spaceName ?? props.space ?? "Space";
-  if (connection.episode) lastEpisode.current = connection.episode;
-  if (participants.roster.length > 0) lastParticipantCount.current = participants.roster.length;
-  if (previousClient.current !== client) {
-    previousClient.current = client;
-    previousStatus.current = connection.status;
-    hasObservedStatus.current = false;
-    hasBeenLive.current = connection.status === "live" || connection.status === "reconnecting";
-    autoJoinAttempted.current = false;
-  }
-  useClientEvents(client, props);
-  const join = useCallback2(
-    async (settings) => {
-      try {
-        setJoinError(null);
-        await client.join(settings);
-      } catch (cause) {
-        setJoinError(cause instanceof Error ? cause.message : "Could not enter this Space.");
-      }
-    },
-    [client]
-  );
-  const retryAutomaticJoin = useCallback2(() => {
-    autoJoinAttempted.current = true;
-    setRetryPending(true);
-    void join(defaultJoinOptions(props)).finally(() => setRetryPending(false));
-  }, [join, props]);
-  useEffect4(() => setJoinError(null), [client]);
-  useEffect4(() => {
-    setEpisodeEnded(false);
-    setEndedAt(null);
-  }, [client]);
-  useEffect4(
-    () => client.on("episodeEnded", () => {
-      setEpisodeEnded(true);
-      setEndedAt((/* @__PURE__ */ new Date()).toISOString());
-    }),
-    [client]
-  );
-  useEffect4(() => {
-    if (entrance || connection.status !== "idle" || autoJoinAttempted.current) return;
-    autoJoinAttempted.current = true;
-    void join(defaultJoinOptions(props));
-  }, [connection.status, entrance, join, props.defaults?.camera, props.defaults?.microphone, props.displayName]);
-  useEffect4(() => {
-    const previous = previousStatus.current;
-    if (hasObservedStatus.current) {
-      if (connection.status === "live" && previous !== "live" && previous !== "reconnecting") props.onJoined?.();
-      if (connection.status === "left" && previous !== "left") props.onLeft?.();
-    }
-    previousStatus.current = connection.status;
-    hasObservedStatus.current = true;
-    if (connection.status === "live" || connection.status === "reconnecting") hasBeenLive.current = true;
-    if (connection.status === "left" && previous !== "left") setEndedAt((current) => current ?? (/* @__PURE__ */ new Date()).toISOString());
-  }, [connection.status, props.onJoined, props.onLeft]);
-  if (connection.status === "idle") {
-    if (!entrance) return /* @__PURE__ */ jsx3(StatusSurface, { message: joinError ?? `Entering ${spaceName}\u2026`, onRetry: joinError ? retryAutomaticJoin : void 0, retryPending, retryError: joinError });
-    return /* @__PURE__ */ jsx3(Entrance, { spaceName, logoUrl: props.logoUrl, defaultDisplayName: props.displayName, defaults: props.defaults, error: joinError ?? void 0, theme: props.theme, onJoin: join });
-  }
-  if (connection.status === "joining")
-    return entrance ? /* @__PURE__ */ jsx3(Entrance, { spaceName, logoUrl: props.logoUrl, defaultDisplayName: props.displayName, defaults: props.defaults, joining: true, error: joinError ?? void 0, theme: props.theme, onJoin: join }) : /* @__PURE__ */ jsx3(StatusSurface, { message: `Entering ${spaceName}\u2026` });
-  if (connection.status === "failed") {
-    const failureMessage = [connection.lastError?.message ?? joinError ?? "Unable to enter this Space.", offline.notice].filter(Boolean).join(" ");
-    if (!hasBeenLive.current && entrance) return /* @__PURE__ */ jsx3(Entrance, { spaceName, logoUrl: props.logoUrl, defaultDisplayName: props.displayName, defaults: props.defaults, error: failureMessage, theme: props.theme, onJoin: join });
-    return /* @__PURE__ */ jsx3(StatusSurface, { phase: "failed", message: failureMessage, onRetry: retryAutomaticJoin, retryPending, retryError: joinError });
-  }
-  if (connection.status === "leaving") return /* @__PURE__ */ jsx3(StatusSurface, { phase: "leaving", message: `Leaving ${spaceName}\u2026`, spaceName });
-  if (connection.status === "left")
-    return /* @__PURE__ */ jsx3(
-      StatusSurface,
-      {
-        phase: episodeEnded ? "episode-ended" : "left",
-        message: [episodeEnded ? "This Episode has ended for everyone." : "Your connection is closed. You can re-enter from here.", offline.notice].filter(Boolean).join(" "),
-        spaceName,
-        episode: lastEpisode.current,
-        endedAt,
-        participantCount: lastParticipantCount.current,
-        onRetry: episodeEnded ? void 0 : retryAutomaticJoin,
-        retryPending,
-        retryError: joinError
-      }
-    );
-  return /* @__PURE__ */ jsx3(SpaceSurface, { ...props, spaceName });
-}
-function SpaceSurface(props) {
-  const client = useSpaceClient();
-  const connection = useConnection();
-  const self = useSelf();
-  const media = useMedia();
-  const whiteboardState = useWhiteboard();
-  const canEndEpisode = useCan("endEpisode");
-  const canDrawWhiteboard = useCan("drawWhiteboard");
-  const [settingsOpen, setSettingsOpen] = useState4(false);
-  const [settingsInitialSection, setSettingsInitialSection] = useState4();
-  const [infoOpen, setInfoOpen] = useState4(false);
-  const [feedbackOpen, setFeedbackOpen] = useState4(false);
-  const [commandError, setCommandError] = useState4(() => connection.lastError?.recoverable && connection.lastError.code.startsWith("media.") ? connection.lastError.message : null);
-  const [settings, setSettings] = useState4(() => createSettings(self.displayName ?? "", props.layout ?? "focus", props.theme?.skin ?? "classic", props.theme?.palette ?? (props.resolvedColorScheme === "dark" ? "warm-charcoal" : "light"), props.theme?.texture ?? "none"));
-  const resolvedSkin = props.theme?.skin ?? "classic";
-  const resolvedPalette = props.theme?.palette ?? (props.resolvedColorScheme === "dark" ? "warm-charcoal" : "light");
-  const resolvedTexture = props.theme?.texture ?? "none";
-  const appearancePaletteExplicitRef = useRef2(props.theme?.palette !== void 0);
-  const settingsRef = useRef2(settings);
-  settingsRef.current = settings;
-  useEffect4(() => {
-    setSettings((current) => ({
-      ...current,
-      identity: { displayName: self.displayName ?? current.identity.displayName },
-      join: { audioEnabled: media.local.microphone.state === "enabled" || media.local.microphone.state === "requesting", videoEnabled: media.local.camera.state === "enabled" || media.local.camera.state === "requesting" },
-      audio: { ...current.audio, selectedInput: media.selection.microphone ?? void 0, selectedOutput: media.selection.speaker ?? void 0 },
-      video: { ...current.video, selectedInput: media.selection.camera ?? void 0 }
-    }));
-  }, [media.local.camera.state, media.local.microphone.state, media.selection.camera, media.selection.microphone, media.selection.speaker, self.displayName]);
-  useEffect4(() => {
-    if (!props.theme?.skin && !props.theme?.palette && !props.theme?.texture) return;
-    setSettings((current) => ({
-      ...current,
-      appearance: {
-        ...current.appearance,
-        skin: props.theme?.skin ?? current.appearance.skin,
-        palette: props.theme?.palette ?? current.appearance.palette,
-        texture: props.theme?.texture ?? current.appearance.texture,
-        theme: (props.theme?.palette ?? current.appearance.palette) === "light" ? "light" : "dark"
-      }
-    }));
-  }, [props.theme?.palette, props.theme?.skin, props.theme?.texture]);
-  useEffect4(() => {
-    if (props.theme?.palette || appearancePaletteExplicitRef.current) return;
-    const palette = props.resolvedColorScheme === "dark" ? "warm-charcoal" : "light";
-    setSettings((current) => current.appearance.palette === palette ? current : { ...current, appearance: { ...current.appearance, palette, theme: palette === "light" ? "light" : "dark" } });
-  }, [props.resolvedColorScheme, props.theme?.palette, props.theme?.texture]);
-  const runCommand = useCallback2(async (command) => {
-    try {
-      await command();
-      setCommandError(null);
-    } catch (cause) {
-      setCommandError(cause instanceof Error ? cause.message : "This command could not be completed.");
-    }
-  }, []);
-  const whiteboardTransport = client.whiteboard.transport();
-  const whiteboardAvailable = props.features?.whiteboard !== false;
-  const whiteboardSubscription = useWhiteboardSceneSubscription(whiteboardTransport, whiteboardAvailable);
-  const setWhiteboardPresentation = whiteboardSubscription.status === "ready" ? bindWhiteboardPresentation(whiteboardSubscription.transport) : void 0;
-  useEffect4(() => {
-    if (whiteboardSubscription.status === "failed") setCommandError(whiteboardSubscription.error.message);
-    else if (whiteboardSubscription.status === "loading" || whiteboardSubscription.status === "ready") setCommandError(null);
-  }, [whiteboardSubscription]);
-  const whiteboard = whiteboardAvailable && whiteboardState.engine.presenting && whiteboardSubscription.status === "ready" ? {
-    isOpen: true,
-    props: {
-      canDraw: canDrawWhiteboard,
-      collab: {
-        canDraw: canDrawWhiteboard,
-        subscribe: (listener) => whiteboardSubscription.transport.subscribe((event) => listener(toWhiteboardCollaborationEvent(event))),
-        submitUpdate: async (input) => whiteboardSubscription.transport.submitUpdate({ sceneId: input.sceneId, syncAll: input.syncAll, elements: input.elements.map(fromWhiteboardWireElement) }),
-        sendCursor: (input) => whiteboardSubscription.transport.sendCursor(input),
-        requestSnapshot: () => whiteboardSubscription.transport.requestSnapshot(),
-        onSubmissionError: (cause) => setCommandError(cause instanceof Error ? cause.message : "Whiteboard could not sync."),
-        clear: () => whiteboardSubscription.transport.clear(),
-        initiateUpload: (input) => whiteboardSubscription.transport.files.initiateUpload(input),
-        finalizeUpload: (uploadId) => whiteboardSubscription.transport.files.finalizeUpload(uploadId),
-        presignDownload: (fileId) => whiteboardSubscription.transport.files.getDownloadUrl(fileId)
-      }
-    }
-  } : void 0;
-  return /* @__PURE__ */ jsx3(
-    SpaceView,
-    {
-      spaceName: props.spaceName,
-      logoUrl: props.logoUrl,
-      inviteLink: props.inviteLink,
-      pickChatFiles: props.pickChatFiles,
-      skin: settings.appearance.skin ?? resolvedSkin,
-      palette: settings.appearance.palette ?? resolvedPalette,
-      texture: settings.appearance.texture ?? resolvedTexture,
-      generatedAvatars: settings.appearance.generatedAvatars,
-      commandError: commandError ?? void 0,
-      onDismissCommandError: () => setCommandError(null),
-      layout: settings.appearance.layout === "focus" || settings.appearance.layout === "grid" || settings.appearance.layout === "presentation" ? settings.appearance.layout : props.layout ?? "focus",
-      onLayoutChange: (nextLayout) => {
-        setSettings((current) => ({ ...current, appearance: { ...current.appearance, layout: nextLayout } }));
-        props.onLayoutChange?.(nextLayout);
-      },
-      features: { ...props.features, sounds: props.features?.sounds !== false && settings.experience.sounds },
-      onOpenDiagnostics: props.onOpenDiagnostics,
-      onOpenFeedback: () => setFeedbackOpen(true),
-      whiteboard,
-      onToggleWhiteboard: canDrawWhiteboard && setWhiteboardPresentation ? () => void runCommand(() => setWhiteboardPresentation(!whiteboardState.engine.presenting)) : void 0,
-      infoDialog: props.features?.info !== false && (props.inviteLink || props.diagnosticReference || props.spaceDescription) ? {
-        isOpen: infoOpen,
-        onOpenChange: setInfoOpen,
-        spaceName: props.spaceName,
-        spaceDescription: props.spaceDescription,
-        inviteLink: props.inviteLink,
-        onCopyLink: props.inviteLink ? () => void navigator.clipboard?.writeText(props.inviteLink) : void 0,
-        diagnosticReference: props.diagnosticReference,
-        onCopyDiagnosticReference: (reference) => void navigator.clipboard?.writeText(reference),
-        onSendFeedback: props.onSendFeedback
-      } : void 0,
-      onOpenSettings: props.features?.settings !== false ? () => {
-        setSettingsInitialSection(void 0);
-        setSettingsOpen(true);
-      } : void 0,
-      settingsDialog: props.features?.settings !== false ? /* @__PURE__ */ jsx3(
-        SettingsDialog,
-        {
-          isOpen: settingsOpen,
-          onClose: () => {
-            setSettingsOpen(false);
-            setSettingsInitialSection(void 0);
-          },
-          initialSection: settingsInitialSection,
-          settings,
-          onUpdateIdentity: (updates) => {
-            setSettings((current) => ({ ...current, identity: { ...current.identity, ...updates } }));
-            const nextDisplayName = updates.displayName?.trim();
-            if (nextDisplayName) void runCommand(() => client.participants.renameSelf(nextDisplayName));
-          },
-          onUpdateJoin: (updates) => {
-            setSettings((current) => ({ ...current, join: { ...current.join, ...updates } }));
-            if (updates.audioEnabled !== void 0) runCommand(() => client.media.setMicrophoneEnabled(updates.audioEnabled));
-            if (updates.videoEnabled !== void 0) runCommand(() => client.media.setCameraEnabled(updates.videoEnabled));
-          },
-          onUpdateAudio: (updates) => {
-            setSettings((current) => ({ ...current, audio: { ...current.audio, ...updates } }));
-            if (updates.selectedInput) runCommand(() => client.media.selectMicrophone(updates.selectedInput));
-            if (updates.selectedOutput) runCommand(() => client.media.selectSpeaker(updates.selectedOutput));
-          },
-          onUpdateVideo: (updates) => {
-            setSettings((current) => ({ ...current, video: { ...current.video, ...updates } }));
-            if (updates.selectedInput) runCommand(() => client.media.selectCamera(updates.selectedInput));
-          },
-          onUpdateAppearance: (updates) => {
-            if (updates.palette !== void 0) appearancePaletteExplicitRef.current = true;
-            const current = settingsRef.current;
-            if (updates.skin !== void 0 && updates.skin !== current.appearance.skin) setSettingsInitialSection("appearance");
-            const next = { ...current, appearance: { ...current.appearance, ...updates } };
-            settingsRef.current = next;
-            setSettings(next);
-            if (updates.layout === "focus" || updates.layout === "grid" || updates.layout === "presentation") props.onLayoutChange?.(updates.layout);
-          },
-          onUpdateExperience: (updates) => setSettings((current) => ({ ...current, experience: { ...current.experience, ...updates } })),
-          audioInputDevices: media.devices.microphones.map((device) => ({ ...device, kind: "audioinput" })),
-          audioOutputDevices: media.devices.speakers.map((device) => ({ ...device, kind: "audiooutput" })),
-          videoInputDevices: media.devices.cameras.map((device) => ({ ...device, kind: "videoinput" })),
-          videoTrack: media.local.camera.track,
-          participantColorSeed: self.displayName ?? void 0
-        }
-      ) : void 0,
-      onLeft: () => runCommand(() => client.leave()),
-      onEndEpisode: canEndEpisode ? () => runCommand(() => client.endEpisode()) : void 0,
-      reconnecting: { isVisible: connection.status === "reconnecting", status: "reconnecting", showNotice: false },
-      overlay: /* @__PURE__ */ jsxs2(Fragment, { children: [
-        media.incomingRequests[0] ? /* @__PURE__ */ jsx3(MediaRequestDialog, { request: media.incomingRequests[0], onDecline: () => void runCommand(() => client.media.declineRequest(media.incomingRequests[0].requestId)), onAllow: () => void runCommand(() => client.media.acceptRequest(media.incomingRequests[0].requestId)) }) : null,
-        /* @__PURE__ */ jsx3(FeedbackDialog, { isOpen: feedbackOpen, onClose: () => setFeedbackOpen(false), client, source: props.feedbackSource, captureRootRef: props.feedbackRootRef })
-      ] })
-    }
-  );
-}
-function bindWhiteboardPresentation(transport) {
-  const setPresentation = transport.setPresentation;
-  if (!setPresentation) return void 0;
-  return (presenting) => setPresentation.call(transport, presenting);
-}
-function defaultJoinOptions(props) {
-  const displayName = props.displayName?.trim();
-  return { ...displayName ? { displayName } : {}, microphone: props.defaults?.microphone ?? true, camera: props.defaults?.camera ?? true };
-}
-function useResolvedColorScheme(requested = "light") {
-  const [resolved, setResolved] = useState4(() => requested === "system" ? readSystemColorScheme() : requested);
-  useEffect4(() => {
-    if (requested !== "system") return void setResolved(requested);
-    if (typeof window === "undefined" || typeof window.matchMedia !== "function") return void setResolved("light");
-    const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
-    const update = () => setResolved(mediaQuery.matches ? "dark" : "light");
-    update();
-    mediaQuery.addEventListener?.("change", update);
-    return () => mediaQuery.removeEventListener?.("change", update);
-  }, [requested]);
-  return requested === "system" ? resolved : requested;
-}
-function readSystemColorScheme() {
-  return typeof window !== "undefined" && window.matchMedia?.("(prefers-color-scheme: dark)").matches ? "dark" : "light";
-}
-function useClientEvents(client, callbacks) {
-  useEffect4(() => client.on("participantJoined", (event) => callbacks.onParticipantJoined?.(event)), [callbacks.onParticipantJoined, client]);
-  useEffect4(() => client.on("participantLeft", (event) => callbacks.onParticipantLeft?.(event)), [callbacks.onParticipantLeft, client]);
-  useEffect4(() => client.on("episodeEnded", (event) => callbacks.onEpisodeEnded?.(event)), [callbacks.onEpisodeEnded, client]);
-  useEffect4(() => client.on("screenShareStarted", (event) => callbacks.onScreenShareStarted?.(event)), [callbacks.onScreenShareStarted, client]);
-  useEffect4(() => client.on("screenShareStopped", (event) => callbacks.onScreenShareStopped?.(event)), [callbacks.onScreenShareStopped, client]);
-  useEffect4(() => client.on("error", (event) => callbacks.onError?.(event)), [callbacks.onError, client]);
-}
-function createSettings(displayName, layout, skin, palette, texture) {
-  return {
-    identity: { displayName },
-    join: { videoEnabled: true, audioEnabled: true },
-    audio: { outputVolume: 100, noiseSuppression: false, echoCancellation: true, autoGainControl: true },
-    video: { quality: "auto" },
-    appearance: { layout, theme: palette === "light" ? "light" : "dark", skin, palette, texture, gradient: "default", showFilmstrip: true, reducedMotion: false, generatedAvatars: true, profileGradient: { mode: "auto" }, ambientBackground: true },
-    experience: { captions: false, compactMode: false, showInviteToast: true, defaultOpenChat: false, defaultOpenParticipants: false, defaultOpenTranscription: false, autoOpenPictureInPicture: false, sounds: true }
-  };
-}
-
-// src/components/space-view/RecordingSpaceView.tsx
-import { CHALK_CHAT_ATTACHMENT_MIME_TYPES } from "@q9labsai/chalk-client";
-import { jsx as jsx4 } from "react/jsx-runtime";
-var RECORDING_TOOLBAR_BUTTONS = ["record", "participants", "chat", "reactions", "whiteboard"];
-var CHAT_ATTACHMENT_MIME_TYPES = new Set(CHALK_CHAT_ATTACHMENT_MIME_TYPES);
-function hasRenderableMedia(media) {
-  return media !== null && media !== void 0 && media !== false;
-}
-function isChatAttachmentMimeType(value) {
-  return CHAT_ATTACHMENT_MIME_TYPES.has(value);
-}
-function toChatMessages(frame) {
-  const displayTimes = /* @__PURE__ */ new Map();
-  const attachmentAssets = /* @__PURE__ */ new Map();
-  const messages = frame.chat.messages.map((message) => {
-    displayTimes.set(message.id, message.displayTime);
-    const attachments = message.attachments.map((attachment) => {
-      if (!isChatAttachmentMimeType(attachment.contentType)) throw new TypeError(`unsupported recording chat attachment content type: ${attachment.contentType}`);
-      attachmentAssets.set(attachment.id, attachment.assetId);
-      return {
-        attachmentId: attachment.id,
-        fileName: attachment.fileName,
-        mimeType: attachment.contentType,
-        byteLength: attachment.byteSize
-      };
-    });
-    return {
-      messageId: message.id,
-      clientMessageId: message.id,
-      sequence: String(message.sequence),
-      participantId: message.participantId,
-      displayName: message.displayName,
-      text: message.text,
-      // The supplied displayTime is authoritative. This stable ISO value only
-      // satisfies the shared chat model and is never formatted for presentation.
-      createdAt: new Date(message.createdAtMs).toISOString(),
-      attachments
-    };
-  });
-  return { messages, displayTimes, attachmentAssets };
-}
-function toParticipant(participant, resolveAssetUrl) {
-  return {
-    id: participant.id,
-    displayName: participant.displayName,
-    isSpeaking: participant.speaking,
-    isActiveSpeaker: participant.activeSpeaker,
-    isMuted: participant.microphoneMuted,
-    isVideoEnabled: participant.cameraEnabled,
-    isScreenSharing: participant.screenShareEnabled,
-    isHandRaised: participant.handRaised,
-    avatarUrl: participant.avatarAssetId ? resolveAssetUrl(participant.avatarAssetId) : void 0
-  };
-}
-function RecordingSpaceView({ frame, resolveMedia, resolveAssetUrl, renderWhiteboard, renderToken, className }) {
-  const sharedContent = frame.sharedContent;
-  const joinedParticipants = [...frame.participants.filter((participant) => participant.joined)].sort((left, right) => left.joinOrdinal - right.joinOrdinal || left.id.localeCompare(right.id));
-  const recordingParticipantsById = new Map(joinedParticipants.map((participant) => [participant.id, participant]));
-  const participantsById = new Map(joinedParticipants.map((participant) => [participant.id, toParticipant(participant, resolveAssetUrl)]));
-  const visibleMedia = frame.media.filter((source) => source.visible);
-  const mediaNodes = /* @__PURE__ */ new Map();
-  for (const source of visibleMedia) {
-    const participant = recordingParticipantsById.get(source.participantId);
-    if (!participant) continue;
-    mediaNodes.set(source.sourceId, resolveMedia(source, { participant, placement: source.kind === "camera" ? "camera" : "shared_content" }));
-  }
-  const cameraByParticipant = new Map(visibleMedia.filter((source) => source.kind === "camera").map((source) => [source.participantId, source]));
-  const items = joinedParticipants.map((participant) => ({ kind: "participant", id: participant.id, participant: participantsById.get(participant.id) }));
-  if (sharedContent.kind === "screen_share") {
-    const participant = participantsById.get(sharedContent.participantId);
-    const source = visibleMedia.find((candidate) => candidate.sourceId === sharedContent.sourceId && candidate.kind === "screen_share");
-    if (!participant || !source) throw new TypeError("recording screen share does not resolve to a joined participant and visible source");
-    items.push({ kind: "screen-share", id: screenShareItemId(participant.id), participant });
-  } else if (sharedContent.kind === "whiteboard") {
-    items.push({ kind: "whiteboard", id: WHITEBOARD_ITEM_ID });
-  }
-  const { messages, displayTimes, attachmentAssets } = toChatMessages(frame);
-  const participantNames = Object.fromEntries(frame.participants.map((participant) => [participant.id, participant.displayName]));
-  const durationSeconds = Math.floor(frame.elapsedMs / 1e3);
-  const renderContent = (item) => {
-    if (item.kind === "whiteboard") {
-      const content = sharedContent.kind === "whiteboard" ? renderWhiteboard?.(sharedContent) : null;
-      return /* @__PURE__ */ jsx4(StageContentTileSurface, { item, media: content, mediaVisible: hasRenderableMedia(content), className: "h-full w-full" });
-    }
-    if (sharedContent.kind !== "screen_share") throw new TypeError("recording stage contains a screen share without shared-content state");
-    const source = visibleMedia.find((candidate) => candidate.sourceId === sharedContent.sourceId);
-    if (!source) throw new TypeError("recording screen share source is not visible");
-    const media = mediaNodes.get(source.sourceId);
-    return /* @__PURE__ */ jsx4(ScreenSharePresentation, { sharedByName: item.participant.displayName, media, mediaVisible: hasRenderableMedia(media) });
-  };
-  return /* @__PURE__ */ jsx4(SkinProvider, { skin: frame.profile.theme.skin, children: /* @__PURE__ */ jsx4(
-    SpacePresentation,
-    {
-      skin: frame.profile.theme.skin,
-      palette: frame.profile.theme.palette,
-      texture: frame.profile.theme.texture,
-      stageBackground: frame.profile.theme.stageBackground,
-      header: {
-        spaceName: frame.space.name,
-        logoUrl: frame.space.logoAssetId ? resolveAssetUrl(frame.space.logoAssetId) : void 0,
-        duration: durationSeconds,
-        isRecording: true,
-        layout: frame.view.layout
-      },
-      stage: /* @__PURE__ */ jsx4(
-        Stage,
-        {
-          items,
-          layout: frame.view.layout,
-          interactive: false,
-          animate: false,
-          generatedAvatars: frame.profile.theme.generatedAvatars,
-          emptyState: /* @__PURE__ */ jsx4(QuietSpace, {}),
-          renderParticipant: (item, context) => {
-            const source = cameraByParticipant.get(item.participant.id);
-            const media = source ? mediaNodes.get(source.sourceId) : null;
-            return /* @__PURE__ */ jsx4(
-              ParticipantTileSurface,
-              {
-                participant: item.participant,
-                media,
-                mediaVisible: item.participant.isVideoEnabled === true && hasRenderableMedia(media),
-                aspectRatio: "fill",
-                pinned: context.pinned,
-                style: context.style,
-                hidden: context.hidden,
-                generatedAvatars: frame.profile.theme.generatedAvatars,
-                animatedAvatars: false
-              }
-            );
-          },
-          renderContentTile: (item, context) => {
-            const media = item.kind === "whiteboard" && frame.sharedContent.kind === "whiteboard" ? renderWhiteboard?.(frame.sharedContent) : frame.sharedContent.kind === "screen_share" ? mediaNodes.get(frame.sharedContent.sourceId) : null;
-            return /* @__PURE__ */ jsx4(StageContentTileSurface, { item, media, mediaVisible: hasRenderableMedia(media), pinned: context.pinned, style: context.style, hidden: context.hidden });
-          },
-          renderPrimaryContent: renderContent,
-          className: "h-full"
-        }
-      ),
-      controls: /* @__PURE__ */ jsx4(ControlBarPresentation, { placement: "floating", density: "comfortable", duration: durationSeconds, buttons: RECORDING_TOOLBAR_BUTTONS, isRecording: true, isChatOpen: true, isWhiteboardOpen: sharedContent.kind === "whiteboard", expanded: true, detectDevices: false, displayOnly: true }),
-      stageOverlay: /* @__PURE__ */ jsx4(ReactionsOverlayPresentation, { reactions: frame.reactions, elapsedMs: frame.elapsedMs }),
-      sidebar: /* @__PURE__ */ jsx4(SpaceDrawer, { state: "open", interactive: false, children: /* @__PURE__ */ jsx4(
-        ChatPanelPresentation,
-        {
-          messages,
-          participantNames,
-          onResolveAttachmentUrl: async (attachmentId) => {
-            const assetId = attachmentAssets.get(attachmentId);
-            if (!assetId) throw new TypeError(`recording chat attachment is unknown: ${attachmentId}`);
-            return resolveAssetUrl(assetId);
-          },
-          messageDisplayTime: (message) => displayTimes.get(message.messageId) ?? "",
-          autoScrollBehavior: "auto",
-          generatedAvatars: frame.profile.theme.generatedAvatars,
-          stableTexture: true,
-          disabled: true
-        }
-      ) }),
-      renderToken,
-      interactive: false,
-      className
-    }
-  ) });
-}
-RecordingSpaceView.displayName = "RecordingSpaceView";
-
-// src/components/recording-history/RecordingHistoryPanel.tsx
-import "react";
-import { jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
-function RecordingHistoryPanel({
-  recordings,
-  isLoading = false,
-  error,
-  hasMore = false,
-  downloadingRecordingId,
-  readingTranscriptRecordingId,
-  refreshingExportRecordingId,
-  requestingExportRecordingId,
-  requestingTranscriptRecordingId,
-  onDownload,
-  onLoadMore,
-  onReadTranscript,
-  onRefreshExport,
-  onRequestExport,
-  onRequestTranscript,
-  onRetry,
-  onWatch,
-  className
-}) {
-  return /* @__PURE__ */ jsxs3(ChalkPanel, { className: cn("h-full min-h-0 w-full overflow-hidden bg-[var(--chalk-app-panel)] p-0", className), contentClassName: "flex h-full min-h-0 flex-col", role: "region", "aria-label": "Recording history", seed: "recording-history-panel", children: [
-    /* @__PURE__ */ jsxs3("header", { className: "flex items-center justify-between gap-3 border-b border-[var(--chalk-app-line)] px-4 py-3", children: [
-      /* @__PURE__ */ jsxs3("div", { children: [
-        /* @__PURE__ */ jsx5("h2", { className: "text-base font-semibold", children: "Recordings" }),
-        /* @__PURE__ */ jsx5("p", { className: "mt-0.5 text-xs text-[var(--chalk-app-text-muted)]", children: "Captured Episode activity" })
-      ] }),
-      isLoading ? /* @__PURE__ */ jsx5(Loading01Icon, { className: "size-4 animate-spin text-[var(--chalk-app-text-muted)]", "aria-label": "Loading recordings" }) : null
-    ] }),
-    /* @__PURE__ */ jsx5("div", { className: "min-h-0 flex-1 overflow-y-auto p-3", children: error ? /* @__PURE__ */ jsx5(ChalkEmptyState, { title: "Recordings could not be loaded", description: error, tone: "danger", seed: "recording-history-error", children: onRetry ? /* @__PURE__ */ jsxs3(ChalkButton, { className: "mt-4", onClick: onRetry, tone: "danger", children: [
-      /* @__PURE__ */ jsx5(RefreshIcon, { className: "size-4" }),
-      "Try again"
-    ] }) : null }) : recordings.length === 0 && !isLoading ? /* @__PURE__ */ jsx5(ChalkEmptyState, { title: "No recordings yet", description: "Captured Episode activity will appear here.", seed: "recording-history-empty", children: /* @__PURE__ */ jsx5(Video01Icon, { className: "mx-auto mt-4 size-8 text-[var(--chalk-app-text-muted)]", "aria-hidden": "true" }) }) : /* @__PURE__ */ jsx5("ul", { className: "grid gap-2", "aria-label": "Recordings", children: recordings.map((recording) => /* @__PURE__ */ jsx5(
-      RecordingHistoryRow,
-      {
-        recording,
-        downloading: downloadingRecordingId === recording.id,
-        readingTranscript: readingTranscriptRecordingId === recording.id,
-        refreshingExport: refreshingExportRecordingId === recording.id,
-        requestingExport: requestingExportRecordingId === recording.id,
-        requestingTranscript: requestingTranscriptRecordingId === recording.id,
-        onDownload,
-        onReadTranscript,
-        onRefreshExport,
-        onRequestExport,
-        onRequestTranscript,
-        onWatch
-      },
-      recording.id
-    )) }) }),
-    hasMore && !error ? /* @__PURE__ */ jsx5("footer", { className: "border-t border-[var(--chalk-app-line)] p-3", children: /* @__PURE__ */ jsx5(ChalkButton, { className: "w-full", disabled: isLoading || !onLoadMore, loading: isLoading, onClick: onLoadMore, children: "Load more" }) }) : null
-  ] });
-}
-function RecordingHistoryRow({ downloading, onDownload, onReadTranscript, onRefreshExport, onRequestExport, onRequestTranscript, onWatch, readingTranscript, recording, refreshingExport, requestingExport, requestingTranscript }) {
-  return /* @__PURE__ */ jsx5("li", { children: /* @__PURE__ */ jsxs3(ChalkPanel, { className: "p-3", contentClassName: "flex items-start gap-3", seed: `recording-${recording.id}`, children: [
-    /* @__PURE__ */ jsx5("span", { className: "grid size-10 shrink-0 place-items-center rounded-full bg-[var(--chalk-app-control)] text-[var(--chalk-app-text-muted)]", "aria-hidden": "true", children: /* @__PURE__ */ jsx5(Video01Icon, { className: "size-5" }) }),
-    /* @__PURE__ */ jsxs3("div", { className: "min-w-0 flex-1", children: [
-      /* @__PURE__ */ jsxs3("div", { className: "flex flex-wrap items-center gap-2", children: [
-        /* @__PURE__ */ jsxs3("span", { className: "truncate text-sm font-medium", children: [
-          "Episode ",
-          shortId(recording.episode_id)
-        ] }),
-        recording.export ? null : /* @__PURE__ */ jsx5(StatusBadge, { label: legacyStatusLabel(recording.status), tone: legacyStatusTone(recording.status), seed: `recording-status-${recording.id}` })
-      ] }),
-      /* @__PURE__ */ jsx5("p", { className: "mt-1 text-xs text-[var(--chalk-app-text-muted)]", children: /* @__PURE__ */ jsx5("time", { dateTime: recording.created_at, children: formatTimestamp(recording.created_at) }) }),
-      recording.export ? /* @__PURE__ */ jsx5(
-        RecordingArtifactStatus,
-        {
-          downloading,
-          onDownload,
-          onReadTranscript,
-          onRefreshExport,
-          onRequestExport,
-          onRequestTranscript,
-          onWatch,
-          readingTranscript,
-          recording,
-          refreshingExport,
-          requestingExport,
-          requestingTranscript
-        }
-      ) : /* @__PURE__ */ jsx5(LegacyRecordingActions, { downloading, onDownload, recording })
-    ] })
-  ] }) });
-}
-function RecordingArtifactStatus({ downloading, onDownload, onReadTranscript, onRefreshExport, onRequestExport, onRequestTranscript, onWatch, readingTranscript, recording, refreshingExport, requestingExport, requestingTranscript }) {
-  const video = recording.export;
-  if (!video) throw new Error("Recording export is required when rendering artifact status");
-  const transcriptStatus = recording.transcript?.status === "none" && recording.transcript.requestable ? "requestable" : recording.transcript?.status;
-  return /* @__PURE__ */ jsxs3("div", { className: "mt-3 grid gap-2 border-t border-[var(--chalk-app-line)] pt-3", children: [
-    recording.source ? /* @__PURE__ */ jsx5(ArtifactStatus, { icon: /* @__PURE__ */ jsx5(Video01Icon, { className: "size-4" }), label: "Capture", detail: sourceDetail(recording.source), status: sourceLabel(recording.source.status), tone: sourceTone(recording.source.status), seed: `capture-${recording.id}` }) : null,
-    transcriptStatus ? /* @__PURE__ */ jsx5(ArtifactStatus, { icon: /* @__PURE__ */ jsx5(FileTextIcon, { className: "size-4" }), label: "Transcript", detail: transcriptDetail(transcriptStatus), status: transcriptLabel(transcriptStatus), tone: transcriptTone(transcriptStatus), seed: `transcript-${recording.id}` }) : null,
-    recording.transcript ? /* @__PURE__ */ jsx5(TranscriptContent, { onReadTranscript, onRequestTranscript, reading: readingTranscript, recording, requestingTranscript }) : null,
-    /* @__PURE__ */ jsx5(ArtifactStatus, { icon: /* @__PURE__ */ jsx5(Video01Icon, { className: "size-4" }), label: "Video", detail: exportDetail(video), status: exportLabel(video.status), tone: exportTone(video.status), seed: `video-${recording.id}` }),
-    video.status === "ready" ? /* @__PURE__ */ jsx5(ReadyVideoActions, { downloading, onDownload, onWatch, recording }) : null,
-    video.status === "pending" ? /* @__PURE__ */ jsx5(PendingVideoActions, { onRefreshExport, recording, refreshingExport, requestingExport }) : null,
-    canRequestExport(video) ? /* @__PURE__ */ jsx5(RequestedVideoActions, { onRequestExport, recording, requestingExport }) : null
-  ] });
-}
-function TranscriptContent({ onReadTranscript, onRequestTranscript, reading, recording, requestingTranscript }) {
-  const transcript = recording.transcript;
-  if (!transcript) return null;
-  if ((transcript.status === "none" || transcript.status === "requestable") && transcript.requestable && onRequestTranscript) {
-    return /* @__PURE__ */ jsx5("div", { className: "pt-1", children: /* @__PURE__ */ jsxs3(ChalkButton, { "aria-label": `Request transcript ${shortId(recording.id)}`, disabled: requestingTranscript, loading: requestingTranscript, onClick: () => onRequestTranscript(recording), variant: "ghost", className: "shrink-0 px-3", children: [
-      /* @__PURE__ */ jsx5(FileTextIcon, { className: "size-4" }),
-      "Request transcript"
-    ] }) });
-  }
-  if (transcript.status !== "completed") return null;
-  if (transcript.text !== void 0) {
-    return /* @__PURE__ */ jsxs3("details", { className: "rounded border border-[var(--chalk-app-line)] p-2", children: [
-      /* @__PURE__ */ jsx5("summary", { className: "cursor-pointer text-xs font-medium", children: "Transcript" }),
-      /* @__PURE__ */ jsx5("p", { className: "mt-2 whitespace-pre-wrap text-xs leading-5 text-[var(--chalk-app-text-muted)]", children: transcript.text })
-    ] });
-  }
-  if (!onReadTranscript) return null;
-  return /* @__PURE__ */ jsx5("div", { className: "pt-1", children: /* @__PURE__ */ jsxs3(ChalkButton, { "aria-label": `Read transcript ${shortId(recording.id)}`, disabled: reading, loading: reading, onClick: () => onReadTranscript(recording), variant: "ghost", className: "shrink-0 px-3", children: [
-    /* @__PURE__ */ jsx5(FileTextIcon, { className: "size-4" }),
-    "Read transcript"
-  ] }) });
-}
-function ArtifactStatus({ detail, icon, label, seed, status, tone }) {
-  return /* @__PURE__ */ jsxs3("div", { className: "flex items-start gap-2 text-xs", children: [
-    /* @__PURE__ */ jsx5("span", { className: "mt-0.5 text-[var(--chalk-app-text-muted)]", "aria-hidden": "true", children: icon }),
-    /* @__PURE__ */ jsxs3("div", { className: "min-w-0 flex-1", children: [
-      /* @__PURE__ */ jsxs3("div", { className: "flex flex-wrap items-center gap-2", children: [
-        /* @__PURE__ */ jsx5("span", { className: "font-medium", children: label }),
-        /* @__PURE__ */ jsx5(StatusBadge, { label: status, tone, seed })
-      ] }),
-      /* @__PURE__ */ jsx5("p", { className: "mt-0.5 text-[var(--chalk-app-text-muted)]", children: detail })
-    ] })
-  ] });
-}
-function StatusBadge({ label, seed, tone }) {
-  return /* @__PURE__ */ jsx5(ChalkBadge, { tone, seed, children: label });
-}
-function ReadyVideoActions({ downloading, onDownload, onWatch, recording }) {
-  if (!onDownload && !onWatch) return null;
-  return /* @__PURE__ */ jsxs3("div", { className: "flex flex-wrap gap-2 pt-1", children: [
-    onWatch ? /* @__PURE__ */ jsxs3(ChalkButton, { "aria-label": `Watch recording ${shortId(recording.id)}`, onClick: () => onWatch(recording), variant: "ghost", className: "shrink-0 px-3", children: [
-      /* @__PURE__ */ jsx5(PlayIcon, { className: "size-4" }),
-      "Watch"
-    ] }) : null,
-    onDownload ? /* @__PURE__ */ jsxs3(ChalkButton, { "aria-label": `Download recording ${shortId(recording.id)}`, disabled: downloading, loading: downloading, onClick: () => onDownload(recording), variant: "ghost", className: "shrink-0 px-3", children: [
-      /* @__PURE__ */ jsx5(Download01Icon, { className: "size-4" }),
-      "Download"
-    ] }) : null
-  ] });
-}
-function PendingVideoActions({ onRefreshExport, recording, refreshingExport, requestingExport }) {
-  if (!onRefreshExport) return null;
-  return /* @__PURE__ */ jsx5("div", { className: "pt-1", children: /* @__PURE__ */ jsxs3(ChalkButton, { "aria-label": `Check video status ${shortId(recording.id)}`, disabled: refreshingExport || requestingExport, loading: refreshingExport || requestingExport, onClick: () => onRefreshExport(recording), variant: "ghost", className: "shrink-0 px-3", children: [
-    /* @__PURE__ */ jsx5(RefreshIcon, { className: "size-4" }),
-    "Check video status"
-  ] }) });
-}
-function RequestedVideoActions({ onRequestExport, recording, requestingExport }) {
-  if (!onRequestExport) return null;
-  if (recording.export?.status === "failed") {
-    return /* @__PURE__ */ jsx5("div", { className: "pt-1", children: /* @__PURE__ */ jsxs3(ChalkButton, { "aria-label": `Retry Export ${shortId(recording.id)}`, disabled: requestingExport, loading: requestingExport, onClick: () => onRequestExport(recording, "retry"), variant: "ghost", className: "shrink-0 px-3", children: [
-      /* @__PURE__ */ jsx5(RefreshIcon, { className: "size-4" }),
-      "Retry Export"
-    ] }) });
-  }
-  return /* @__PURE__ */ jsxs3("div", { className: "flex flex-wrap gap-2 pt-1", children: [
-    /* @__PURE__ */ jsxs3(ChalkButton, { "aria-label": `Watch recording ${shortId(recording.id)}`, disabled: requestingExport, loading: requestingExport, onClick: () => onRequestExport(recording, "watch"), variant: "ghost", className: "shrink-0 px-3", children: [
-      /* @__PURE__ */ jsx5(PlayIcon, { className: "size-4" }),
-      "Watch"
-    ] }),
-    /* @__PURE__ */ jsxs3(ChalkButton, { "aria-label": `Download recording ${shortId(recording.id)}`, disabled: requestingExport, loading: requestingExport, onClick: () => onRequestExport(recording, "download"), variant: "ghost", className: "shrink-0 px-3", children: [
-      /* @__PURE__ */ jsx5(Download01Icon, { className: "size-4" }),
-      "Download"
-    ] })
-  ] });
-}
-function LegacyRecordingActions({ downloading, onDownload, recording }) {
-  if (recording.status !== "completed" || !onDownload) return null;
-  return /* @__PURE__ */ jsx5("div", { className: "pt-3", children: /* @__PURE__ */ jsxs3(ChalkButton, { "aria-label": `Download recording ${shortId(recording.id)}`, disabled: downloading, loading: downloading, onClick: () => onDownload(recording), variant: "ghost", className: "shrink-0 px-3", children: [
-    /* @__PURE__ */ jsx5(Download01Icon, { className: "size-4" }),
-    /* @__PURE__ */ jsx5("span", { className: "hidden sm:inline", children: "Download" })
-  ] }) });
-}
-function canRequestExport(value) {
-  return value.status === "none" || value.status === "failed" && value.retryable;
-}
-function legacyStatusLabel(status) {
-  if (status === "pending") return "Pending";
-  if (status === "processing") return "Processing";
-  if (status === "completed") return "Ready";
-  return "Failed";
-}
-function legacyStatusTone(status) {
-  if (status === "pending") return "neutral";
-  if (status === "processing") return "accent";
-  if (status === "completed") return "success";
-  return "danger";
-}
-function sourceDetail(source) {
-  if (source.status === "available") return source.expires_at ? `Available until ${formatTimestamp(source.expires_at)}.` : "Available for transcript processing and a video request.";
-  if (source.status === "pending") return "Capture is still being stored.";
-  if (source.status === "failed") return "Capture failed. A transcript and video cannot be created.";
-  return "Capture is no longer available.";
-}
-function transcriptDetail(status) {
-  if (status === "none") return "Transcript was not enabled for this Episode.";
-  if (status === "requestable") return "Transcript can be requested from this Capture.";
-  if (status === "unavailable") return "Transcript cannot be requested from this Capture.";
-  if (status === "pending") return "Transcript is waiting to be prepared.";
-  if (status === "processing") return "Transcript is being prepared.";
-  if (status === "completed") return "Transcript is ready.";
-  return "Transcript could not be created.";
-}
-function exportDetail(value) {
-  if (value.status === "none") return "A video will be prepared when you watch or download.";
-  if (value.status === "pending") return "Video is being prepared.";
-  if (value.status === "ready") return "Video is ready to watch or download.";
-  if (value.status === "failed") return value.failure_message ?? "Video could not be prepared.";
-  return "Video cannot be created because the capture is unavailable.";
-}
-function sourceTone(status) {
-  if (status === "available") return "success";
-  if (status === "pending") return "accent";
-  return "danger";
-}
-function sourceLabel(status) {
-  if (status === "pending") return "Saving";
-  if (status === "available") return "Available";
-  if (status === "failed") return "Failed";
-  return "Expired";
-}
-function transcriptTone(status) {
-  if (status === "none" || status === "requestable") return "neutral";
-  if (status === "unavailable") return "danger";
-  if (status === "completed") return "success";
-  if (status === "failed") return "danger";
-  return "accent";
-}
-function transcriptLabel(status) {
-  if (status === "none") return "Not enabled";
-  if (status === "requestable") return "Can request";
-  if (status === "unavailable") return "Unavailable";
-  if (status === "pending") return "Waiting";
-  if (status === "processing") return "Preparing";
-  if (status === "completed") return "Ready";
-  return "Failed";
-}
-function exportTone(status) {
-  if (status === "ready") return "success";
-  if (status === "none") return "neutral";
-  if (status === "pending") return "accent";
-  return "danger";
-}
-function exportLabel(status) {
-  if (status === "none") return "Not requested";
-  if (status === "pending") return "Preparing";
-  if (status === "ready") return "Ready";
-  if (status === "failed") return "Failed";
-  return "Unavailable";
-}
-function shortId(value) {
-  return value.slice(0, 8);
-}
-function formatTimestamp(value) {
-  const date = new Date(value);
-  if (Number.isNaN(date.getTime())) return value;
-  const datePart = date.toISOString().slice(0, 10);
-  const timePart = date.toISOString().slice(11, 16);
-  return `${datePart} ${timePart} UTC`;
-}
-RecordingHistoryPanel.displayName = "RecordingHistoryPanel";
-
-// src/components/whiteboard-view/RecordingWhiteboardView.tsx
-import { fromWireElement } from "@q9labsai/chalk-whiteboard";
-import { useCallback as useCallback3, useEffect as useEffect5, useMemo as useMemo2, useState as useState5 } from "react";
-import { jsx as jsx6 } from "react/jsx-runtime";
-function RecordingWhiteboardView({ state: stateValue, files, expectedSceneId, expectedRevision, theme, excalidrawCssPath, onLoadError, onPresented, className }) {
-  const cursor = useMemo2(() => createRecordingWhiteboardCursor(stateValue), [stateValue]);
-  const state = useMemo2(() => cursor.at(expectedRevision), [cursor, expectedRevision]);
-  const elements = useMemo2(() => state.elements.map(fromWireElement), [state.elements]);
-  const resolvedTheme = theme ?? "light";
-  const [ready, setReady] = useState5(null);
-  const [presentedState, setPresentedState] = useState5(null);
-  const handleReady = useCallback3((api) => setReady(Object.freeze({ api, defaultViewBackgroundColor: api.getAppState().viewBackgroundColor })), []);
-  const requiredFileIds = recordingWhiteboardFileIds(state);
-  if (expectedSceneId !== void 0 && state.sceneId !== expectedSceneId) throw new TypeError("recording whiteboard scene does not match the presentation frame");
-  if (expectedRevision !== void 0 && state.revision !== expectedRevision) throw new TypeError("recording whiteboard revision does not match the presentation frame");
-  for (const fileId of requiredFileIds) {
-    if (!Object.hasOwn(files ?? {}, fileId)) throw new TypeError(`recording whiteboard file is missing: ${recordingWhiteboardFileAssetId(fileId)}`);
-  }
-  useEffect5(() => {
-    if (!ready) return;
-    setPresentedState(null);
-    const installScene = () => {
-      if (files) ready.api.addFiles(Object.values(files));
-      ready.api.updateScene({ elements, appState: recordingWhiteboardSceneAppState(state, ready.defaultViewBackgroundColor), captureUpdate: "NEVER" });
-    };
-    installScene();
-    const visibleElements = elements.filter((element) => !element.isDeleted);
-    let presentedFrameRef;
-    const reconcileFrame = requestAnimationFrame(() => {
-      installScene();
-      if (visibleElements.length > 0) ready.api.scrollToContent(visibleElements, { fitToContent: true, animate: false, viewportZoomFactor: 0.9 });
-      const presentedFrame = requestAnimationFrame(() => setPresentedState(state));
-      presentedFrameRef = presentedFrame;
-    });
-    return () => {
-      cancelAnimationFrame(reconcileFrame);
-      if (presentedFrameRef !== void 0) cancelAnimationFrame(presentedFrameRef);
-    };
-  }, [elements, files, ready, state]);
-  useEffect5(() => {
-    if (presentedState !== state || onPresented === void 0) return;
-    onPresented(state);
-  }, [onPresented, presentedState, state]);
-  return /* @__PURE__ */ jsx6(WhiteboardView, { canDraw: false, className: cn("h-full w-full !min-h-0 !border-0", className), excalidrawCssPath, onExcalidrawApiReady: handleReady, onLoadError, theme: resolvedTheme });
-}
-RecordingWhiteboardView.displayName = "RecordingWhiteboardView";
-
-export {
-  Entrance,
-  FeedbackDialog,
-  Chalk,
-  RecordingSpaceView,
-  RecordingHistoryPanel,
-  RecordingWhiteboardView
-};