@q9labsai/chalk-react 5.0.1 → 5.2.0

package/CHANGELOG.md

@@ -0,0 +1,186 @@
+# Changelog
+
+## 5.2.0
+
+### board-draw-policy
+
+Add a call-wide drawing policy for the board: everyone, only hosts, or picked people.
+Hosts set it with `setDrawPolicy` on the whiteboard transport and pick people with the
+existing `setDrawPermission`. Sync computes each person's permission and sends it with
+the policy over the new `draw_policy_v1` extension, so the summary and
+`useWhiteboard().access` now carry `canDraw`, `drawPolicy` and the host's per-person
+choices. The React board follows that permission instead of the role capability, and
+hosts get a "Who can draw" section with a person picker in the board menu.
+
+The whiteboard client now steps its hello down only when Sync can't decode it (close
+1009). A rejected token or a late hello (close 1008) is retried at the same level up to
+four times, so a brief token problem no longer hides the drawing policy for the rest of
+the connection. On a Sync without the drawing policy, a host's waiting policy change is
+refused as `unavailable`, and also reported on the summary, instead of being replayed.
+
+### board-frame-clock
+
+Keep Follow active when Bring everyone moves to a wider board view, without a brief zoom overshoot at the start of the animation.
+
+### board-stage-motion
+
+Keep the live whiteboard free of stage translation and scaling animations so
+switching between a participant and the board preserves the full canvas and
+accurate drawing coordinates. Other stage tiles keep their existing motion.
+
+### brand-single-chalk-mark
+
+Replace the retired colourful four-stick logo with the monochrome single chalk stick and dust in the distributed SVG assets and React Logo variants. Preserve existing asset filenames and component props. The React Logo now takes its default colour from the surrounding text colour.
+
+### follow-view-owner
+
+Converge Follow views on one Episode owner, recover from its canonical snapshot,
+and preserve real camera moves during recovery and tab switches. Zoom controls
+and keyboard moves now consistently leave Follow and lead the person's view.
+
+Keep all 500 active people's views using internal schema-generated limits in the client and React caches. The client's public bounds, event unions and decoded-frame unions are unchanged. The client now exports `ChalkWhiteboardViewVersions`, which the React SDK uses to order view moves, and whiteboard view events now carry `ownerId`, `ownerSequence` and `originEpoch`, so both releases are minor.
+
+### phone-board-notices-next-release
+
+Float faces over a phone board, and keep call notices off the call's controls.
+On a phone, an open board now fills the stage and up to three faces float at
+its right edge, with short name tags. Notices sit between the header and the
+controls under them. A call shorter than 620px, such as a landscape phone or a
+short embedded call, puts every notice in a notice button in the header, which
+lists each one whole and announces it once to screen readers; a taller call
+shows the newest three and puts older ones in the button. A notice in the
+button starts its timer only once it shows. The header stays visible while
+the button holds notices. Long names, links and error tokens wrap inside
+their notice, and a long call name shortens to make room for the timer and
+the notice button. A screen share beside a short board always keeps its own
+tile when there is no explicit cap. A capped strip or floating column counts
+shared content and its overflow button against that cap; folded shares stay
+readable in the shared-content overflow. One text-only announcer handles
+notice speech independently of its stage or header presentation.
+
+New optional props: `ToastStackProps.onFold` reports the ids of the notices
+the stage has no room for, `ChalkToastProps.announce` lets a host that already
+announced a notice keep its toast quiet, and `SpaceHeaderProps.notices` places
+a control before the people button.
+
+### problem-reporting
+
+Add the problem-report API contract and reusable report dialog, with opt-in diagnostics,
+editable delivery failures and bounded Unicode input. Call details and failed or ended
+call screens can expose reporting when an integration supplies a delivery callback.
+Use `reportUnavailableReason` to show expired access inside an editable report.
+Live report drafts survive call termination. Integrations with their own terminal
+screens can use `onOpenReportProblem` to keep one app-owned dialog across those screens.
+Give `ReportProblemDialog` a `focusScope` containing the current call or terminal screen,
+so closing it returns focus to its usable opener, or to a visible current control
+when the opener has disappeared. Hidden, inert and disabled targets are skipped.
+
+### recording-auto-render
+
+Expose recording expiry reasons through additive failure fields while preserving the existing export status enum.
+
+Add the Tenant recording_render_mode setting, defaulting to on_demand, with opt-in automatic MP4 rendering.
+
+### safe-media-command-guidance
+
+Show safe, source-aware guidance for media command failures across call controls,
+keyboard shortcuts, screen sharing, and media request dialogs. Preserve the
+existing onCommandError MediaSource argument and provide extended media context
+in an optional third argument. Keep disable-failure wording neutral and explain
+unsupported speaker selection without suggesting a retry. Preserve start/stop
+intent in failure guidance and retries; show terminal guidance for withdrawn
+media requests and other non-recoverable failures.
+
+Distinguish device selection, speaker tests, and incoming requests in media error
+guidance. Cover every client failure code with an operation-aware policy and only
+offer retry when the exact failed media command can be replayed.
+
+Preserve request context in the integrated Chalk dialog and show safe terminal
+guidance without retry for unknown runtime failure codes.
+
+### sync-connect-diagnostics
+
+Report Sync connection failures with the existing `connection.sync_hello_timeout` code without adding values to the public `ErrorCode` union. Add the current attempt's safe diagnostics to client errors, telemetry, and the call failure reference: opening/hello stage, close code and bounded reason, whether the socket opened, and elapsed time. Earlier attempts remain in the diagnostic history. Browsers do not expose DNS, TCP, or TLS progress. Unrecognized peer reasons are redacted. This is a compatible patch for the next client and React releases; released 5.1.0 files are unchanged.
+
+## 5.1.0
+
+- Add optional `CallLimbo.className` for the message card, so a host can size the card around a form.
+- Route private camera previews through the SDK so granting permission refreshes the camera menu. Standalone `DevicePopover` and `ControlBarSurface` consumers can supply `captureCameraPreview`.
+- Preview the chosen camera privately when the call camera is off; while it is active, preview the published call track rather than an unpublished device selection.
+- Keep keyboard-shortcut dialog content fixed while opening and closing. Report a problem remains unchanged and appears only when a host supplies `onReportProblem`.
+- Add optional `ChalkMenu.onOpenChange` for hosts that need to coordinate menu and dialog visibility.
+- Show stage-specific failed-entry guidance with a public error-code reference. Keep recoverable device capture warnings in the live call.
+- The call board now shows Chalk's own controls instead of the stock Excalidraw ones, with Follow and Bring everyone. `Stage` adds optional `followingId`, `onFollowChange` and `clickAction` (`"pin"` or `"follow"`); `SpaceStage` adds `colorScheme` and `onCloseBoard`; `SpaceView` shares and follows board views through the client's `sendView`.
+- Keep Follow, Clear and Undo on the board scene where they started, so a scene change cannot restore or follow into another scene. Redo brings back undone text, and small drawings open at 100% zoom at most.
+- Label screen shares of unknown surfaces plainly instead of guessing what is being shared.
+- Lift call notices clear of an open reaction tray, so the tray and the notices stay readable together.
+- Keep chat messages still while the clock ticks instead of re-rendering and jumping the scroll position.
+- Show recovery notices without blocking the call, keep chat readable, and disable reaction sending and media enable controls until Sync is live. Local mute, private camera preview, device menus, and hand controls stay available.
+- Omit the reference when the host has no known error code instead of inventing an internal-error reference.
+
+## 5.0.0
+
+- Keep chat history available to observers and custom read-only roles; gate the composer, attachments, and message reactions on `sendChat`.
+- Use `endEpisode` authority for Host badges and host-transfer notices, including `owner` and custom roles. Add `ParticipantListParticipant.isHost` for presentation-only lists.
+- Play a short, quiet synthesized reaction sound while Sounds is enabled.
+- Restore local ownership, capture details, and Stop/Change actions in the connected `ScreenShareView`.
+- Avoid stopping already-ended screen capture tracks again when publication fails.
+- Remove the unused `ToastStack.position` prop; call toasts use the responsive position defined by the call layout.
+
+- Remove `LeaveDialog`, `PreviewEpisodeEnded`, and `PreviewStatus` from the `/preview` entry point.
+- Change `ControlBar.onCommandError` from a message string callback to `(failure: ClientFailure | null, source?: MediaSource) => void`.
+- Require `ChalkMenu.trigger` and `ChalkMenu.children`; remove its forwarded div ref, `tone`, and inherited HTML attributes other than `className`.
+- Require `ChalkMenuItem.children`; remove its forwarded div ref, `tone`, and inherited HTML attributes. Its `onClick` callback no longer receives a DOM event.
+- Remove `ToastStack.participantColorSeed` and `participantGradientPreference`; make its `toasts` array and `Toast` fields readonly, and widen `Toast.message` from `string` to `ReactNode`.
+- Remove `ScreenShareView.onStopShare`; `ScreenShareViewProps` now contains only `className`.
+- Remove `features.settings`, `settingsDialog`, and `onOpenSettings` from the call view contracts, and remove `"settings"` from the `/preview` `SpacePanel` type.
+- Remove the props types for `ChalkCheckbox`, `ChalkControlGroup`, `ChalkRadio`, `ChalkSelect`, `ChalkSlider`, and `ChalkTooltipPanel` along with their components.
+- Require `primary` in the render contexts passed to `Stage.renderParticipant` and `Stage.renderContentTile`.
+- Require the new `ChalkThemeTokens` fields: `raised`, `hover`, `pressed`, `lineStrong`, `dangerHover`, `dangerPressed`, `dangerText`, `warning`, `tile`, `popover`, `textStrong`, `softText`, `wash`, `washStrong`, `overlay`, `overlayStrong`, `overlayHover`, `onOverlay`, `overlayWarning`, `overlayDanger`, and `scrim`. `ChalkTheme.tokens` remains partial.
+- Replace the `/ui` `DEFAULT_QUICK_REACTIONS` tuple's final `😢`, `🎉` entries with `🎉`, `👏`; update consumers of its inferred literal types.
+- Add `"reactToMessage"` to `/preview` `PreviewClientCommand`; exhaustive command handlers must handle the new variant.
+- Persist the local self-view mirror preference across reloads and share it between camera previews and local participant tiles. Add controlled `ControlBar.mirrored` / `onMirrorChange` props; `ParticipantTile.mirror` still overrides the preference. Photo viewer downloads now save the original filename without opening a tab, while previews remain inline.
+
+- Replace stage paging with justified Grid rows and a +N People tile; make shared screens double-width and Spotlight content-aware. Add participant hand-order, share-audio, share-aspect and share-state presentation fields. Preserve keyed video elements through 220 ms transform-only layout moves and add the two-person phone picture-in-picture.
+- Unify screen and person tile chrome; show speaking rings, bold Facehash avatars, weak signal bars, local share previews and share controls. `Stage` accepts `onOverflowClick`, and content render contexts identify the primary tile.
+
+- Replace phone device choices with Flip camera when two or more cameras are available; audio stays with the operating system.
+
+- Make the desktop layout control a direct Spotlight/Grid toggle. Let `ChalkMenuItem.closeOnClick` keep device choices open, and `ChalkSheet.accessibleLabel` retain a stable accessible name while showing the call name.
+
+- Add call-link QR sharing, diagnostics copy, keyboard shortcuts, and optional `Chalk`/`SpaceView` `shareUrl` and `onReportProblem` callbacks. Rebuild the call dock with device and screen-source split controls, tab-audio capture, and phone More actions.
+- Add optional diagnostics, people, connection-warning and shortcut inputs to `SpaceHeader`; `ChalkPopover.tooltip` composes a tooltip with its trigger. Call reaction pickers accept raised-hand state and its action.
+- Rebuild the call card with People and Chat tabs, message reactions, attachment previews and a dark photo viewer.
+- Unify call status pages, add optional report/terminal-state integration, a share-ready card, recorded joining consent and accessible call-event toasts.
+
+- Publish and play shared tab audio separately from microphones, with share-audio state and coupled screen-share lifecycle.
+
+- Keep layout changes interactive when `layout` is supplied without `onLayoutChange`; the prop initializes local state in that case. A paired prop and handler remain controlled. Add Spotlight/Grid to the phone dock's More sheet.
+
+- Default calls to Dark; `ChalkColorScheme` is now `"light" | "dark"`. Add `Chalk.onColorSchemeChange` and `SpaceView.onColorSchemeChange` for controlled appearance.
+- Replace the call theme tokens with role-based mockup palettes, and share the inset-card frame with recordings.
+- Rebuild call buttons, menus, popovers, tooltips, switches, segmented controls, copy feedback, focus-trapped sheets and toasts. Remove the unused `ChalkCheckbox`, `ChalkControlGroup`, `ChalkRadio`, `ChalkSelect`, `ChalkSlider`, and `ChalkTooltipPanel` exports. `ChalkMenu` now accepts a trigger; its items accept checked state.
+- Add `captureFlip` for transform-only, reduced-motion-aware moves that preserve the mounted element.
+- Use synthesized call sounds with a persistent Sounds switch; remove the unused Sonner `toast` re-export from the toast stack.
+
+- Expose per-message reactions, count, participant IDs, `isMine`, and `react(input)` from `useChat()`; export the shared 24-emoji set and reaction types.
+
+- Add `useScreenShare()` and screen source hint/capture types, without changing UI.
+
+- Remove unused icon wrappers: `ArrowLeft02Icon`, `ArrowUp01Icon`, `Calendar01Icon`, `Mail01Icon`, `PictureInPictureIcon`, `ZoomInIcon`, `ZoomOutIcon`, `Link01Icon`, `MoreHorizontalIcon`, `Settings01Icon`, `SparklesIcon`, `UserAdd01Icon`.
+
+- Fold Classic implementations into plain component names; remove Classic-prefixed modules and symbols.
+- Remove SettingsDialog, SettingsPanel, DeviceSelector, NoiseSuppressionToggle, and their props, types, and lazy exports.
+- Remove SpaceInfoDialog, its opener, `features.info`, `infoDialog`, and `spaceDescription`.
+- Remove the header Invite button, InviteDialog, and `inviteDialog` / `inviteLink` props.
+- Remove React Entrance, its types and preview fixture, and the `entrance` prop; Chalk joins directly through CallLimbo.
+- Remove the header logo and `logoUrl` from Chalk, SpaceView, and SpaceHeader.
+- Remove the unused dock `position`, `placement`, `showLabels`, and `duration` props.
+- Remove the inline dock layout and unused PiP, More, settings, info, transcription, and thumbs-up control values and callbacks.
+- Remove screen-share thumbnails, zoom, and rotation, including `showThumbnails`, `thumbnailPosition`, and `enableZoom`.
+- Remove the unreachable TranscriptPanel drawer, behavior, lazy exports, and `SpacePanel` transcript value.
+- Remove unused CaptionLine, TranscriptLine, ConnectionQuality, TourTooltip, TourHighlight, WhatsNewTrigger, and ReleaseBadge atoms and their props.
+- Remove the offline-actions decision dialog and stored policy setting; queued actions send automatically on reconnection.
+
+- Add shared call limbo for joining and reconnection. Connection recovery now blurs the call after a two-second grace instead of escalating to a modal.
+- Remove the `presentation` layout. Spotlight prioritizes shared content; Grid preserves the selected layout and renders the real board.

package/dist/bindings/context.d.ts

@@ -6,4 +6,3 @@ export type ChalkProviderProps = PropsWithChildren<{
     readonly client: SpaceClient;
 }>;
 export declare function ChalkProvider({ children, client }: ChalkProviderProps): React.JSX.Element;
-//# sourceMappingURL=context.d.ts.map

package/dist/bindings/hooks.d.ts

@@ -21,6 +21,8 @@ export declare function useReactions(): ReactionsSlice;
 export declare function useRecording(): RecordingSlice;
 export declare function useWhiteboard(): WhiteboardSlice;
 export declare function useCan(capability: Capability): boolean;
+/** Whether this person can draw on the board. Sync decides from the call's policy, their role and the host's choice for them; until the board subscription is live, the role default stands in. A Sync without the drawing policy doesn't report role changes to the board, so there the live role still limits drawing. */
+export declare function useCanDrawWhiteboard(): boolean;
 /** Local capture state and the action that opens the browser's share picker. */
 export declare function useScreenShare(): {
     source: import("@q9labsai/chalk-client").MediaSource;
@@ -30,4 +32,3 @@ export declare function useScreenShare(): {
     capture?: import("@q9labsai/chalk-client").ScreenShareCapture;
     setEnabled: (enabled: boolean, options?: import("@q9labsai/chalk-client").ScreenShareOptions | undefined) => Promise<void>;
 };
-//# sourceMappingURL=hooks.d.ts.map

package/dist/{chunk-NPOO7BOX.js → chunk-CYC2G42K.js}

@@ -28,17 +28,19 @@ import {
   StatusSurface,
   WhiteboardView,
   chalkThemeStyle,
+  commandFailure,
   useCan,
+  useCanDrawWhiteboard,
   useConnection,
   useMedia,
   useRecording,
   useSpaceClient,
   useWhiteboard
-} from "./chunk-XN2E352E.js";
+} from "./chunk-G62BKRNX.js";
 import {
   WHITEBOARD_ITEM_ID,
   screenShareItemId
-} from "./chunk-WRAEH24P.js";
+} from "./chunk-HWQLW4JR.js";
 import {
   Download01Icon,
   FileTextIcon,
@@ -208,10 +210,10 @@ function Chalk(props) {
     props.onColorSchemeChange?.(next);
   };
   const [reportOpen, setReportOpen] = useState2(false);
-  const reportTrigger = useRef(null);
-  const openReport = props.onReportProblem ? () => {
-    reportTrigger.current = document.activeElement instanceof HTMLButtonElement ? document.activeElement : null;
-    setReportOpen(true);
+  const container = useRef(null);
+  const openReport = props.onReportProblem && !props.reportUnavailableReason ? () => {
+    if (props.onOpenReportProblem) props.onOpenReportProblem();
+    else setReportOpen(true);
   } : void 0;
   const suppliedClient = props.client;
   const getAccessRef = useRef(props.getAccess);
@@ -233,12 +235,23 @@ function Chalk(props) {
       void ownedClient.leave().catch(() => void 0).finally(() => ownedClient.dispose());
     };
   }, [ownedClient]);
-  return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx("div", { "data-chalk": true, "data-chalk-theme": colorScheme, className: "chalk-root h-full min-h-0 w-full", style: chalkThemeStyle(props.theme, colorScheme), children: /* @__PURE__ */ jsxs(ChalkProvider, { client, children: [
+  return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx("div", { ref: container, "data-chalk": true, "data-chalk-theme": colorScheme, className: "chalk-root h-full min-h-0 w-full", style: chalkThemeStyle(props.theme, colorScheme), children: /* @__PURE__ */ jsxs(ChalkProvider, { client, children: [
     /* @__PURE__ */ jsx(SpaceExperience, { ...props, theme: { ...props.theme, colorScheme }, onColorSchemeChange: changeColorScheme, resolvedColorScheme: colorScheme, onOpenReport: openReport }),
-    props.onReportProblem ? /* @__PURE__ */ jsxs(Fragment, { children: [
+    props.onReportProblem && !props.onOpenReportProblem ? /* @__PURE__ */ jsxs(Fragment, { children: [
       /* @__PURE__ */ jsx(ShellStyles, {}),
-      /* @__PURE__ */ jsx(CallDialog, { kind: reportOpen ? "report" : null, onClose: () => setReportOpen(false), onReportProblem: props.onReportProblem, diagnostics: `Call: ${props.spaceName ?? props.space ?? "Call"}
-Status: ${client.getSnapshot().connection.status}`, returnFocus: reportTrigger })
+      /* @__PURE__ */ jsx(
+        CallDialog,
+        {
+          kind: "report",
+          open: reportOpen,
+          onClose: () => setReportOpen(false),
+          onReportProblem: props.onReportProblem,
+          unavailableReason: props.reportUnavailableReason,
+          diagnostics: `Call: ${props.spaceName ?? props.space ?? "Call"}
+Status: ${client.getSnapshot().connection.status}`,
+          focusScope: container
+        }
+      )
     ] }) : null
   ] }) }) });
 }
@@ -312,10 +325,21 @@ function SpaceExperience(props) {
   if (connection.status === "joining") return /* @__PURE__ */ jsx(CallLimbo, { theme: { ...props.theme, colorScheme: props.resolvedColorScheme }, recorded, spaceName, message: `Joining ${spaceName}\u2026` });
   if (connection.status === "failed" && connection.lastError?.code === "episode.ended") return /* @__PURE__ */ jsx(StatusSurface, { phase: "episode-ended", callName, theme: statusTheme, onHome: props.onHome, onReportProblem: props.onOpenReport });
   if (connection.status === "failed") {
-    return /* @__PURE__ */ jsx(StatusSurface, { phase: "failed", callName, theme: statusTheme, onHome: props.onHome, onReportProblem: props.onOpenReport, onRetry: retryAutomaticJoin, retryPending });
+    return /* @__PURE__ */ jsx(StatusSurface, { phase: "failed", callName, errorCode: connection.lastError?.code, sync: connection.lastError?.sync, theme: statusTheme, onHome: props.onHome, onReportProblem: props.onOpenReport, onRetry: retryAutomaticJoin, retryPending });
   }
   if (connection.status === "leaving" || connection.status === "left")
-    return /* @__PURE__ */ jsx(StatusSurface, { phase: episodeEnded ? "episode-ended" : "left", callName, theme: statusTheme, onReportProblem: props.onOpenReport, onRejoin: props.onRejoin ?? retryAutomaticJoin, rejoinDisabled: connection.status === "leaving" || retryPending, onHome: props.onHome });
+    return /* @__PURE__ */ jsx(
+      StatusSurface,
+      {
+        phase: episodeEnded ? "episode-ended" : "left",
+        callName,
+        theme: statusTheme,
+        onReportProblem: connection.status === "leaving" ? void 0 : props.onOpenReport,
+        onRejoin: props.onRejoin ?? retryAutomaticJoin,
+        rejoinDisabled: connection.status === "leaving" || retryPending,
+        onHome: props.onHome
+      }
+    );
   return /* @__PURE__ */ jsxs("div", { className: "relative h-full min-h-0", children: [
     /* @__PURE__ */ jsx(SpaceSurface, { ...props, spaceName }),
     /* @__PURE__ */ jsx(CallLimbo, { overlay: true, active: false, initiallyCovered: true, message: "" })
@@ -327,14 +351,20 @@ function SpaceSurface(props) {
   const media = useMedia();
   const whiteboardState = useWhiteboard();
   const canEndEpisode = useCan("endEpisode");
-  const canDrawWhiteboard = useCan("drawWhiteboard");
-  const [commandError, setCommandError] = useState2(() => connection.lastError?.recoverable && connection.lastError.code.startsWith("media.") ? connection.lastError.message : null);
-  const runCommand = useCallback(async (command) => {
+  const canDrawWhiteboard = useCanDrawWhiteboard();
+  const [commandError, setCommandError] = useState2(() => connection.lastError?.recoverable && connection.lastError.code.startsWith("media.") ? connection.lastError : null);
+  const [commandSource, setCommandSource] = useState2();
+  const [commandAction, setCommandAction] = useState2();
+  const runCommand = useCallback(async (command, source, action) => {
     try {
       await command();
       setCommandError(null);
+      setCommandSource(void 0);
+      setCommandAction(void 0);
     } catch (cause) {
-      setCommandError(cause instanceof Error ? cause.message : "This command could not be completed.");
+      setCommandError(commandFailure(cause));
+      setCommandSource(source);
+      setCommandAction(action);
     }
   }, []);
   const whiteboardTransport = client.whiteboard.transport();
@@ -362,7 +392,8 @@ function SpaceSurface(props) {
         clear: () => whiteboardSubscription.transport.clear(),
         presignDownload: (fileId) => whiteboardSubscription.transport.files.getDownloadUrl(fileId)
       }
-    }
+    },
+    sendView: whiteboardSubscription.transport.supportsViews ?? Boolean(whiteboardSubscription.transport.sendView) ? (view) => whiteboardSubscription.transport.sendView?.(view) ?? false : void 0
   } : void 0;
   return /* @__PURE__ */ jsx(
     SpaceView,
@@ -370,11 +401,15 @@ function SpaceSurface(props) {
       colorScheme: props.resolvedColorScheme,
       shareUrl: props.shareUrl,
       onReportProblem: props.onReportProblem,
+      onOpenReportProblem: props.onOpenReport,
+      reportUnavailableReason: props.reportUnavailableReason,
       onColorSchemeChange: props.onColorSchemeChange,
       spaceName: props.spaceName,
       inviteLink: props.inviteLink,
       pickChatFiles: props.pickChatFiles,
       commandError: commandError ?? void 0,
+      commandSource,
+      commandAction,
       onDismissCommandError: () => setCommandError(null),
       layout: props.layout,
       onLayoutChange: props.onLayoutChange,
@@ -384,7 +419,14 @@ function SpaceSurface(props) {
       onLeft: () => runCommand(() => client.leave()),
       onEndEpisode: canEndEpisode ? () => runCommand(() => client.endEpisode()) : void 0,
       reconnecting: { isVisible: connection.status === "reconnecting", status: "reconnecting", showNotice: false },
-      overlay: /* @__PURE__ */ jsx(Fragment, { children: media.incomingRequests[0] ? /* @__PURE__ */ jsx(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 })
+      overlay: /* @__PURE__ */ jsx(Fragment, { children: media.incomingRequests[0] ? /* @__PURE__ */ jsx(
+        MediaRequestDialog,
+        {
+          request: media.incomingRequests[0],
+          onDecline: () => void runCommand(() => client.media.declineRequest(media.incomingRequests[0].requestId), media.incomingRequests[0].kind === "start_camera" ? "camera" : "microphone", "request"),
+          onAllow: () => void runCommand(() => client.media.acceptRequest(media.incomingRequests[0].requestId), media.incomingRequests[0].kind === "start_camera" ? "camera" : "microphone", "request")
+        }
+      ) : null })
     }
   );
 }
@@ -890,19 +932,13 @@ function RecordingWhiteboardView({ state: stateValue, files, expectedSceneId, ex
 RecordingWhiteboardView.displayName = "RecordingWhiteboardView";
 
 // src/components/logo/Logo.tsx
-import { useId } from "react";
 import { jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
-var DEFAULT_COLOR = "#1A332B";
+var DEFAULT_COLOR = "currentColor";
 var DEFAULT_HEIGHT = 32;
 var DEFAULT_VARIANT = "wordmark";
 var WORDMARK_VIEW_BOX = "0 0 200 80";
 var MARK_VIEW_BOX = "0 0 68 80";
-function gradientId(prefix, name) {
-  return `${prefix}-${name}`;
-}
 function Logo({ accessibilityLabel = "Chalk", color = DEFAULT_COLOR, height = DEFAULT_HEIGHT, variant = DEFAULT_VARIANT }) {
-  const generatedId = useId().replace(/[^a-zA-Z0-9_-]/gu, "");
-  const idPrefix = `chalk-logo-${generatedId}`;
   const isWordmark = variant === "wordmark";
   const viewBox = isWordmark ? WORDMARK_VIEW_BOX : MARK_VIEW_BOX;
   const width = isWordmark ? height * 2.5 : height * (68 / 80);
@@ -923,41 +959,14 @@ function Logo({ accessibilityLabel = "Chalk", color = DEFAULT_COLOR, height = DE
       xmlns: "http://www.w3.org/2000/svg",
       fill: "none",
       children: [
-        /* @__PURE__ */ jsxs3("defs", { children: [
-          /* @__PURE__ */ jsxs3("linearGradient", { id: gradientId(idPrefix, "green"), x1: "0%", y1: "0%", x2: "100%", y2: "0%", children: [
-            /* @__PURE__ */ jsx5("stop", { offset: "0%", stopColor: "#C5E5C0" }),
-            /* @__PURE__ */ jsx5("stop", { offset: "100%", stopColor: "#80B879" })
+        /* @__PURE__ */ jsxs3("svg", { x: "0", y: "6", width: "68", height: "68", viewBox: "0 0 48 48", children: [
+          /* @__PURE__ */ jsxs3("g", { transform: "rotate(28 24 24)", fill: "currentColor", children: [
+            /* @__PURE__ */ jsx5("path", { d: "M18 8h12v28a6 6 0 0 1-12 0z" }),
+            /* @__PURE__ */ jsx5("path", { d: "M18 8h12l-1.5 4.5h-9z", opacity: "0.45" })
           ] }),
-          /* @__PURE__ */ jsxs3("linearGradient", { id: gradientId(idPrefix, "yellow"), x1: "0%", y1: "0%", x2: "100%", y2: "0%", children: [
-            /* @__PURE__ */ jsx5("stop", { offset: "0%", stopColor: "#FCEAB3" }),
-            /* @__PURE__ */ jsx5("stop", { offset: "100%", stopColor: "#D9B641" })
-          ] }),
-          /* @__PURE__ */ jsxs3("linearGradient", { id: gradientId(idPrefix, "blue"), x1: "0%", y1: "0%", x2: "100%", y2: "0%", children: [
-            /* @__PURE__ */ jsx5("stop", { offset: "0%", stopColor: "#B2E0F0" }),
-            /* @__PURE__ */ jsx5("stop", { offset: "100%", stopColor: "#55AAC9" })
-          ] }),
-          /* @__PURE__ */ jsxs3("linearGradient", { id: gradientId(idPrefix, "pink"), x1: "0%", y1: "0%", x2: "100%", y2: "0%", children: [
-            /* @__PURE__ */ jsx5("stop", { offset: "0%", stopColor: "#F8CACA" }),
-            /* @__PURE__ */ jsx5("stop", { offset: "100%", stopColor: "#D67B7B" })
-          ] })
-        ] }),
-        /* @__PURE__ */ jsxs3("g", { transform: "translate(2, 2) scale(0.95)", children: [
-          /* @__PURE__ */ jsx5("g", { className: "chalk-logo__stick chalk-logo__stick--green", children: /* @__PURE__ */ jsxs3("g", { transform: "rotate(-15 20 60)", children: [
-            /* @__PURE__ */ jsx5("path", { d: "M9,20 L21,20 L22,63 A7,7 0 0 1 8,63 Z", fill: `url(#${gradientId(idPrefix, "green")})` }),
-            /* @__PURE__ */ jsx5("ellipse", { cx: "15", cy: "20", rx: "6", ry: "2.5", fill: "#D8ECD4" })
-          ] }) }),
-          /* @__PURE__ */ jsx5("g", { className: "chalk-logo__stick chalk-logo__stick--yellow", children: /* @__PURE__ */ jsxs3("g", { transform: "rotate(-8 32 55)", children: [
-            /* @__PURE__ */ jsx5("path", { d: "M23,15 L35,15 L36,60 A7,7 0 0 1 22,60 Z", fill: `url(#${gradientId(idPrefix, "yellow")})` }),
-            /* @__PURE__ */ jsx5("ellipse", { cx: "29", cy: "15", rx: "6", ry: "2.5", fill: "#FEF3D1" })
-          ] }) }),
-          /* @__PURE__ */ jsx5("g", { className: "chalk-logo__stick chalk-logo__stick--blue", children: /* @__PURE__ */ jsxs3("g", { transform: "rotate(12 60 30)", children: [
-            /* @__PURE__ */ jsx5("path", { d: "M36,8 L48,8 L49,56 A7,7 0 0 1 35,56 Z", fill: `url(#${gradientId(idPrefix, "blue")})` }),
-            /* @__PURE__ */ jsx5("ellipse", { cx: "42", cy: "8", rx: "6", ry: "2.5", fill: "#D0EDF8" })
-          ] }) }),
-          /* @__PURE__ */ jsx5("g", { className: "chalk-logo__stick chalk-logo__stick--pink", children: /* @__PURE__ */ jsxs3("g", { transform: "rotate(5 55 50)", children: [
-            /* @__PURE__ */ jsx5("path", { d: "M49,70 L61,70 L62,29 A7,7 0 0 0 48,29 Z", fill: `url(#${gradientId(idPrefix, "pink")})` }),
-            /* @__PURE__ */ jsx5("ellipse", { cx: "55", cy: "70", rx: "6", ry: "2.5", fill: "#FBE4E4" })
-          ] }) })
+          /* @__PURE__ */ jsx5("circle", { cx: "10.5", cy: "41.5", r: "1.7", fill: "currentColor", opacity: "0.55" }),
+          /* @__PURE__ */ jsx5("circle", { cx: "6.5", cy: "37", r: "1.2", fill: "currentColor", opacity: "0.4" }),
+          /* @__PURE__ */ jsx5("circle", { cx: "4", cy: "43.5", r: "0.85", fill: "currentColor", opacity: "0.28" })
         ] }),
         isWordmark ? /* @__PURE__ */ jsx5("text", { className: "chalk-logo__wordmark", x: "90", y: "52", fontFamily: "system-ui, -apple-system, BlinkMacSystemFont, sans-serif", fontSize: "38", fontWeight: "600", letterSpacing: "-0.02em", fill: "currentColor", children: "chalk" }) : null
       ]