Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

react-svg-sprite-icon

Package Overview
Dependencies
Maintainers
4
Versions
13
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

react-svg-sprite-icon

A React icon component that generates a SVG sprite on the fly

  • 0.1.0
  • latest
  • Source
  • npm
  • Socket score

Version published
Maintainers
4
Created
Source

React SVG Sprite Icon

A React icon component that generates a SVG sprite on the fly

NPM version Build Status Dependency Status

Installation

npm install --save react-svg-sprite-icon

Usage

React SVG Sprite Icon provides two components, one ES6 Class and one stateless function.

If you're unsure which one to use, use the class.

import { IconClass as Icon } from 'react-svg-sprite-icon';
import iconClose from 'svg-icon-template-loader!./close.svg';

const Foo = React.createClass({
  render() {
    return (
      <div>
        <h1>Icon</h1>
        <Icon name="close" svg={ iconClose } stroke="#ff0000" />
      </div>
    );
  }
});

Options

All options are passed to the component via props.

name (is required)

The name of the icon, the class and ID are based on this so keep it meaningful.

svg (is required)

The function returned by svg-icon-template-loader.

fill

The fill override that is passed to the svg-icon-template-loader function.

stroke

The stroke override that is passed to the svg-icon-template-loader function.

strokeWidth

The stroke width override that is passed to the svg-icon-template-loader function.

width

The width of the icon.

height

The height of the icon.

style

A style object that'll be applied to the root icon element.

className

A class name that'll be applied to the root icon element.

spriteId

The ID of the SVG sprite that is added to the root of the document, svg-icon-container by default.

componentClass

The type of element of the root icon element, a span by default.

License

This open source project released by Nordnet is licensed under the MIT license.

MIT (http://www.opensource.org/licenses/mit-license.php)

Keywords

FAQs

Package last updated on 24 Feb 2017

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc