@100mslive/react-native-room-kit/lib/module/components/QuizEndOptionsView.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, Text, View } from 'react-native';
import { useHMSRoomStyleSheet } from '../hooks-util';
import { CheckIcon } from '../Icons';
export const QuizEndOptionsView = ({
  option,
  isSelected,
  isCorrect
}) => {
  const hmsRoomStyles = useHMSRoomStyleSheet((theme, typography) => ({
    surfaceHighRegularText: {
      color: theme.palette.on_surface_high,
      fontFamily: `${typography.font_family}-Regular`
    },
    surfaceMediumRegularText: {
      color: theme.palette.on_surface_medium,
      fontFamily: `${typography.font_family}-Regular`
    }
  }));
  return /*#__PURE__*/React.createElement(View, {
    style: styles.container
  }, /*#__PURE__*/React.createElement(View, {
    style: styles.textWrapper
  }, isCorrect ? /*#__PURE__*/React.createElement(CheckIcon, {
    style: styles.icon,
    type: "in-circle"
  }) : null, /*#__PURE__*/React.createElement(Text, {
    style: [styles.smallText, hmsRoomStyles.surfaceHighRegularText]
  }, option.text)), isSelected ? /*#__PURE__*/React.createElement(Text, {
    style: [styles.smallText, hmsRoomStyles.surfaceMediumRegularText]
  }, "Your Answer") : null);
};
const styles = StyleSheet.create({
  container: {
    marginBottom: 16,
    flexDirection: 'row',
    alignItems: 'center',
    justifyContent: 'space-between'
  },
  textWrapper: {
    flexDirection: 'row',
    alignItems: 'center'
  },
  icon: {
    width: 20,
    height: 20,
    marginRight: 8
  },
  smallText: {
    fontSize: 14,
    lineHeight: 20
  }
});
//# sourceMappingURL=QuizEndOptionsView.js.map