var React = require('react');
var Styled = require('react-styled');
 
// Somehow get index.css contents, webpack for example:
var styled = new Styled(require('css!./index.css'));
 
var Button = React.createClass({
    getInitialState: function() {
        return {pressed: 'no'};
    },
 
    onMouseUp: function () {
        this.setState({pressed: 'no'});
    },
 
    onMouseLeave: function () {
        this.setState({pressed: 'no'});
    },
 
    onMouseDown: function () {
        this.setState({pressed: 'yes'});
    },
 
    render: styled(function () {
        var button = (
            <button>
                <span>{this.props.children}</span>
            </button>
        );
 
        var link = (
            <a>
                <span>{this.props.children}</span>
            </a>
        );
 
        return this.props.url ? button : link;
    })
});