apeman-react-select/lib/ap_select_item.jsx

apeman react package for select component.

/**
 * Item component
 * @class ApSelectItem
 */

'use strict'

import React, { Component, PropTypes as types } from 'react'
import { shallowEqual } from 'asobj'
import { withTouch } from 'apeman-react-touchable'
import classnames from 'classnames'

/** @lends ApSelectItem */
class ApSelectItem extends Component {
  render () {
    const s = this
    let { props } = s
    let hasChildren = React.Children.count(props.children) > 0
    return (
      <a className={ classnames('ap-select-item', {
        'ap-select-item-focused': props.focused
      }) }>{ hasChildren ? props.children : props.label }</a>
    )
  }

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

  shouldComponentUpdate (nextProps, nextState) {
    const s = this
    let { props, state } = s
    return !shallowEqual(props, nextProps) || shallowEqual(state, nextState)
  }
}
Object.assign(ApSelectItem, {

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

  propTypes: {
    /** Data for event */
    data: types.string,
    /** Item label text */
    label: types.string,
    /** Focused or not */
    focused: types.bool
  },

  defaultProps: {
    label: null,
    data: null,
    focused: false
  }
})

export { ApSelectItem }
export default withTouch(ApSelectItem, {
  getTouchData () {
    const s = this
    let { props } = s
    return props.data
  }
})