// @flow import * as React from 'react'; const URL_REGEX = new RegExp( '^https://gist.github.com/([a-zd](?:[a-zd]|-(?=[a-zd])){0,38})/(.*)$' ); type Props = { url: string, }; class Gist extends React.Component { iframeNode: ?HTMLIFrameElement; static ENABLED = [URL_REGEX]; componentDidMount() { this.updateIframeContent(); } get id() { const gistUrl = new URL(this.props.url); return gistUrl.pathname.split('/')[2]; } updateIframeContent() { const id = this.id; const iframe = this.iframeNode; if (!iframe) return; // $FlowFixMe let doc = iframe.document; if (iframe.contentDocument) doc = iframe.contentDocument; else if (iframe.contentWindow) doc = iframe.contentWindow.document; const gistLink = `https://gist.github.com/${id}.js`; const gistScript = ``; const styles = ''; const iframeHtml = `${ styles }${gistScript}`; doc.open(); doc.writeln(iframeHtml); doc.close(); } render() { const id = this.id; return (