@stream-io/video-react-sdk 1.2.4 → 1.2.6

package/CHANGELOG.md

@@ -2,6 +2,20 @@
 
 This file was generated using [@jscutlery/semver](https://github.com/jscutlery/semver).
 
+### [1.2.6](https://github.com/GetStream/stream-video-js/compare/@stream-io/video-react-sdk-1.2.5...@stream-io/video-react-sdk-1.2.6) (2024-06-24)
+
+
+### Bug Fixes
+
+* default onMenuToggle behavior shouldn't be overridden ([#1417](https://github.com/GetStream/stream-video-js/issues/1417)) ([3529e40](https://github.com/GetStream/stream-video-js/commit/3529e40b338c64e61ecbc7460e97c3c878771434))
+
+### [1.2.5](https://github.com/GetStream/stream-video-js/compare/@stream-io/video-react-sdk-1.2.4...@stream-io/video-react-sdk-1.2.5) (2024-06-20)
+
+
+### Bug Fixes
+
+* remove `isBlurringEnabled` prop ([#1411](https://github.com/GetStream/stream-video-js/issues/1411)) ([23bafe0](https://github.com/GetStream/stream-video-js/commit/23bafe0cc6a3bf0bcdff2e0339904dae5778c560))
+
 ### [1.2.4](https://github.com/GetStream/stream-video-js/compare/@stream-io/video-react-sdk-1.2.3...@stream-io/video-react-sdk-1.2.4) (2024-06-19)
 
 ### Dependency Updates

package/dist/index.cjs.js

@@ -72,7 +72,7 @@ const useBackgroundFilters = () => {
  * in your project before using this component.
  */
 const BackgroundFiltersProvider = (props) => {
-    const { children, isBlurringEnabled = true, backgroundImages = [], backgroundFilter: bgFilterFromProps = undefined, backgroundImage: bgImageFromProps = undefined, backgroundBlurLevel: bgBlurLevelFromProps = 'high', tfFilePath, modelFilePath, basePath, } = props;
+    const { children, backgroundImages = [], backgroundFilter: bgFilterFromProps = undefined, backgroundImage: bgImageFromProps = undefined, backgroundBlurLevel: bgBlurLevelFromProps = 'high', tfFilePath, modelFilePath, basePath, } = props;
     const [backgroundFilter, setBackgroundFilter] = react.useState(bgFilterFromProps);
     const [backgroundImage, setBackgroundImage] = react.useState(bgImageFromProps);
     const [backgroundBlurLevel, setBackgroundBlurLevel] = react.useState(bgBlurLevelFromProps);
@@ -112,7 +112,6 @@ const BackgroundFiltersProvider = (props) => {
             applyBackgroundBlurFilter,
             applyBackgroundImageFilter,
             backgroundImages,
-            isBlurringEnabled,
             tfFilePath,
             modelFilePath,
             basePath,
@@ -1085,7 +1084,7 @@ const ToggleDeviceSettingsMenuButton = react.forwardRef(function ToggleDeviceSet
 });
 
 const ToggleAudioPreviewButton = (props) => {
-    const { caption, Menu, menuPlacement, ...restCompositeButtonProps } = props;
+    const { caption, onMenuToggle, ...restCompositeButtonProps } = props;
     const { t } = videoReactBindings.useI18n();
     const { useMicrophoneState } = videoReactBindings.useCallStateHooks();
     const { microphone, optimisticIsMute, hasBrowserPermission } = useMicrophoneState();
@@ -1095,11 +1094,14 @@ const ToggleAudioPreviewButton = (props) => {
             ? t('Check your browser audio permissions')
             : caption ?? t('Mic'), tooltipDisabled: tooltipDisabled, children: jsxRuntime.jsxs(CompositeButton, { active: optimisticIsMute, caption: caption, className: clsx(!hasBrowserPermission && 'str-video__device-unavailable'), variant: "secondary", disabled: !hasBrowserPermission, "data-testid": optimisticIsMute
                 ? 'preview-audio-unmute-button'
-                : 'preview-audio-mute-button', onClick: handleClick, Menu: Menu, menuPlacement: menuPlacement, onMenuToggle: (shown) => setTooltipDisabled(shown), ...restCompositeButtonProps, children: [jsxRuntime.jsx(Icon, { icon: !optimisticIsMute ? 'mic' : 'mic-off' }), !hasBrowserPermission && (jsxRuntime.jsx("span", { className: "str-video__no-media-permission", title: t('Check your browser audio permissions'), children: "!" }))] }) }));
+                : 'preview-audio-mute-button', onClick: handleClick, ...restCompositeButtonProps, onMenuToggle: (shown) => {
+                setTooltipDisabled(shown);
+                onMenuToggle?.(shown);
+            }, children: [jsxRuntime.jsx(Icon, { icon: !optimisticIsMute ? 'mic' : 'mic-off' }), !hasBrowserPermission && (jsxRuntime.jsx("span", { className: "str-video__no-media-permission", title: t('Check your browser audio permissions'), children: "!" }))] }) }));
 };
 const ToggleAudioPublishingButton = (props) => {
     const { t } = videoReactBindings.useI18n();
-    const { caption, Menu = jsxRuntime.jsx(DeviceSelectorAudioInput, { visualType: "list" }), menuPlacement = 'top', ...restCompositeButtonProps } = props;
+    const { caption, Menu = jsxRuntime.jsx(DeviceSelectorAudioInput, { visualType: "list" }), menuPlacement = 'top', onMenuToggle, ...restCompositeButtonProps } = props;
     const { hasPermission, requestPermission, isAwaitingPermission } = useRequestPermission(videoClient.OwnCapability.SEND_AUDIO);
     const { useMicrophoneState } = videoReactBindings.useCallStateHooks();
     const { microphone, optimisticIsMute, hasBrowserPermission } = useMicrophoneState();
@@ -1116,11 +1118,14 @@ const ToggleAudioPublishingButton = (props) => {
                     ? t('You have no permission to share your audio')
                     : !hasBrowserPermission
                         ? t('Check your browser mic permissions')
-                        : caption ?? t('Mic'), tooltipDisabled: tooltipDisabled, children: jsxRuntime.jsxs(CompositeButton, { active: optimisticIsMute, caption: caption, variant: "secondary", disabled: !hasBrowserPermission || !hasPermission, "data-testid": optimisticIsMute ? 'audio-unmute-button' : 'audio-mute-button', onClick: handleClick, Menu: Menu, menuPlacement: menuPlacement, menuOffset: 16, onMenuToggle: (shown) => setTooltipDisabled(shown), ...restCompositeButtonProps, children: [jsxRuntime.jsx(Icon, { icon: optimisticIsMute ? 'mic-off' : 'mic' }), (!hasBrowserPermission || !hasPermission) && (jsxRuntime.jsx("span", { className: "str-video__no-media-permission", children: "!" }))] }) }) }) }));
+                        : caption ?? t('Mic'), tooltipDisabled: tooltipDisabled, children: jsxRuntime.jsxs(CompositeButton, { active: optimisticIsMute, caption: caption, variant: "secondary", disabled: !hasBrowserPermission || !hasPermission, "data-testid": optimisticIsMute ? 'audio-unmute-button' : 'audio-mute-button', onClick: handleClick, Menu: Menu, menuPlacement: menuPlacement, menuOffset: 16, ...restCompositeButtonProps, onMenuToggle: (shown) => {
+                        setTooltipDisabled(shown);
+                        onMenuToggle?.(shown);
+                    }, children: [jsxRuntime.jsx(Icon, { icon: optimisticIsMute ? 'mic-off' : 'mic' }), (!hasBrowserPermission || !hasPermission) && (jsxRuntime.jsx("span", { className: "str-video__no-media-permission", children: "!" }))] }) }) }) }));
 };
 
 const ToggleVideoPreviewButton = (props) => {
-    const { caption, Menu = DeviceSelectorVideo, menuPlacement = 'top', ...restCompositeButtonProps } = props;
+    const { caption, Menu = DeviceSelectorVideo, menuPlacement = 'top', onMenuToggle, ...restCompositeButtonProps } = props;
     const { t } = videoReactBindings.useI18n();
     const { useCameraState } = videoReactBindings.useCallStateHooks();
     const { camera, optimisticIsMute, hasBrowserPermission } = useCameraState();
@@ -1130,11 +1135,14 @@ const ToggleVideoPreviewButton = (props) => {
             ? t('Check your browser video permissions')
             : caption ?? t('Video'), tooltipDisabled: tooltipDisabled, children: jsxRuntime.jsxs(CompositeButton, { active: optimisticIsMute, caption: caption, className: clsx(!hasBrowserPermission && 'str-video__device-unavailable'), variant: "secondary", "data-testid": optimisticIsMute
                 ? 'preview-video-unmute-button'
-                : 'preview-video-mute-button', onClick: handleClick, disabled: !hasBrowserPermission, Menu: Menu, menuPlacement: menuPlacement, onMenuToggle: (shown) => setTooltipDisabled(shown), ...restCompositeButtonProps, children: [jsxRuntime.jsx(Icon, { icon: !optimisticIsMute ? 'camera' : 'camera-off' }), !hasBrowserPermission && (jsxRuntime.jsx("span", { className: "str-video__no-media-permission", title: t('Check your browser video permissions'), children: "!" }))] }) }));
+                : 'preview-video-mute-button', onClick: handleClick, disabled: !hasBrowserPermission, Menu: Menu, menuPlacement: menuPlacement, ...restCompositeButtonProps, onMenuToggle: (shown) => {
+                setTooltipDisabled(shown);
+                onMenuToggle?.(shown);
+            }, children: [jsxRuntime.jsx(Icon, { icon: !optimisticIsMute ? 'camera' : 'camera-off' }), !hasBrowserPermission && (jsxRuntime.jsx("span", { className: "str-video__no-media-permission", title: t('Check your browser video permissions'), children: "!" }))] }) }));
 };
 const ToggleVideoPublishingButton = (props) => {
     const { t } = videoReactBindings.useI18n();
-    const { caption, Menu = jsxRuntime.jsx(DeviceSelectorVideo, { visualType: "list" }), menuPlacement = 'top', ...restCompositeButtonProps } = props;
+    const { caption, Menu = jsxRuntime.jsx(DeviceSelectorVideo, { visualType: "list" }), menuPlacement = 'top', onMenuToggle, ...restCompositeButtonProps } = props;
     const { hasPermission, requestPermission, isAwaitingPermission } = useRequestPermission(videoClient.OwnCapability.SEND_VIDEO);
     const { useCameraState, useCallSettings } = videoReactBindings.useCallStateHooks();
     const { camera, optimisticIsMute, hasBrowserPermission } = useCameraState();
@@ -1157,7 +1165,10 @@ const ToggleVideoPublishingButton = (props) => {
                             ? t('Video publishing is disabled by the system')
                             : caption || t('Video'), tooltipDisabled: tooltipDisabled, children: jsxRuntime.jsxs(CompositeButton, { active: optimisticIsMute, caption: caption, variant: "secondary", disabled: !hasBrowserPermission ||
                         !hasPermission ||
-                        !isPublishingVideoAllowed, "data-testid": optimisticIsMute ? 'video-unmute-button' : 'video-mute-button', onClick: handleClick, Menu: Menu, menuPlacement: menuPlacement, menuOffset: 16, onMenuToggle: (shown) => setTooltipDisabled(shown), ...restCompositeButtonProps, children: [jsxRuntime.jsx(Icon, { icon: optimisticIsMute ? 'camera-off' : 'camera' }), (!hasBrowserPermission ||
+                        !isPublishingVideoAllowed, "data-testid": optimisticIsMute ? 'video-unmute-button' : 'video-mute-button', onClick: handleClick, Menu: Menu, menuPlacement: menuPlacement, menuOffset: 16, ...restCompositeButtonProps, onMenuToggle: (shown) => {
+                        setTooltipDisabled(shown);
+                        onMenuToggle?.(shown);
+                    }, children: [jsxRuntime.jsx(Icon, { icon: optimisticIsMute ? 'camera-off' : 'camera' }), (!hasBrowserPermission ||
                             !hasPermission ||
                             !isPublishingVideoAllowed) && (jsxRuntime.jsx("span", { className: "str-video__no-media-permission", children: "!" }))] }) }) }) }));
 };
@@ -2601,7 +2612,7 @@ const LivestreamPlayer = (props) => {
     return (jsxRuntime.jsx(StreamCall, { call: call, children: jsxRuntime.jsx(LivestreamLayout, { ...layoutProps }) }));
 };
 
-const [major, minor, patch] = ("1.2.4" ).split('.');
+const [major, minor, patch] = ("1.2.6" ).split('.');
 videoClient.setSdkInfo({
     type: videoClient.SfuModels.SdkType.REACT,
     major,