@stream-io/video-react-sdk 0.0.1-alpha.46 → 0.0.1-alpha.48

package/dist/src/core/hooks/index.js

@@ -1,4 +1,5 @@
 export * from './useAudioPublisher';
+export * from './useDevices';
 export * from './useVideoPublisher';
 export * from './useTrackElementVisibility';
 //# sourceMappingURL=index.js.map

package/dist/src/core/hooks/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/hooks/index.ts"],"names":[],"mappings":"AAAA,cAAc,qBAAqB,CAAC;AACpC,cAAc,qBAAqB,CAAC;AACpC,cAAc,6BAA6B,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/hooks/index.ts"],"names":[],"mappings":"AAAA,cAAc,qBAAqB,CAAC;AACpC,cAAc,cAAc,CAAC;AAC7B,cAAc,qBAAqB,CAAC;AACpC,cAAc,6BAA6B,CAAC"}

package/dist/src/core/hooks/useAudioPublisher.js

@@ -29,7 +29,9 @@ export const useAudioPublisher = ({ initialAudioMuted, audioDeviceId, }) => {
             throw new Error(`No permission to publish audio`);
         }
         try {
-            const audioStream = yield getAudioStream(audioDeviceId);
+            const audioStream = yield getAudioStream({
+                deviceId: audioDeviceId,
+            });
             yield call.publishAudioStream(audioStream);
         }
         catch (e) {
@@ -69,12 +71,16 @@ export const useAudioPublisher = ({ initialAudioMuted, audioDeviceId, }) => {
             // We need to stop the original track first in order
             // we can retrieve the new default device stream
             track.stop();
-            const audioStream = yield getAudioStream('default');
+            const audioStream = yield getAudioStream({
+                deviceId: 'default',
+            });
             yield call.publishAudioStream(audioStream);
         }));
         const handleTrackEnded = () => __awaiter(void 0, void 0, void 0, function* () {
             if (selectedAudioDeviceId === audioDeviceId) {
-                const audioStream = yield getAudioStream(audioDeviceId);
+                const audioStream = yield getAudioStream({
+                    deviceId: audioDeviceId,
+                });
                 yield call.publishAudioStream(audioStream);
             }
         });

package/dist/src/core/hooks/useAudioPublisher.js.map

@@ -1 +1 @@
-{"version":3,"file":"useAudioPublisher.js","sourceRoot":"","sources":["../../../../src/core/hooks/useAudioPublisher.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"useAudioPublisher.js","sourceRoot":"","sources":["../../../../src/core/hooks/useAudioPublisher.ts"],"names":[],"mappings":";;;;;;;;;AAAA,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAC/C,OAAO,EAAE,GAAG,EAAE,MAAM,MAAM,CAAC;AAC3B,OAAO,EACL,YAAY,EACZ,cAAc,EACd,aAAa,EACb,SAAS,EACT,+BAA+B,EAC/B,+BAA+B,GAChC,MAAM,yBAAyB,CAAC;AACjC,OAAO,EACL,OAAO,EACP,mBAAmB,EACnB,YAAY,EACZ,mBAAmB,GACpB,MAAM,iCAAiC,CAAC;AAUzC;;;GAGG;AACH,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,EAChC,iBAAiB,EACjB,aAAa,GACM,EAAE,EAAE;IACvB,MAAM,IAAI,GAAG,OAAO,EAAE,CAAC;IACvB,MAAM,SAAS,GAAG,YAAY,EAAE,CAAC;IACjC,MAAM,YAAY,GAAG,mBAAmB,EAAE,CAAC;IAC3C,MAAM,WAAW,GAAG,mBAAmB,EAAE,CAAC;IAC1C,MAAM,EAAE,iBAAiB,EAAE,GAAG,SAAS,CAAC;IAExC,MAAM,iBAAiB,GAAG,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,eAAe,CAAC,QAAQ,CAC7D,SAAS,CAAC,SAAS,CAAC,KAAK,CAC1B,CAAC;IAEF,MAAM,kBAAkB,GAAG,WAAW,CAAC,GAAS,EAAE;QAChD,IAAI,CAAC,IAAI;YAAE,OAAO;QAClB,IAAI,CAAC,IAAI,CAAC,kBAAkB,CAAC,aAAa,CAAC,aAAa,CAAC,UAAU,CAAC,EAAE;YACpE,MAAM,IAAI,KAAK,CAAC,gCAAgC,CAAC,CAAC;SACnD;QACD,IAAI;YACF,MAAM,WAAW,GAAG,MAAM,cAAc,CAAC;gBACvC,QAAQ,EAAE,aAAa;aACxB,CAAC,CAAC;YACH,MAAM,IAAI,CAAC,kBAAkB,CAAC,WAAW,CAAC,CAAC;SAC5C;QAAC,OAAO,CAAC,EAAE;YACV,OAAO,CAAC,GAAG,CAAC,gCAAgC,EAAE,CAAC,CAAC,CAAC;SAClD;IACH,CAAC,CAAA,EAAE,CAAC,aAAa,EAAE,IAAI,CAAC,CAAC,CAAC;IAE1B,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,YAAY,KAAK,YAAY,CAAC,MAAM,IAAI,CAAC,iBAAiB,EAAE;YAC9D,kBAAkB,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,EAAE;gBAC/B,OAAO,CAAC,KAAK,CAAC,gCAAgC,EAAE,CAAC,CAAC,CAAC;YACrD,CAAC,CAAC,CAAC;SACJ;IACH,CAAC,EAAE,CAAC,YAAY,EAAE,iBAAiB,EAAE,kBAAkB,CAAC,CAAC,CAAC;IAE1D,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,iBAAiB;YAAE,OAAO;QAC/B,MAAM,YAAY,GAAG,+BAA+B,CAClD,iBAAiB,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,aAAD,CAAC,uBAAD,CAAC,CAAE,aAAa,CAAC,CAAC,CACrD,CAAC,SAAS,CAAC,GAAS,EAAE;YACrB,IAAI,CAAC,IAAI;gBAAE,OAAO;YAClB,IAAI,CAAC,cAAc,CAAC,SAAS,CAAC,CAAC;YAC/B,MAAM,IAAI,CAAC,WAAW,CAAC,SAAS,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC;QACpD,CAAC,CAAA,CAAC,CAAC;QACH,OAAO,GAAG,EAAE;YACV,YAAY,CAAC,WAAW,EAAE,CAAC;QAC7B,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,iBAAiB,EAAE,IAAI,CAAC,CAAC,CAAC;IAE9B,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,CAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,WAAW,CAAA,IAAI,CAAC,IAAI,IAAI,CAAC,iBAAiB;YAAE,OAAO;QAErE,MAAM,CAAC,KAAK,CAAC,GAAG,WAAW,CAAC,WAAW,CAAC,cAAc,EAAE,CAAC;QACzD,MAAM,qBAAqB,GAAG,KAAK,CAAC,WAAW,EAAE,CAAC,QAAQ,CAAC;QAE3D,MAAM,sBAAsB,GAAG,+BAA+B,EAAE,CAAC,SAAS,CACxE,GAAS,EAAE;YACT,IACE,CAAC,CACC,IAAI;gBACJ,WAAW,CAAC,WAAW;gBACvB,qBAAqB,KAAK,SAAS,CACpC;gBAED,OAAO;YACT,oDAAoD;YACpD,gDAAgD;YAChD,KAAK,CAAC,IAAI,EAAE,CAAC;YACb,MAAM,WAAW,GAAG,MAAM,cAAc,CAAC;gBACvC,QAAQ,EAAE,SAAS;aACpB,CAAC,CAAC;YACH,MAAM,IAAI,CAAC,kBAAkB,CAAC,WAAW,CAAC,CAAC;QAC7C,CAAC,CAAA,CACF,CAAC;QAEF,MAAM,gBAAgB,GAAG,GAAS,EAAE;YAClC,IAAI,qBAAqB,KAAK,aAAa,EAAE;gBAC3C,MAAM,WAAW,GAAG,MAAM,cAAc,CAAC;oBACvC,QAAQ,EAAE,aAAa;iBACxB,CAAC,CAAC;gBACH,MAAM,IAAI,CAAC,kBAAkB,CAAC,WAAW,CAAC,CAAC;aAC5C;QACH,CAAC,CAAA,CAAC;QAEF,KAAK,CAAC,gBAAgB,CAAC,OAAO,EAAE,gBAAgB,CAAC,CAAC;QAClD,OAAO,GAAG,EAAE;YACV,KAAK,CAAC,mBAAmB,CAAC,OAAO,EAAE,gBAAgB,CAAC,CAAC;YACrD,sBAAsB,CAAC,WAAW,EAAE,CAAC;QACvC,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,aAAa,EAAE,IAAI,EAAE,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,WAAW,EAAE,iBAAiB,CAAC,CAAC,CAAC;IAEvE,OAAO,kBAAkB,CAAC;AAC5B,CAAC,CAAC"}

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

@@ -0,0 +1,68 @@
+import { Observable } from 'rxjs';
+/**
+ * Observes changes in connected devices and maintains an up-to-date array of connected MediaDeviceInfo objects.
+ * @param observeDevices
+ * @category Device Management
+ */
+export declare const useDevices: (observeDevices: () => Observable<MediaDeviceInfo[]>) => MediaDeviceInfo[];
+/**
+ * Observes changes and maintains an array of connected video input devices
+ * @category Device Management
+ */
+export declare const useVideoDevices: () => MediaDeviceInfo[];
+/**
+ * Observes changes and maintains an array of connected audio input devices
+ * @category Device Management
+ */
+export declare const useAudioInputDevices: () => MediaDeviceInfo[];
+/**
+ * Observes changes and maintains an array of connected audio output devices
+ * @category Device Management
+ */
+export declare const useAudioOutputDevices: () => MediaDeviceInfo[];
+/**
+ * Verifies that newly selected device id exists among the registered devices.
+ * If the selected device id is not found among existing devices, switches to the default device.
+ * @param devices$
+ * @param switchToDefaultDevice
+ * @param selectedDeviceId
+ * @category Device Management
+ */
+export declare const useDeviceFallback: (devices$: Observable<MediaDeviceInfo[]>, switchToDefaultDevice: () => void, selectedDeviceId?: string) => void;
+/**
+ * Verifies that newly selected video device id exists among the registered devices.
+ * If the selected device id is not found among existing devices, switches to the default video device.
+ * @param switchToDefaultDevice
+ * @param selectedDeviceId
+ * @category Device Management
+ */
+export declare const useVideoDeviceFallback: (switchToDefaultDevice: () => void, selectedDeviceId?: string) => void;
+/**
+ * Verifies that newly selected audio input device id exists among the registered devices.
+ * If the selected device id is not found among existing devices, switches to the default audio input device.
+ * @param switchToDefaultDevice
+ * @param selectedDeviceId
+ * @category Device Management
+ */
+export declare const useAudioInputDeviceFallback: (switchToDefaultDevice: () => void, selectedDeviceId?: string) => void;
+/**
+ * Verifies that newly selected audio output device id exists among the registered devices.
+ * If the selected device id is not found among existing devices, switches to the default audio output device.
+ * @param switchToDefaultDevice
+ * @param selectedDeviceId
+ * @category Device Management
+ */
+export declare const useAudioOutputDeviceFallback: (switchToDefaultDevice: () => void, selectedDeviceId?: string) => void;
+/**
+ * Observes devices of certain kind are made unavailable and executes onDisconnect callback
+ * @param observeDevices
+ * @param onDisconnect
+ * @category Device Management
+ */
+export declare const useOnUnavailableDevices: (observeDevices: () => Observable<MediaDeviceInfo[]>, onDisconnect: () => void) => void;
+/**
+ * Observes disconnect of all video devices and executes onDisconnect callback
+ * @param onDisconnect
+ * @category Device Management
+ */
+export declare const useOnUnavailableVideoDevices: (onDisconnect: () => void) => void;

package/dist/src/core/hooks/useDevices.js

@@ -0,0 +1,101 @@
+import { useEffect, useState } from 'react';
+import { pairwise } from 'rxjs';
+import { getAudioDevices, getAudioOutputDevices, getVideoDevices, } from '@stream-io/video-client';
+/**
+ * Observes changes in connected devices and maintains an up-to-date array of connected MediaDeviceInfo objects.
+ * @param observeDevices
+ * @category Device Management
+ */
+export const useDevices = (observeDevices) => {
+    const [devices, setDevices] = useState([]);
+    useEffect(() => {
+        const subscription = observeDevices().subscribe(setDevices);
+        return () => {
+            subscription.unsubscribe();
+        };
+    }, [observeDevices]);
+    return devices;
+};
+/**
+ * Observes changes and maintains an array of connected video input devices
+ * @category Device Management
+ */
+export const useVideoDevices = () => useDevices(getVideoDevices);
+/**
+ * Observes changes and maintains an array of connected audio input devices
+ * @category Device Management
+ */
+export const useAudioInputDevices = () => useDevices(getAudioDevices);
+/**
+ * Observes changes and maintains an array of connected audio output devices
+ * @category Device Management
+ */
+export const useAudioOutputDevices = () => useDevices(getAudioOutputDevices);
+/**
+ * Verifies that newly selected device id exists among the registered devices.
+ * If the selected device id is not found among existing devices, switches to the default device.
+ * @param devices$
+ * @param switchToDefaultDevice
+ * @param selectedDeviceId
+ * @category Device Management
+ */
+export const useDeviceFallback = (devices$, switchToDefaultDevice, selectedDeviceId) => {
+    useEffect(() => {
+        const validateDeviceId = devices$.pipe().subscribe((devices) => {
+            const deviceFound = devices.find((device) => device.deviceId === selectedDeviceId);
+            if (!deviceFound)
+                switchToDefaultDevice();
+        });
+        return () => {
+            validateDeviceId.unsubscribe();
+        };
+    }, [devices$, selectedDeviceId, switchToDefaultDevice]);
+};
+/**
+ * Verifies that newly selected video device id exists among the registered devices.
+ * If the selected device id is not found among existing devices, switches to the default video device.
+ * @param switchToDefaultDevice
+ * @param selectedDeviceId
+ * @category Device Management
+ */
+export const useVideoDeviceFallback = (switchToDefaultDevice, selectedDeviceId) => useDeviceFallback(getVideoDevices(), switchToDefaultDevice, selectedDeviceId);
+/**
+ * Verifies that newly selected audio input device id exists among the registered devices.
+ * If the selected device id is not found among existing devices, switches to the default audio input device.
+ * @param switchToDefaultDevice
+ * @param selectedDeviceId
+ * @category Device Management
+ */
+export const useAudioInputDeviceFallback = (switchToDefaultDevice, selectedDeviceId) => useDeviceFallback(getAudioDevices(), switchToDefaultDevice, selectedDeviceId);
+/**
+ * Verifies that newly selected audio output device id exists among the registered devices.
+ * If the selected device id is not found among existing devices, switches to the default audio output device.
+ * @param switchToDefaultDevice
+ * @param selectedDeviceId
+ * @category Device Management
+ */
+export const useAudioOutputDeviceFallback = (switchToDefaultDevice, selectedDeviceId) => useDeviceFallback(getAudioOutputDevices(), switchToDefaultDevice, selectedDeviceId);
+/**
+ * Observes devices of certain kind are made unavailable and executes onDisconnect callback
+ * @param observeDevices
+ * @param onDisconnect
+ * @category Device Management
+ */
+export const useOnUnavailableDevices = (observeDevices, onDisconnect) => {
+    useEffect(() => {
+        const subscription = observeDevices()
+            .pipe(pairwise())
+            .subscribe(([prev, current]) => {
+            if (prev.length > 0 && current.length === 0)
+                onDisconnect();
+        });
+        return () => subscription.unsubscribe();
+    }, [observeDevices, onDisconnect]);
+};
+/**
+ * Observes disconnect of all video devices and executes onDisconnect callback
+ * @param onDisconnect
+ * @category Device Management
+ */
+export const useOnUnavailableVideoDevices = (onDisconnect) => useOnUnavailableDevices(getVideoDevices, onDisconnect);
+//# sourceMappingURL=useDevices.js.map

package/dist/src/core/hooks/useDevices.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDevices.js","sourceRoot":"","sources":["../../../../src/core/hooks/useDevices.ts"],"names":[],"mappings":"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"}

package/dist/src/core/hooks/useVideoPublisher.js

@@ -9,8 +9,8 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
 };
 import { useCallback, useEffect } from 'react';
 import { map } from 'rxjs';
-import { CallingState, getVideoStream, OwnCapability, SfuModels, watchForAddedDefaultVideoDevice, watchForDisconnectedVideoDevice, } from '@stream-io/video-client';
-import { useCall, useCallCallingState, useCallState, useLocalParticipant, } from '@stream-io/video-react-bindings';
+import { CallingState, getVideoStream, OwnCapability, SfuModels, VideoSettingsCameraFacingEnum, watchForAddedDefaultVideoDevice, watchForDisconnectedVideoDevice, } from '@stream-io/video-client';
+import { useCall, useCallCallingState, useCallMetadata, useCallState, useLocalParticipant, } from '@stream-io/video-react-bindings';
 import { useDebugPreferredVideoCodec } from '../../components/Debug/useIsDebugMode';
 /**
  * @internal
@@ -24,6 +24,9 @@ export const useVideoPublisher = ({ initialVideoMuted, videoDeviceId, }) => {
     const { localParticipant$ } = callState;
     const preferredCodec = useDebugPreferredVideoCodec();
     const isPublishingVideo = participant === null || participant === void 0 ? void 0 : participant.publishedTracks.includes(SfuModels.TrackType.VIDEO);
+    const metadata = useCallMetadata();
+    const videoSettings = metadata === null || metadata === void 0 ? void 0 : metadata.settings.video;
+    const targetResolution = videoSettings === null || videoSettings === void 0 ? void 0 : videoSettings.target_resolution;
     const publishVideoStream = useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
         if (!call)
             return;
@@ -31,13 +34,25 @@ export const useVideoPublisher = ({ initialVideoMuted, videoDeviceId, }) => {
             throw new Error(`No permission to publish video`);
         }
         try {
-            const videoStream = yield getVideoStream(videoDeviceId);
+            const videoStream = yield getVideoStream({
+                deviceId: videoDeviceId,
+                width: targetResolution === null || targetResolution === void 0 ? void 0 : targetResolution.width,
+                height: targetResolution === null || targetResolution === void 0 ? void 0 : targetResolution.height,
+                facingMode: toFacingMode(videoSettings === null || videoSettings === void 0 ? void 0 : videoSettings.camera_facing),
+            });
             yield call.publishVideoStream(videoStream, { preferredCodec });
         }
         catch (e) {
             console.log('Failed to publish video stream', e);
         }
-    }), [call, preferredCodec, videoDeviceId]);
+    }), [
+        call,
+        preferredCodec,
+        targetResolution === null || targetResolution === void 0 ? void 0 : targetResolution.height,
+        targetResolution === null || targetResolution === void 0 ? void 0 : targetResolution.width,
+        videoDeviceId,
+        videoSettings === null || videoSettings === void 0 ? void 0 : videoSettings.camera_facing,
+    ]);
     useEffect(() => {
         if (callingState === CallingState.JOINED && !initialVideoMuted) {
             publishVideoStream().catch((e) => {
@@ -71,12 +86,16 @@ export const useVideoPublisher = ({ initialVideoMuted, videoDeviceId, }) => {
             // We need to stop the original track first in order
             // we can retrieve the new default device stream
             track.stop();
-            const videoStream = yield getVideoStream('default');
+            const videoStream = yield getVideoStream({
+                deviceId: 'default',
+            });
             yield call.publishVideoStream(videoStream);
         }));
         const handleTrackEnded = () => __awaiter(void 0, void 0, void 0, function* () {
             if (selectedVideoDeviceId === videoDeviceId) {
-                const videoStream = yield getVideoStream(videoDeviceId);
+                const videoStream = yield getVideoStream({
+                    deviceId: videoDeviceId,
+                });
                 yield call.publishVideoStream(videoStream);
             }
         });
@@ -88,4 +107,14 @@ export const useVideoPublisher = ({ initialVideoMuted, videoDeviceId, }) => {
     }, [videoDeviceId, call, participant === null || participant === void 0 ? void 0 : participant.videoStream, isPublishingVideo]);
     return publishVideoStream;
 };
+const toFacingMode = (value) => {
+    switch (value) {
+        case VideoSettingsCameraFacingEnum.FRONT:
+            return 'user';
+        case VideoSettingsCameraFacingEnum.BACK:
+            return 'environment';
+        default:
+            return undefined;
+    }
+};
 //# sourceMappingURL=useVideoPublisher.js.map

package/dist/src/core/hooks/useVideoPublisher.js.map

@@ -1 +1 @@
-{"version":3,"file":"useVideoPublisher.js","sourceRoot":"","sources":["../../../../src/core/hooks/useVideoPublisher.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"useVideoPublisher.js","sourceRoot":"","sources":["../../../../src/core/hooks/useVideoPublisher.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -25,9 +25,9 @@
     "@floating-ui/react": "^0.22.0",
     "@nivo/core": "^0.80.0",
     "@nivo/line": "^0.80.0",
-    "@stream-io/i18n": "^0.0.1-alpha.30",
-    "@stream-io/video-client": "^0.0.1-alpha.154",
-    "@stream-io/video-react-bindings": "^0.0.1-alpha.41",
+    "@stream-io/i18n": "^0.0.1-alpha.32",
+    "@stream-io/video-client": "^0.0.1-alpha.156",
+    "@stream-io/video-react-bindings": "^0.0.1-alpha.43",
     "clsx": "^1.2.1",
     "rxjs": "~7.8.1"
   },
@@ -36,7 +36,7 @@
     "react-dom": "^18.0.0"
   },
   "devDependencies": {
-    "@stream-io/video-styling": "^0.0.1-alpha.24",
+    "@stream-io/video-styling": "^0.0.1-alpha.26",
     "@types/rimraf": "^3.0.2",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
@@ -45,5 +45,5 @@
     "typedoc": "^0.24.7",
     "typescript": "^4.9.5"
   },
-  "version": "0.0.1-alpha.46"
+  "version": "0.0.1-alpha.48"
 }

package/src/components/CallControls/ToggleAudioButton.tsx

@@ -18,7 +18,8 @@ export type ToggleAudioPreviewButtonProps = { caption?: string };
 export const ToggleAudioPreviewButton = ({
   caption,
 }: ToggleAudioPreviewButtonProps) => {
-  const { initialAudioEnabled, toggleAudioMuteState } = useMediaDevices();
+  const { initialAudioEnabled, toggleInitialAudioMuteState } =
+    useMediaDevices();
   const { t } = useI18n();
 
   return (
@@ -29,7 +30,7 @@ export const ToggleAudioPreviewButton = ({
     >
       <IconButton
         icon={initialAudioEnabled ? 'mic' : 'mic-off'}
-        onClick={toggleAudioMuteState}
+        onClick={toggleInitialAudioMuteState}
       />
     </CompositeButton>
   );
@@ -42,7 +43,8 @@ export type ToggleAudioPublishingButtonProps = {
 export const ToggleAudioPublishingButton = (
   props: ToggleAudioPublishingButtonProps,
 ) => {
-  const { publishAudioStream, stopPublishingAudio } = useMediaDevices();
+  const { publishAudioStream, stopPublishingAudio, setInitialAudioEnabled } =
+    useMediaDevices();
   const localParticipant = useLocalParticipant();
   const { t } = useI18n();
 
@@ -79,6 +81,7 @@ export const ToggleAudioPublishingButton = (
     }
     if (isAudioMute) {
       if (hasPermission) {
+        setInitialAudioEnabled(true);
         await publishAudioStream();
       } else {
         console.log('Cannot publish audio stream. Insufficient permissions.');
@@ -91,6 +94,7 @@ export const ToggleAudioPublishingButton = (
     hasPermission,
     isAudioMute,
     publishAudioStream,
+    setInitialAudioEnabled,
     stopPublishingAudio,
   ]);
 

package/src/components/CallControls/ToggleVideoButton.tsx

@@ -8,7 +8,7 @@ import {
 
 import { OwnCapability, SfuModels } from '@stream-io/video-client';
 import { CompositeButton, IconButton } from '../Button/';
-import { useMediaDevices } from '../../core';
+import { DEVICE_STATE, useMediaDevices } from '../../core';
 import { DeviceSelectorVideo } from '../DeviceSettings';
 import { PermissionNotification } from '../Notification';
 
@@ -17,7 +17,7 @@ export type ToggleVideoPreviewButtonProps = { caption?: string };
 export const ToggleVideoPreviewButton = ({
   caption = 'Video',
 }: ToggleVideoPreviewButtonProps) => {
-  const { toggleVideoMuteState, initialVideoState } = useMediaDevices();
+  const { toggleInitialVideoMuteState, initialVideoState } = useMediaDevices();
 
   return (
     <CompositeButton
@@ -27,7 +27,7 @@ export const ToggleVideoPreviewButton = ({
     >
       <IconButton
         icon={initialVideoState.enabled ? 'camera' : 'camera-off'}
-        onClick={toggleVideoMuteState}
+        onClick={toggleInitialVideoMuteState}
       />
     </CompositeButton>
   );
@@ -40,7 +40,8 @@ type ToggleVideoPublishingButtonProps = {
 export const ToggleVideoPublishingButton = ({
   caption = 'Video',
 }: ToggleVideoPublishingButtonProps) => {
-  const { publishVideoStream, stopPublishingVideo } = useMediaDevices();
+  const { publishVideoStream, stopPublishingVideo, setInitialVideoState } =
+    useMediaDevices();
   const localParticipant = useLocalParticipant();
   const isVideoMute = !localParticipant?.publishedTracks.includes(
     SfuModels.TrackType.VIDEO,
@@ -73,6 +74,7 @@ export const ToggleVideoPublishingButton = ({
     }
     if (isVideoMute) {
       if (hasPermission) {
+        setInitialVideoState(DEVICE_STATE.playing);
         await publishVideoStream();
       } else {
         console.log('Cannot publish video. Insufficient permissions.');
@@ -85,6 +87,7 @@ export const ToggleVideoPublishingButton = ({
     hasPermission,
     isVideoMute,
     publishVideoStream,
+    setInitialVideoState,
     stopPublishingVideo,
   ]);
 

package/src/components/DeviceSettings/DeviceSelectorAudio.tsx

@@ -1,5 +1,9 @@
 import { DeviceSelector } from './DeviceSelector';
-import { useMediaDevices } from '../../core/contexts';
+import {
+  useMediaDevices,
+  useAudioInputDevices,
+  useAudioOutputDevices,
+} from '../../core';
 
 export type DeviceSelectorAudioInputProps = {
   title?: string;
@@ -8,8 +12,8 @@ export type DeviceSelectorAudioInputProps = {
 export const DeviceSelectorAudioInput = ({
   title = 'Select a Mic',
 }: DeviceSelectorAudioInputProps) => {
-  const { audioInputDevices, selectedAudioInputDeviceId, switchDevice } =
-    useMediaDevices();
+  const { selectedAudioInputDeviceId, switchDevice } = useMediaDevices();
+  const audioInputDevices = useAudioInputDevices();
 
   return (
     <DeviceSelector
@@ -31,12 +35,13 @@ export const DeviceSelectorAudioOutput = ({
   title = 'Select speakers',
 }: DeviceSelectorAudioOutputProps) => {
   const {
-    audioOutputDevices,
     isAudioOutputChangeSupported,
     selectedAudioOutputDeviceId,
     switchDevice,
   } = useMediaDevices();
 
+  const audioOutputDevices = useAudioOutputDevices();
+
   if (!isAudioOutputChangeSupported) return null;
 
   return (

package/src/components/DeviceSettings/DeviceSelectorVideo.tsx

@@ -1,13 +1,13 @@
 import { DeviceSelector } from './DeviceSelector';
-import { useMediaDevices } from '../../core/contexts';
+import { useMediaDevices, useVideoDevices } from '../../core';
 
 export type DeviceSelectorVideoProps = {
   title?: string;
 };
 
 export const DeviceSelectorVideo = ({ title }: DeviceSelectorVideoProps) => {
-  const { videoDevices, selectedVideoDeviceId, switchDevice } =
-    useMediaDevices();
+  const { selectedVideoDeviceId, switchDevice } = useMediaDevices();
+  const videoDevices = useVideoDevices();
 
   return (
     <DeviceSelector

package/src/components/Notification/SpeakingWhileMutedNotification.tsx

@@ -2,7 +2,7 @@ import { useEffect, useState } from 'react';
 import { createSoundDetector, SfuModels } from '@stream-io/video-client';
 import { useLocalParticipant } from '@stream-io/video-react-bindings';
 
-import { useMediaDevices } from '../../core/contexts';
+import { useMediaDevices } from '../../core';
 import { Notification } from './Notification';
 import { ChildrenOnly } from '../../types';
 
@@ -18,13 +18,14 @@ export const SpeakingWhileMutedNotification = ({ children }: ChildrenOnly) => {
   useEffect(() => {
     // do nothing when not muted
     if (!isAudioMute) return;
-    const disposeSoundDetector = getAudioStream(audioDeviceId).then(
-      (audioStream) =>
-        createSoundDetector(audioStream, (isSpeechDetected) => {
-          setIsSpeakingWhileMuted((isNotified) =>
-            isNotified ? isNotified : isSpeechDetected,
-          );
-        }),
+    const disposeSoundDetector = getAudioStream({
+      deviceId: audioDeviceId,
+    }).then((audioStream) =>
+      createSoundDetector(audioStream, (isSpeechDetected) => {
+        setIsSpeakingWhileMuted((isNotified) =>
+          isNotified ? isNotified : isSpeechDetected,
+        );
+      }),
     );
     disposeSoundDetector.catch((err) => {
       console.error('Error while creating sound detector', err);

package/src/components/Video/VideoPreview.tsx

@@ -7,8 +7,13 @@ import {
 } from 'react';
 import clsx from 'clsx';
 import { disposeOfMediaStream } from '@stream-io/video-client';
-import { BaseVideo } from '../../core/components/Video/BaseVideo';
-import { DEVICE_STATE, useMediaDevices } from '../../core/contexts';
+import { BaseVideo } from '../../core/components/Video';
+import {
+  DEVICE_STATE,
+  useMediaDevices,
+  useOnUnavailableVideoDevices,
+  useVideoDevices,
+} from '../../core';
 import { LoadingIndicator } from '../LoadingIndicator';
 
 const DefaultDisabledVideoPreview = () => {
@@ -47,19 +52,24 @@ export const VideoPreview = ({
   VideoErrorPreview = DefaultVideoErrorPreview,
 }: VideoPreviewProps) => {
   const [stream, setStream] = useState<MediaStream>();
-
   const {
-    videoDevices,
     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 || videoDevices.length === 0) return;
+    if (!initialVideoState.enabled) return;
 
-    getVideoStream(selectedVideoDeviceId)
+    getVideoStream({ deviceId: selectedVideoDeviceId })
       .then((s) => {
         setStream((previousStream) => {
           if (previousStream) {