1 | import _defineProperty from 'babel-runtime/helpers/defineProperty';
|
2 | import _extends from 'babel-runtime/helpers/extends';
|
3 | import _objectWithoutProperties from 'babel-runtime/helpers/objectWithoutProperties';
|
4 | import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
|
5 | import _createClass from 'babel-runtime/helpers/createClass';
|
6 | import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
|
7 | import _inherits from 'babel-runtime/helpers/inherits';
|
8 | import * as React from 'react';
|
9 | import { generate, getSecondaryColor, isIconDefinition, log, MiniMap, withSuffix } from '../utils';
|
10 | var twoToneColorPalette = {
|
11 | primaryColor: '#333',
|
12 | secondaryColor: '#E6E6E6'
|
13 | };
|
14 |
|
15 | var Icon = function (_React$Component) {
|
16 | _inherits(Icon, _React$Component);
|
17 |
|
18 | function Icon() {
|
19 | _classCallCheck(this, Icon);
|
20 |
|
21 | return _possibleConstructorReturn(this, (Icon.__proto__ || Object.getPrototypeOf(Icon)).apply(this, arguments));
|
22 | }
|
23 |
|
24 | _createClass(Icon, [{
|
25 | key: 'render',
|
26 | value: function render() {
|
27 | var _extends2;
|
28 |
|
29 | var _props = this.props,
|
30 | type = _props.type,
|
31 | className = _props.className,
|
32 | onClick = _props.onClick,
|
33 | style = _props.style,
|
34 | primaryColor = _props.primaryColor,
|
35 | secondaryColor = _props.secondaryColor,
|
36 | rest = _objectWithoutProperties(_props, ['type', 'className', 'onClick', 'style', 'primaryColor', 'secondaryColor']);
|
37 |
|
38 | var target = void 0;
|
39 | var colors = twoToneColorPalette;
|
40 | if (primaryColor) {
|
41 | colors = {
|
42 | primaryColor: primaryColor,
|
43 | secondaryColor: secondaryColor || getSecondaryColor(primaryColor)
|
44 | };
|
45 | }
|
46 | if (isIconDefinition(type)) {
|
47 | target = type;
|
48 | } else if (typeof type === 'string') {
|
49 | target = Icon.get(type, colors);
|
50 | if (!target) {
|
51 |
|
52 | return null;
|
53 | }
|
54 | }
|
55 | if (!target) {
|
56 | log('type should be string or icon definiton, but got ' + type);
|
57 | return null;
|
58 | }
|
59 | if (target && typeof target.icon === 'function') {
|
60 | target = _extends({}, target, {
|
61 | icon: target.icon(colors.primaryColor, colors.secondaryColor)
|
62 | });
|
63 | }
|
64 | return generate(target.icon, 'svg-' + target.name, _extends((_extends2 = {
|
65 | className: className,
|
66 | onClick: onClick,
|
67 | style: style
|
68 | }, _defineProperty(_extends2, 'data-icon', target.name), _defineProperty(_extends2, 'width', '1em'), _defineProperty(_extends2, 'height', '1em'), _defineProperty(_extends2, 'fill', 'currentColor'), _defineProperty(_extends2, 'aria-hidden', 'true'), _defineProperty(_extends2, 'focusable', 'false'), _extends2), rest));
|
69 | }
|
70 | }], [{
|
71 | key: 'add',
|
72 | value: function add() {
|
73 | var _this2 = this;
|
74 |
|
75 | for (var _len = arguments.length, icons = Array(_len), _key = 0; _key < _len; _key++) {
|
76 | icons[_key] = arguments[_key];
|
77 | }
|
78 |
|
79 | icons.forEach(function (icon) {
|
80 | _this2.definitions.set(withSuffix(icon.name, icon.theme), icon);
|
81 | });
|
82 | }
|
83 | }, {
|
84 | key: 'clear',
|
85 | value: function clear() {
|
86 | this.definitions.clear();
|
87 | }
|
88 | }, {
|
89 | key: 'get',
|
90 | value: function get(key) {
|
91 | var colors = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : twoToneColorPalette;
|
92 |
|
93 | if (key) {
|
94 | var target = this.definitions.get(key);
|
95 | if (target && typeof target.icon === 'function') {
|
96 | target = _extends({}, target, {
|
97 | icon: target.icon(colors.primaryColor, colors.secondaryColor)
|
98 | });
|
99 | }
|
100 | return target;
|
101 | }
|
102 | }
|
103 | }, {
|
104 | key: 'setTwoToneColors',
|
105 | value: function setTwoToneColors(_ref) {
|
106 | var primaryColor = _ref.primaryColor,
|
107 | secondaryColor = _ref.secondaryColor;
|
108 |
|
109 | twoToneColorPalette.primaryColor = primaryColor;
|
110 | twoToneColorPalette.secondaryColor = secondaryColor || getSecondaryColor(primaryColor);
|
111 | }
|
112 | }, {
|
113 | key: 'getTwoToneColors',
|
114 | value: function getTwoToneColors() {
|
115 | return _extends({}, twoToneColorPalette);
|
116 | }
|
117 | }]);
|
118 |
|
119 | return Icon;
|
120 | }(React.Component);
|
121 |
|
122 | Icon.displayName = 'IconReact';
|
123 | Icon.definitions = new MiniMap();
|
124 | export default Icon; |
\ | No newline at end of file |