useDisplayMedia

Category

Browser

Hook that provides screen sharing functionality using the Display Media API

import { useDisplayMedia } from '@siberiacancode/reactuse';

Usage

const { stream, sharing, start, stop } = useDisplayMedia(ref);
// or
const { ref, stream, sharing, start, stop } = useDisplayMedia<HTMLVideoElement>();

Demo

source

Api

Parameters

Name	Type	Default	Note
target	Target	-	The target video element to display the media stream
options.audio?	boolean | MediaTrackConstraints	-	Whether to enable audio sharing
options.enabled?	boolean	false	Whether to start immediately
options.video?	boolean | MediaTrackConstraints	-	Whether to enable video sharing

Returns

UseDisplayMediaReturn

Parameters

Name	Type	Default	Note
options.audio?	boolean | MediaTrackConstraints	-	Whether to enable audio sharing
options.enabled?	boolean	false	Whether to start immediately
options.video?	boolean | MediaTrackConstraints	-	Whether to enable video sharing

Returns

UseDisplayMediaReturn & { ref: StateRef<HTMLVideoElement> }

Contributors

Source • Demo