Just a simple react-component that styles the anchor-element into a nice button.

And just some nice extra features:

• you can disable the anchor-functionality by setting this.props.disabled to true
• you can give it the initial focus, by specifying this.props.autoFocus to true

How to use:

"use strict";

require("itsa-react-anchorbutton/css/component.scss");

const React = require("react"),
    ReactDOM = require("react-dom"),
    Component = require("itsa-react-anchorbutton");

const props = {
    autoFocus: true,
    href: "http://itsaserver.io"
};

const ContainerComponent = React.createClass({
    render() {
        return (
            <Component {...this.props} >
                Click me and visit http://itsaserver.io
            </Component>
        );
    }
});

ReactDOM.render(
    <ContainerComponent {...props} />,
    document.getElementById("component-container")
);

About the css

You need the right css in order to make use of itsa-react-anchorbutton. There are 2 options:

1. You can use the css-files inside the css-folder.
2. You can use: Component = require("itsa-react-anchorbutton/lib/component-styled.jsx"); and build your project with webpack. This is needed, because you need the right plugin to handle a requirement of the scss-file.

View live example

API

If you want to express your appreciation

Feel free to donate to one of these addresses; my thanks will be great :)

• Ether: 0xE096EBC2D19eaE7dA8745AA5D71d4830Ef3DF963
• Bitcoin: 37GgB6MrvuxyqkQnGjwxcn7vkcdont1Vmg