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

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

import React from 'react';
import { View, Text, TouchableOpacity, StyleSheet } from 'react-native';
import { useHMSHLSPlayerStats } from '@100mslive/react-native-hms';
import { COLORS } from '../utils/theme';
export const HLSPlayerStatsView = ({
  onClosePress
}) => {
  const {
    stats
  } = useHMSHLSPlayerStats();
  return /*#__PURE__*/React.createElement(View, {
    style: styles.container
  }, /*#__PURE__*/React.createElement(TouchableOpacity, {
    onPress: () => onClosePress === null || onClosePress === void 0 ? void 0 : onClosePress(),
    style: styles.closeButton
  }, /*#__PURE__*/React.createElement(Text, {
    style: styles.text
  }, "close")), /*#__PURE__*/React.createElement(Text, {
    style: styles.text
  }, "Bandwidth Estimate: ", stats.bandWidthEstimate), /*#__PURE__*/React.createElement(Text, {
    style: styles.text
  }, "Total Bytes Loaded: ", stats.totalBytesLoaded), /*#__PURE__*/React.createElement(Text, {
    style: styles.text
  }, "Buffered Duration: ", stats.bufferedDuration), /*#__PURE__*/React.createElement(Text, {
    style: styles.text
  }, "Distance From Live: ", stats.distanceFromLive), /*#__PURE__*/React.createElement(Text, {
    style: styles.text
  }, "Dropped Frame Count: ", stats.droppedFrameCount), /*#__PURE__*/React.createElement(Text, {
    style: styles.text
  }, "Average Bitrate: ", stats.averageBitrate), /*#__PURE__*/React.createElement(Text, {
    style: styles.text
  }, "Video Height: ", stats.videoHeight), /*#__PURE__*/React.createElement(Text, {
    style: styles.text
  }, "Video Width: ", stats.videoWidth));
};
const styles = StyleSheet.create({
  container: {
    position: 'absolute',
    top: 8,
    left: 8,
    backgroundColor: COLORS.OVERLAY,
    borderRadius: 12,
    padding: 8,
    minWidth: '50%'
  },
  closeButton: {
    padding: 12
  },
  text: {
    fontSize: 14,
    lineHeight: 14 * 1.3,
    color: COLORS.TEXT.HIGH_EMPHASIS
  }
});
//# sourceMappingURL=HLSPlayerStatsView.js.map