cncjs

1
import PropTypes from 'prop-types';
2
import React from 'react';
3

4
const Margin = ({ style, ...props }) => {
5
  style = { ...style };
6
  const { v = 0, h = 0, top = 0, right = 0, bottom = 0, left = 0, ...others } = { ...props };
7

8
  if (v > 0) {
9
    style.marginTop = v;
10
    style.marginBottom = v;
11
  }
12
  if (h > 0) {
13
    style.marginLeft = h;
14
    style.marginRight = h;
15
  }
16
  if (top > 0) {
17
    style.marginTop = top;
18
  }
19
  if (right > 0) {
20
    style.marginRight = right;
21
  }
22
  if (bottom > 0) {
23
    style.marginBottom = bottom;
24
  }
25
  if (left > 0) {
26
    style.marginLeft = left;
27
  }
28

29
  return (
30
    <div style={style} {...others} />
31
  );
32
};
33

34
Margin.propTypes = {
35
  v: PropTypes.number,
36
  h: PropTypes.number,
37
  top: PropTypes.number,
38
  right: PropTypes.number,
39
  bottom: PropTypes.number,
40
  left: PropTypes.number
41
};
42

43
export default Margin;
44