email-prop-type

Introduction

This package is used to validate if a React Prop value is a valid email address.

Currently, there is no email prop type defined by the prop-types package. While using PropType.string works, why not be as specific as possible when validating your props?

Additionally, though it's relatively straightforward to create a custom prop type validator, if you need to implement similar prop type checking in multiple packages, you might not want to repeat yourself.

Depends on the email-validator package.

Installation

npm install --save email-prop-type

As mentioned above, email-prop-type depends on the email-validator package. You need to install this package as a peer dependency of email-prop-type.

Example Usage

import React from 'react';
import PropTypes from 'prop-types';
import emailPropType from 'email-prop-type';
 
// Create a basic Hyperlink Component with a mailto href value
const Hyperlink = props => (
  <a href={`${mailto:props.emailAddress}`>{props.text}</a>
);
 
Hyperlink.propTypes = {
  text: PropTypes.string.isRequired,
  emailAddress: emailPropType.isRequired, // can also specify emailPropType if it is not required
};

Alternatives

I didn't see many alternatives:

• It doesn't look like the airbnb/prop-types project has email validation.
• There's also the react-validator-prop-types library but if you just want email validation, it might be too heavyweight.