React protected email - simple stateless component to HEX encode displayed email addresses

ProtectedEmail.js

// @flow
import React from 'react';

import { createHtml, encode } from './utils';

import type { ProtectedEmailProps } from './types';

const ProtectedEmail = (props: ProtectedEmailProps) => (
  <span
    className="__react-protected-email"
    dangerouslySetInnerHTML={createHtml(encode(props.email), props.blank)}
  />
);

export default ProtectedEmail;

types.js

// @flow
export type ProtectedEmailProps = {
  email: string,
  blank?: boolean,
};

utils.js

// @flow
export const createHtml = (encoded: string, blank?: boolean) => ({
  __html: `<a href="mailto:${encoded}" target="${
    blank ? '_blank' : '_self'
  }">${encoded}</a>`,
});

// https://gist.github.com/CatTail/4174511
export const encode = (email: string) => {
  const buffer = [];

  for (let i = email.length - 1; i >= 0; i--) {
    buffer.unshift(`&#${email.charCodeAt(i)};`);
  }

  return buffer.join('');
};