Variable CardVideoDisplay`Const`

CardVideoDisplay: React.FC<CardVideoDisplayOptions> = ...

CardVideoDisplay - A React functional component that displays a video stream with configurable display options.

This component renders a video element from a provided MediaStream, allowing options such as mirroring the video, setting a background color, and controlling whether the video fills the display area.

Component

Param: props

The properties object for CardVideoDisplay.

Param: props.remoteProducerId

The ID of the remote producer for tracking the video stream source.

Param: props.eventType

Type of the event, used for handling different video stream conditions.

Param: props.forceFullDisplay

If true, the video fills the display area.

Param: props.videoStream

The media stream to be displayed in the video element.

Param: props.backgroundColor

Background color for the video container.

Param: props.doMirror

If true, the video is mirrored horizontally.

Returns

The rendered video display component.

Example

import React from 'react';
import { CardVideoDisplay } from 'mediasfu-reactjs';

function App() {
  const mediaStream = new MediaStream(); // Example media stream

  return (
    <CardVideoDisplay
      remoteProducerId="producer-123"
      eventType="live"
      forceFullDisplay={true}
      videoStream={mediaStream}
      backgroundColor="black"
      doMirror={true}
    />
  );
}

export default App;