/react-svgicon

React component for rendering inline SVG icons

Primary LanguageJavaScriptMIT LicenseMIT

react-svgicon

React component for rendering inline SVGs via an SVG sprite.

Installation

$ npm install react-svgicon --save

Usage

var Icon = require('react-svgicon');

var Example = React.createClass({
  render: function() {
    return {
      Icon({
        name: 'icon-clock',   // String | required | xlink-href of your inline SVG without the #
        className: 'myClass', // String | optional
        style: {}             // Object | optional
      })
    }
  }
});

Note: This library assumes you have already loaded your SVG sprite at the top of your <body> element like this:

<body>
  <svg xmlns="http://www.w3.org/2000/svg" class="is-hidden">
    <symbol viewBox="0 0 36 36" id="icon-clock">
      <!-- SVG path/polygon code here -->
    </symbol>
  </svg>
  <!-- rest of code -->
</body>

Contributing

  • Fork it
  • Create a feature branch 
    $ git checkout -b my-feature-branch
  • Create a pull request

Development

Building the example code:

$ npm run build:example

Compiling the src:

$ npm run prepublish

Run the specs:

$ npm test