47 lines
1.3 KiB
JavaScript
47 lines
1.3 KiB
JavaScript
import Radium from 'radium'
|
|
import React, { Component } from 'react'
|
|
import PropTypes from 'prop-types'
|
|
import { sizeInfo } from './style'
|
|
|
|
// See https://www.flaticon.com/packs/free-basic-ui-elements
|
|
|
|
@Radium
|
|
export class Icon extends Component {
|
|
static propTypes = {
|
|
name: PropTypes.string.isRequired,
|
|
size: PropTypes.number,
|
|
margin: PropTypes.number,
|
|
style: PropTypes.object,
|
|
}
|
|
|
|
static defaultProps = {
|
|
size: 50,
|
|
margin: sizeInfo.iconDefaultMargin,
|
|
}
|
|
|
|
static svgs = {
|
|
logout: require('icons/logout.svg'),
|
|
thumb: require('icons/thumb.svg'),
|
|
profile: require('icons/profile.svg'),
|
|
admin: require('icons/admin.svg'),
|
|
hand: require('icons/hand.svg'),
|
|
users: require('icons/users.svg'),
|
|
teams: require('icons/teams.svg'),
|
|
system: require('icons/system.svg'),
|
|
confirmed: require('icons/confirmed.svg'),
|
|
help: require('icons/help.svg'),
|
|
warning: require('icons/warning.svg'),
|
|
edit: require('icons/edit.svg'),
|
|
placeholder: require('icons/placeholder.svg'),
|
|
}
|
|
|
|
render() {
|
|
let { size, name, margin, style } = this.props
|
|
let source = Icon.svgs[name] || Icon.svgs['placeholder']
|
|
|
|
size -= margin * 2
|
|
|
|
return <img style={[{ width: size, height: size, margin }, style]} src={source} />
|
|
}
|
|
}
|