react-svg-inline


> A react component to clean and display raw SVGs.

Install

``console
$ npm install react-svg-inline
`

You might also need to npm install raw-loader if you want to use this with
webpack.

Usage

Here is an example of a usage in a React stateless component:

`js
import React from "react"
import SVGInline from "react-svg-inline"

export default () => (



)
`

Webpack to require() SVGs

Use the raw-loader to require() raw SVGs files and pass them to
react-svg-inline.

`js
module.exports = {
loaders: [
{
test: /\.svg$/,
loader: 'raw-loader'
}
]
}

`

`js
import React from "react"
import SVGInline from "react-svg-inline"
import iconSVG from "./myicon.svg"

export default () => (



)
`

Options (props)

$3

PropTypes.string

Class name used for the component that will wrap the SVG.

$3

PropTypes.string

The class suffix that will be added to the svg className (default: "-svg").

$3

PropTypes.oneOfType([
PropTypes.string,
PropTypes.func,
]),

The component that will wrap the svg (default: span).

$3

PropTypes.string.isRequired

$3

PropTypes.string

Color to use

$3

PropTypes.oneOfType([
PropTypes.bool,
PropTypes.array,
])

This allow you to cleanup (remove) some svg attributes.
Here are the supported value that can be removed:

- title
- desc
- comment
- defs
- width
- height
- fill
- sketchMSShapeGroup
- sketchMSPage
- sketchMSLayerGroup

If cleanup === true, it will remove all the attributes above.

$3

PropTypes.array

This allow you to whitelist some svg attributes to keep while cleaning some
others.

$3

PropTypes.string

$3

PropTypes.string

$3

PropTypes.string

This value is added as an svg