-
Notifications
You must be signed in to change notification settings - Fork 21
/
icon.nunjucks
105 lines (91 loc) · 2.22 KB
/
icon.nunjucks
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
/* eslint-disable */
// {{comment}}
{% if radium %}
import Radium from 'radium';
{%- endif %}
{% if reactPureRender %}
import React, {PureComponent as Component} from 'react';
{%- else %}
import React, {Component} from 'react';
{%- endif %}
import PropTypes from 'prop-types';
const iconList = [
{%- for icon in icons %}
'{{icon.name}}',
{%- endfor %}
]
{% if radium %}
class {{componentName}} extends Component {
{%- else %}
export default class {{componentName}} extends Component {
{%- endif %}
static propTypes = {
className: PropTypes.string,
{%- if useColorProp %}
color: PropTypes.string,
{%- endif %}
height: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
width: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
kind: PropTypes.oneOf([
{%- for icon in icons %}
'{{icon.name}}',
{%- endfor %}
]).isRequired,
onClick: PropTypes.func,
preview: PropTypes.bool,
size: PropTypes.number,
style: PropTypes.oneOfType([
PropTypes.array,
PropTypes.object
]),
wrapperStyle: PropTypes.oneOfType([
PropTypes.array,
PropTypes.object
])
};
static defaultProps = {
{%- if useColorProp %}
color: '#000',
{%- endif %}
size: 32
}
render() {
const {kind, preview} = this.props
return preview ?
this.renderPreview() :
this.renderIcon(kind)
}
renderPreview() {
return (
<div>
{iconList.map(kind => this.renderPreviewKind(kind))}
</div>
)
}
renderIcon(kind) {
const {wrapperStyle} = this.props;
if (wrapperStyle)
return <div style={wrapperStyle}>{this.getIcon(kind)}</div>
return this.getIcon(kind)
}
renderPreviewKind(kind) {
return (
<div key={kind}>
<h3><Icon kind="{kind}" /></h3>
{this.renderIcon(kind)}
</div>
)
}
getIcon(kind) {
const {height, {{ 'color, ' if useColorProp }}onClick, size, style, width, className, ...rest} = this.props;
switch (kind) {
default: return null;
{% for icon in icons -%}
case ('{{icon.name}}'): return ({{icon.svg | safe}});
{% endfor -%}
}
}
}
{% if radium %}
export default Radium({{componentName}})
{%- endif %}