All files / hourly-chart/components/ColorIcon index.jsx

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
 
 
 
 
 
 
 
 
 
 
 
1x
 
 
 
 
 
 
 
 
1x
 
 
 
 
 
 
 
 
 
1x
 
 
 
 
1x
 
 
 
 
 
 
import React from 'react';
import PropTypes from 'prop-types';
 
import {
  color,
} from '@bufferapp/analyze-shared-components/style';
 
import {
  geyser,
} from '@bufferapp/components/style/color';
 
const style = {
  display: 'inline-block',
  verticalAlign: 'baseline',
  width: '10px',
  height: '10px',
  marginRight: '5px',
  borderRadius: '1px',
};
 
const ColorIcon = ({ metric, circle }) => (
  <i
    style={{
      ...style,
      borderRadius: circle ? '50%' : null,
      background: color[metric] || geyser,
    }}
  />
);
 
ColorIcon.defaultProps = {
  metric: null,
  circle: false,
};
 
ColorIcon.propTypes = {
  metric: PropTypes.string,
  circle: PropTypes.bool,
};
 
export default ColorIcon;