UNPKG

4.8 kBJavaScriptView Raw
1import _defineProperty from 'babel-runtime/helpers/defineProperty';
2import _extends from 'babel-runtime/helpers/extends';
3import _objectWithoutProperties from 'babel-runtime/helpers/objectWithoutProperties';
4import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
5import _createClass from 'babel-runtime/helpers/createClass';
6import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
7import _inherits from 'babel-runtime/helpers/inherits';
8import * as React from 'react';
9import { generate, getSecondaryColor, isIconDefinition, log, MiniMap, withSuffix } from '../utils';
10var twoToneColorPalette = {
11 primaryColor: '#333',
12 secondaryColor: '#E6E6E6'
13};
14
15var 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 // log(`Could not find icon: ${type}`);
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
122Icon.displayName = 'IconReact';
123Icon.definitions = new MiniMap();
124export default Icon;
\No newline at end of file