/**
*
* IKTextGroup
*
*/

import React, { PureComponent } from 'react';


class IKTextGroup extends PureComponent { // eslint-disable-line react/prefer-stateless-function
  static propTypes = {
    position: React.PropTypes.string,
    title: React.PropTypes.string,
    className: React.PropTypes.string,
  };

  constructor(props) {
    super(props);
  }

  render() {
    const props = $({}, this.props);

    let className = 'ikmd-text-group-container';
    let groupClassName = 'ikmd-text-group';
    let titleElm = null;

    if (props.title) {
      titleElm = (
        <div class="ikmd-text-group-header">{props.title}</div>
      );
    }

    if (props.position) {
      groupClassName += ` ikmd-text-group-${props.position}`;
    }

    if (props.className) {
      className += ` ${props.className}`;
    }

    return (
      <div className={className}>
        {titleElm}
        <div className={groupClassName}>
          {props.children}
        </div>
      </div>
    );
  }
}

export default IKTextGroup;
