Skip to content

Instantly share code, notes, and snippets.

@rozsival
Last active May 15, 2018 22:32
Show Gist options
  • Save rozsival/bf029ab75b1706d37c5464d78625b983 to your computer and use it in GitHub Desktop.
Save rozsival/bf029ab75b1706d37c5464d78625b983 to your computer and use it in GitHub Desktop.
React protected email - simple stateless component to HEX encode displayed email addresses
// @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;
// @flow
export type ProtectedEmailProps = {
email: string,
blank?: boolean,
};
// @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('');
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment