import Radium from 'radium'
import PropTypes from 'prop-types'
import React, { Component } from 'react'
import { fontInfo } from './style'

class List extends Component {
  static propTypes = {
    size: PropTypes.string,
    margin: PropTypes.number,
    children: PropTypes.node
  }

  static defaultProps = {
    size: 'medium',
    margin: 0
  }

  render() {
    return (
      <span style={{
        display: 'inline-block',
        fontSize: fontInfo.size[this.props.size],
        fontFamily: fontInfo.family,
        margin: this.props.margin
      }}>{this.props.children}</span>
    )
  }
}

export default Radium(List)