/**
 * @todo should be a simple styled component, 1 for each
 */
import * as React from 'react';
import { wording, qa } from './fixture';
import { StyledSocialLoginButton } from './styled';
class SocialSignInButton extends React.PureComponent {
    get provider() {
        const { google, facebook, twitter } = this.props;
        if (google) {
            return 'google';
        }
        if (facebook) {
            return 'facebook';
        }
        if (twitter) {
            return 'twitter';
        }
        return 'unknown';
    }
    get className() {
        const provider = this.provider;
        return `button social-signin-button-${provider} 
      social-signin-button signin-with-${provider} 
      social ${provider} 
      ${this.props.className || ''}`;
    }
    render() {
        const { google, facebook, twitter, ...remainingProps } = this.props;
        const signInText = facebook
            ? wording.signInWithFacebook
            : google
                ? wording.signInWithGoogle
                : wording.signInWithTwitter;
        const dataQa = facebook
            ? qa.signInWithFacebook
            : google
                ? qa.signInWithGoogle
                : qa.signInWithTwitter;
        return (React.createElement(StyledSocialLoginButton, Object.assign({ qa: dataQa, text: signInText }, remainingProps, { className: this.className })));
    }
}
export { SocialSignInButton };
export default SocialSignInButton;
//# sourceMappingURL=SocialSignInButton.js.map