@100mslive/react-native-room-kit/lib/module/components/PeerVideoTile/HMSFullScreenButton.js

100ms Room Kit provides simple & easy to use UI components to build Live Streaming & Video Conferencing experiences in your apps.

import * as React from 'react';
import { StyleSheet } from 'react-native';
import { useDispatch, useSelector } from 'react-redux';
import { PressableIcon } from '../PressableIcon';
import { MaximizeIcon, MinimizeIcon } from '../../Icons';
import { useHMSRoomStyle } from '../../hooks-util';
import { hexToRgbA } from '../../utils/theme';
import { setFullScreenPeerTrackNode } from '../../redux/actions';
export const HMSFullScreenButton = ({
  peerTrackNode
}) => {
  const dispatch = useDispatch();
  const fullScreenPeerTrackNode = useSelector(state => state.app.fullScreenPeerTrackNode);
  const buttonStyles = useHMSRoomStyle(theme => ({
    backgroundColor: theme.palette.background_dim && hexToRgbA(theme.palette.background_dim, 0.64)
  }));
  const maximizeAction = !fullScreenPeerTrackNode || fullScreenPeerTrackNode.id !== peerTrackNode.id;
  const handleFullScreenPress = () => {
    dispatch(setFullScreenPeerTrackNode(maximizeAction ? peerTrackNode : null));
  };
  return /*#__PURE__*/React.createElement(PressableIcon, {
    border: false,
    onPress: handleFullScreenPress,
    style: [styles.container, buttonStyles]
  }, maximizeAction ? /*#__PURE__*/React.createElement(MaximizeIcon, null) : /*#__PURE__*/React.createElement(MinimizeIcon, null));
};
const styles = StyleSheet.create({
  container: {
    position: 'absolute',
    top: 8,
    right: 8,
    padding: 8
  }
});
//# sourceMappingURL=HMSFullScreenButton.js.map