React Base Fiddle (JSX)

Starting point for creating JSFiddles with React. This uses React with Addons.

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.24/browser.js"></script>
<script src="https://npmcdn.com/react@latest/dist/react-with-addons.js"></script>
<script src="https://npmcdn.com/react-dom@latest/dist/react-dom.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-bootstrap/0.30.4/react-bootstrap.min.js"></script>
<script src="https://facebook.github.io/react/js/jsfiddle-integration-babel.js"></script>

<div id="container">
    <!-- This element's contents will be replaced with your component. -->
</div>

JavaScript 1.7

const ExternalLink = (props) => {
  const {children, href, title} = props;
  return (
    <a
      href={href}
      rel="noopener noreferrer"
      target="_blank"
      title={title}>
      {children}
    </a>
  );
};

ExternalLink.displayName = "ExternalLink";

ExternalLink.propTypes = {
  children: React.PropTypes.node,
  href: React.PropTypes.string,
  title: React.PropTypes.string,
};

const Overlay = React.createClass({
  render: function() {
    return (
 			<ReactBootstrap.OverlayTrigger
        overlay={<ReactBootstrap.Popover id="123" title="Some title">Some text</ReactBootstrap.Popover>}
        placement="left"
        trigger={["hover", "focus"]}>
        <ExternalLink href="https://example.com">
          123
        </ExternalLink>
      </ReactBootstrap.OverlayTrigger>
    );
  }
});
ReactDOM.render(
  <Overlay />,
  document.getElementById('container')
);