react-toolbox/components/tabs/tab.cjsx

42 lines
1.1 KiB
CoffeeScript

localCSS = require './style'
module.exports = React.createClass
# -- States & Properties
propTypes:
active : React.PropTypes.boolean
className : React.PropTypes.string
disabled : React.PropTypes.boolean
hidden : React.PropTypes.boolean
label : React.PropTypes.string.required
onActive : React.PropTypes.func
tabIndex : React.PropTypes.number
getDefaultProps: ->
className : ""
# -- Lifecycle
componentDidMount: ->
@active @props.active
componentWillReceiveProps: (next_props) ->
@active next_props.active if next_props.active
# -- Render
render: ->
className = @props.className
className += ' active' if @props.active
className += ' disabled' if @props.disabled
className += ' hidden' if @props.hidden
<section data-react-toolbox='tab'
className={localCSS.tab + ' ' + className}
data-flex='vertical'
tabIndex={@props.tabIndex}>
{ @props.children }
</section>
# -- Extends
active: (value) ->
@setState active: value
@props.onActive? @ if value