feat: screenshare fullscreen button + pip spotlight, fix screenshare view

- Remove revert-to-grid logic that was overriding EC's natural screenshare
  spotlight, causing fullscreen to show user avatars instead of the screen
- Add fullscreen button to call controls (visible when screensharing) that
  requests fullscreen on the call embed container
- Add FullscreenButton component with enter/exit SVG icons to Controls.tsx
- PIP mode: sync setPipMode to CallControl; auto-enable spotlight when
  screenshare is active in pip so the screenshare fills the window
- Make useCallControlState accept undefined control for safe use in
  CallEmbedProvider
- Add package-lock.json to .gitignore (generated by local npm install)

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-05-24 23:16:43 -04:00
co-authored by Claude Sonnet 4.6
parent 0d303169f2
commit 0ebe24be20
6 changed files with 106 additions and 13 deletions
+10 -5
View File
@@ -32,13 +32,18 @@ export const useSendClientWidgetApiAction = (api: ClientWidgetApi) => {
return sendWidgetAction;
};
export const useCallControlState = (control: CallControl): CallControlState => {
const [state, setState] = useState(control.getState());
const DEFAULT_CONTROL_STATE = new CallControlState(false, false, false);
export const useCallControlState = (control: CallControl | undefined): CallControlState => {
const [state, setState] = useState(control?.getState() ?? DEFAULT_CONTROL_STATE);
useEffect(() => {
const handleUpdate = () => {
setState(control.getState());
};
if (!control) {
setState(DEFAULT_CONTROL_STATE);
return;
}
setState(control.getState());
const handleUpdate = () => setState(control.getState());
control.on(CallControlEvent.StateUpdate, handleUpdate);
return () => {
control.off(CallControlEvent.StateUpdate, handleUpdate);