moq-ui/lib/icons/plus-icon.js

Simple, customizable UI components built with React

var React = require('react');

var PlusIcon = React.createClass({displayName: "PlusIcon",

  getDefaultProps: function() {
    return {
      style: {
        color: '#000000'
      }
    }
  },

  getStyles: function() {
    return {
      svg: {
        width: '100%',
        height: '100%'
      },
      path: {
        fill: 'none',
        stroke: this.props.style.color,
        strokeWidth: 3,
        strokeLinecap: 'round',
        strokeLinejoin: 'round'
      }
    };
  },

  getTransform: function() {
    var factor = 0.8
      , x = -7 * (factor - 1)
      , y = -7 * (factor - 1);

    return "scale(" + factor + ") translate(" + x + " " + y + ") rotate(45, 7, 7)";
  },

  render: function() {
    var styles = this.getStyles();
    var transform = this.getTransform()

    return (
      React.createElement("svg", {viewBox: "0 0 14 14", style: styles.svg}, 
        React.createElement("g", {style: styles.path, transform: transform}, 
          React.createElement("path", {
             d: "m 3.5,3.5 7,7"}), 
          React.createElement("path", {
             d: "m 10.5,3.5 -7,7"})
        )
      )
    );
  }

});

module.exports = PlusIcon;