import React, { PureComponent } from "react";
import { Text } from "./Text";
import { connect } from "react-redux";
import { FontAwesome } from "./Icon";
import { COLOUR_GREEN, TEXT_DARK, getMainBrandingColourFromState } from "../colours";
import { MiddlePopup } from "./MiddlePopup";
import { InlineButton } from "./InlineButton";
class ConfirmationPopup extends PureComponent {
  render() {
    return /*#__PURE__*/React.createElement(MiddlePopup, {
      visible: this.props.visible,
      onClose: this.props.onClose,
      style: [styles.popup, this.props.style]
    }, /*#__PURE__*/React.createElement(FontAwesome, {
      style: styles.icon,
      name: "check-circle"
    }), /*#__PURE__*/React.createElement(Text, {
      style: styles.text
    }, this.props.confirmText), this.props.onPressAction && /*#__PURE__*/React.createElement(InlineButton, {
      onPress: this.props.onPressAction,
      color: this.props.colourBrandingMain,
      style: [styles.button, this.props.largeButtons && styles.largeButton],
      large: this.props.largeButtons
    }, this.props.repeatText), /*#__PURE__*/React.createElement(InlineButton, {
      onPress: this.props.onClose,
      color: "#fff",
      style: [styles.button, styles.closeButton, this.props.largeButtons && styles.largeButton, {
        borderColor: this.props.colourBrandingMain
      }],
      textStyle: {
        color: this.props.colourBrandingMain
      },
      large: this.props.largeButtons
    }, "Close"));
  }
}
const styles = {
  popup: {
    width: 280,
    paddingVertical: 40
  },
  icon: {
    fontSize: 52,
    color: COLOUR_GREEN
  },
  text: {
    fontFamily: "sf-bold",
    fontSize: 24,
    lineHeight: 24,
    color: TEXT_DARK,
    textAlign: "center",
    marginTop: 8
  },
  button: {
    width: 150,
    marginTop: 20
  },
  closeButton: {
    borderWidth: 1
  },
  largeButton: {
    width: 250
  }
};
const mapStateToProps = state => {
  return {
    colourBrandingMain: getMainBrandingColourFromState(state)
  };
};
const confirmationPopup = connect(mapStateToProps, {})(ConfirmationPopup);
export { confirmationPopup as ConfirmationPopup };
//# sourceMappingURL=ConfirmationPopup.js.map