import React, { useContext } from 'react'
import { Divider, ConfigProvider } from 'antd'
import './index.less'

const Header = (props) => {

  const { getPrefixCls } = useContext(ConfigProvider.ConfigContext)
  const prefixCls = getPrefixCls('pandaXform')

  const { title, value } = props

  return (
    <div>
      <div
        className={`${prefixCls}-title`}
        style={{ justifyContent: 'left', paddingLeft: '10px' }}
      >
        {title ? <i className={`${prefixCls}-bg`}></i> : null}
        {title}
      </div>
      {title ? <Divider /> : ''}
      {props.children}
    </div>
  )
}

export default Header