/**
 * Button for a header section.
 * @class ApSectionHeaderButton
 */

'use strict'

import React, {PropTypes as types} from 'react'
import classnames from 'classnames'
import {ApPureMixin} from 'apeman-react-mixin-pure'
import {ApTouchMixin} from 'apeman-react-mixin-touch'
import {ApIcon} from 'apeman-react-icon'

/** @lends ApSectionHeaderButton */
const ApSectionHeaderButton = React.createClass({

  // --------------------
  // Specs
  // --------------------

  propTypes: {
    icon: types.string,
    text: types.string
  },

  mixins: [
    ApPureMixin,
    ApTouchMixin
  ],

  statics: {
    EDIT_ICON: 'fa fa-edit'
  },

  getInitialState () {
    return {}
  },

  getDefaultProps () {
    return {
      icon: null,
      text: null
    }
  },

  render () {
    const s = this
    let { props } = s

    let className = classnames('ap-section-header-button', {
      'ap-section-header-lined': props.lined
    }, props.className)
    return (
      <a id={ props.id }
         title={ props.title }
         name={ props.name }
         href={ props.href }
         className={ className }
         style={ Object.assign({}, props.style) }
      >
        <ApIcon className={ classnames(props.icon) }/>
                <span className='apeman-section-header-button-text'>
                    { props.text }
                </span>
        { props.children }
      </a>
    )
  }

  // --------------------
  // Lifecycle
  // --------------------

  // --------------------
  // Private
  // --------------------

})

export default ApSectionHeaderButton