@stream-io/video-react-sdk 0.3.47 → 0.4.0

package/dist/src/core/contexts/MediaDevicesContext.d.ts

@@ -1,180 +0,0 @@
-import { PropsWithChildren } from 'react';
-import { getAudioStream, getVideoStream } from '@stream-io/video-client';
-type EnabledStateType = 'starting' | 'playing';
-type DisabledStateType = 'uninitialized' | 'stopped';
-type EnabledDeviceState<T extends EnabledStateType> = {
-    type: T;
-    enabled: true;
-};
-type DisabledDeviceState<T extends DisabledStateType> = {
-    type: T;
-    enabled: false;
-};
-type ErrorDeviceState = {
-    type: 'error';
-    message: string;
-    enabled: false;
-};
-type DeviceState = EnabledDeviceState<EnabledStateType> | DisabledDeviceState<DisabledStateType> | ErrorDeviceState;
-/**
- * Exclude types from documentation site, but we should still add doc comments
- * @internal
- */
-export declare const DEVICE_STATE: {
-    starting: EnabledDeviceState<'starting'>;
-    playing: EnabledDeviceState<'playing'>;
-    stopped: DisabledDeviceState<'stopped'>;
-    uninitialized: DisabledDeviceState<'uninitialized'>;
-    error: ErrorDeviceState;
-};
-/**
- * API to control device enablement, device selection and media stream access for a call.
- * @category Device Management
- */
-export type MediaDevicesContextAPI = {
-    /**
-     * Deactivates MediaStream (stops and removes tracks) to be later garbage collected
-     *
-     * @param stream MediaStream
-     * @returns void
-     */
-    disposeOfMediaStream: (stream: MediaStream) => void;
-    /**
-     * Returns an 'audioinput' media stream with the given `deviceId`, if no `deviceId` is provided, it uses the first available device.
-     *
-     * @param deviceId
-     * @returns
-     */
-    getAudioStream: typeof getAudioStream;
-    /**
-     * Returns a 'videoinput' media stream with the given `deviceId`, if no `deviceId` is provided, it uses the first available device.
-     *
-     * @param deviceId
-     * @returns
-     */
-    getVideoStream: typeof getVideoStream;
-    /**
-     * [Tells if the browser supports audio output change on 'audio' elements](https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement/setSinkId).
-     */
-    isAudioOutputChangeSupported: boolean;
-    /**
-     * Signals whether audio stream will be published when the call is joined.
-     */
-    initialAudioEnabled: boolean;
-    /**
-     * Signals whether audio stream will be published when the call is joined.
-     */
-    initialVideoState: DeviceState;
-    /**
-     * Publishes audio stream for currently selected audio input (microphone) device to other call participants.
-     */
-    publishAudioStream: () => Promise<void>;
-    /**
-     * Publishes video stream for currently selected video input (camera) device to other call participants.
-     */
-    publishVideoStream: () => Promise<void>;
-    /**
-     * Stops publishing audio stream for currently selected audio input (microphone) device to other call participants.
-     */
-    stopPublishingAudio: () => Promise<void>;
-    /**
-     * Stops publishing video stream for currently selected video input (camera) device to other call participants.
-     */
-    stopPublishingVideo: () => Promise<void>;
-    /**
-     * Sets the initialAudioEnabled flag to a given boolean value.
-     * The latest value set will be used to decide, whether audio stream will be published when joining a call.
-     * @param enabled
-     */
-    setInitialAudioEnabled: (enabled: boolean) => void;
-    /**
-     * Sets the initialVideoState to a given DeviceState value.
-     * The latest value set will be used to decide, whether video stream will be published when joining a call.
-     * @param enabled
-     */
-    setInitialVideoState: (state: DeviceState) => void;
-    /**
-     * Stores audio input device (microphone) id which is used to publish user's sound to other call participants.
-     */
-    selectedAudioInputDeviceId?: string;
-    /**
-     * Stores audio output device (speaker) id used to reproduce incoming audio from other call participants.
-     */
-    selectedAudioOutputDeviceId?: string;
-    /**
-     * Stores video input device (camera) id which is used to publish user's video to other call participants.
-     */
-    selectedVideoDeviceId?: string;
-    /**
-     * Function should be used to change selected device id.
-     * The change is later reflected in selectedAudioInputDeviceId, selectedAudioOutputDeviceId or selectedVideoDeviceId depending on kind parameter.
-     * @param kind
-     * @param deviceId
-     */
-    switchDevice: (kind: MediaDeviceKind, deviceId?: string) => void;
-    /**
-     * Sets the initialAudioEnabled flag by negating the current state value.
-     * The latest value set will be used to decide, whether audio stream will be published when joining a call.
-     * @param enabled
-     */
-    toggleInitialAudioMuteState: () => void;
-    /**
-     * Sets the initialVideoState by toggling  the current state DeviceState value.
-     * The latest value set will be used to decide, whether video stream will be published when joining a call.
-     * @param enabled
-     */
-    toggleInitialVideoMuteState: () => void;
-};
-/**
- * Configuration parameters for MediaDevicesProvider.
- * @category Device Management
- */
-export type MediaDevicesProviderProps = {
-    /**
-     * Provides external control over the initial audio input (microphone) enablement. Overrides the default false.
-     */
-    initialAudioEnabled?: boolean;
-    /**
-     * Provides external control over the initial video input (camera) enablement. Overrides the default false.
-     */
-    initialVideoEnabled?: boolean;
-    /**
-     * Allows to override the default audio input (microphone) stream to be published. Overrides the default string 'default'.
-     */
-    initialAudioInputDeviceId?: string;
-    /**
-     * Allows to override the default audio output (speaker) device to reproduce incoming audio from the SFU. Overrides the default string 'default'.
-     */
-    initialAudioOutputDeviceId?: string;
-    /**
-     * Allows to override the default video input (camera) stream to be published. Overrides the default string 'default'.
-     */
-    initialVideoInputDeviceId?: string;
-};
-/**
- * Context provider that internally puts in place mechanisms that:
- * 1. fall back to selecting a default device when trying to switch to a non-existent device
- * 2. fall back to a default device when an active device is disconnected
- * 3. stop publishing a media stream when a non-default device is disconnected
- * 4. republish a media stream from the newly connected default device
- * 5. republish a media stream when a new device is selected
- *
- * Provides `MediaDevicesContextAPI` that allow the integrators to handle:
- * 1. the initial device state enablement (for example apt for lobby scenario)
- * 2. media stream retrieval and disposal
- * 3. media stream publishing
- * 4. specific device selection
- * @param params
- * @returns
- *
- * @category Device Management
- */
-export declare const MediaDevicesProvider: ({ children, initialAudioEnabled, initialVideoEnabled, initialVideoInputDeviceId, initialAudioOutputDeviceId, initialAudioInputDeviceId, }: PropsWithChildren<MediaDevicesProviderProps>) => import("react/jsx-runtime").JSX.Element;
-/**
- * Context consumer retrieving MediaDevicesContextAPI.
- * @returns
- *
- * @category Device Management
- */
-export declare const useMediaDevices: () => MediaDevicesContextAPI;
-export {};

package/dist/src/core/contexts/index.d.ts

@@ -1 +0,0 @@
-export * from './MediaDevicesContext';

package/dist/src/core/hooks/useAudioPublisher.d.ts

@@ -1,12 +0,0 @@
-/**
- * @internal
- */
-export type AudioPublisherInit = {
-    initialAudioMuted?: boolean;
-    audioDeviceId?: string;
-};
-/**
- * @internal
- * @category Device Management
- */
-export declare const useAudioPublisher: ({ initialAudioMuted, audioDeviceId, }: AudioPublisherInit) => () => Promise<void>;

package/dist/src/core/hooks/useVideoPublisher.d.ts

@@ -1,12 +0,0 @@
-/**
- * @internal
- */
-export type VideoPublisherInit = {
-    initialVideoMuted?: boolean;
-    videoDeviceId?: string;
-};
-/**
- * @internal
- * @category Device Management
- */
-export declare const useVideoPublisher: ({ initialVideoMuted, videoDeviceId, }: VideoPublisherInit) => () => Promise<void>;

package/dist/src/hooks/useToggleAudioMuteState.d.ts

@@ -1,4 +0,0 @@
-export declare const useToggleAudioMuteState: () => {
-    toggleAudioMuteState: () => Promise<void>;
-    isAwaitingPermission: boolean;
-};

package/dist/src/hooks/useToggleScreenShare.d.ts

@@ -1,5 +0,0 @@
-export declare const useToggleScreenShare: () => {
-    toggleScreenShare: () => Promise<void>;
-    isAwaitingPermission: boolean;
-    isScreenSharing: boolean;
-};

package/dist/src/hooks/useToggleVideoMuteState.d.ts

@@ -1,4 +0,0 @@
-export declare const useToggleVideoMuteState: () => {
-    toggleVideoMuteState: () => Promise<void>;
-    isAwaitingPermission: boolean;
-};

package/src/components/Video/VideoPreview.tsx

@@ -1,152 +0,0 @@
-import {
-  ComponentType,
-  ReactEventHandler,
-  useCallback,
-  useEffect,
-  useState,
-} from 'react';
-import clsx from 'clsx';
-import { disposeOfMediaStream } from '@stream-io/video-client';
-import { BaseVideo } from '../../core/components/Video';
-import {
-  DEVICE_STATE,
-  useMediaDevices,
-  useOnUnavailableVideoDevices,
-  useVideoDevices,
-} from '../../core';
-import { LoadingIndicator } from '../LoadingIndicator';
-
-const DefaultDisabledVideoPreview = () => {
-  return <div>Video is disabled</div>;
-};
-
-const DefaultNoCameraPreview = () => {
-  return <div>No camera found</div>;
-};
-
-type VideoErrorPreviewProps = {
-  message?: string;
-};
-const DefaultVideoErrorPreview = ({ message }: VideoErrorPreviewProps) => {
-  return (
-    <>
-      <div>Error:</div>
-      <p>{message || 'Unexpected error happened'}</p>
-    </>
-  );
-};
-
-export type VideoPreviewProps = {
-  /**
-   * Component rendered when user turns off the video.
-   */
-  DisabledVideoPreview?: ComponentType;
-  /**
-   * Enforces mirroring of the video on the X axis. Defaults to true.
-   */
-  mirror?: boolean;
-  /**
-   * Component rendered when no camera devices are available.
-   */
-  NoCameraPreview?: ComponentType;
-  /**
-   * Component rendered above the BaseVideo until the video is ready (meaning until the play event is emitted).
-   */
-  StartingCameraPreview?: ComponentType;
-  /**
-   * Component rendered when the video stream could not be retrieved.
-   */
-  VideoErrorPreview?: ComponentType<VideoErrorPreviewProps>;
-};
-
-export const VideoPreview = ({
-  mirror = true,
-  DisabledVideoPreview = DefaultDisabledVideoPreview,
-  NoCameraPreview = DefaultNoCameraPreview,
-  StartingCameraPreview = LoadingIndicator,
-  VideoErrorPreview = DefaultVideoErrorPreview,
-}: VideoPreviewProps) => {
-  const [stream, setStream] = useState<MediaStream>();
-  const {
-    selectedVideoDeviceId,
-    getVideoStream,
-    initialVideoState,
-    setInitialVideoState,
-  } = useMediaDevices();
-  // When there are 0 video devices (e.g. when laptop lid closed),
-  // we do not restart the video automatically when the device is again available,
-  // but rather leave turning the video on manually to the user.
-  useOnUnavailableVideoDevices(() =>
-    setInitialVideoState(DEVICE_STATE.stopped),
-  );
-  const videoDevices = useVideoDevices();
-
-  useEffect(() => {
-    if (!initialVideoState.enabled) return;
-
-    getVideoStream({ deviceId: selectedVideoDeviceId })
-      .then((s) => {
-        setStream((previousStream) => {
-          if (previousStream) {
-            disposeOfMediaStream(previousStream);
-          }
-          return s;
-        });
-      })
-      .catch((e) =>
-        setInitialVideoState({
-          ...DEVICE_STATE.error,
-          message: (e as Error).message,
-        }),
-      );
-    return () => {
-      setStream(undefined);
-    };
-  }, [
-    initialVideoState,
-    getVideoStream,
-    selectedVideoDeviceId,
-    setInitialVideoState,
-    videoDevices.length,
-  ]);
-
-  useEffect(() => {
-    if (initialVideoState.type === 'stopped') {
-      setStream(undefined);
-    }
-  }, [initialVideoState]);
-
-  const handleOnPlay: ReactEventHandler<HTMLVideoElement> = useCallback(() => {
-    setInitialVideoState(DEVICE_STATE.playing);
-  }, [setInitialVideoState]);
-
-  let contents;
-  if (initialVideoState.type === 'error') {
-    contents = <VideoErrorPreview />;
-  } else if (initialVideoState.type === 'stopped' && !videoDevices.length) {
-    contents = <NoCameraPreview />;
-  } else if (initialVideoState.enabled) {
-    const loading = initialVideoState.type === 'starting';
-    contents = (
-      <>
-        {stream && (
-          <BaseVideo
-            stream={stream}
-            className={clsx('str-video__video-preview', {
-              'str-video__video-preview--mirror': mirror,
-              'str-video__video-preview--loading': loading,
-            })}
-            onPlay={handleOnPlay}
-          />
-        )}
-        {loading && <StartingCameraPreview />}
-      </>
-    );
-  } else {
-    contents = <DisabledVideoPreview />;
-  }
-
-  return (
-    <div className={clsx('str-video__video-preview-container')}>{contents}</div>
-  );
-};