import React, { useCallback, useState } from 'react';
import { useTranslation } from 'react-i18next';
import { StyleSheet, View, Text, useWindowDimensions } from 'react-native';
import QRCode from 'react-native-qrcode-svg';
import { useTheme } from '../../contexts/theme';
import { testIdWithKey } from '../../utils/testable';
const QRRenderer = _ref => {
  let {
    value,
    onError,
    size
  } = _ref;
  const {
    width
  } = useWindowDimensions();
  const {
    t
  } = useTranslation();
  const {
    ColorPallet
  } = useTheme();
  const styles = StyleSheet.create({
    container: {
      flexGrow: 1,
      marginVertical: 20,
      backgroundColor: 'white'
    },
    errorMessage: {
      color: ColorPallet.semantic.error,
      textAlign: 'center'
    }
  });
  const [isInvalidQR, setIsInvalidQR] = useState(false);
  const handleQRCodeGenerationError = useCallback(() => {
    setIsInvalidQR(true);
    if (onError) {
      onError();
    }
  }, [onError]);
  const qrSize = size ?? width - 80;
  return /*#__PURE__*/React.createElement(View, {
    style: styles.container,
    testID: testIdWithKey('QRRenderer')
  }, /*#__PURE__*/React.createElement(QRCode, {
    ecl: "L",
    value: value,
    size: qrSize,
    onError: handleQRCodeGenerationError
  }), isInvalidQR && /*#__PURE__*/React.createElement(Text, {
    style: styles.errorMessage
  }, t('QRRender.GenerationError')));
};
export default QRRenderer;
//# sourceMappingURL=QRRenderer.js.map