Rev.registerComponent 'TabsAccordion',

  getDefaultProps: ->
    props =
      onChange: () -> # noop
      activeKey: null

  getInitialState: ->
    children = @getNormalizedChildren()

    activeTabKey = @props.activeKey
    activeTabKey ||= children[0].key if children.length > 0

    state =
      activeTabKey: activeTabKey

  render: ->
    children = @getNormalizedChildren()
    <ul className="RevAccordion accordion">{children.map @renderChild}</ul>

  renderChild: (child) ->
    key = child.key

    active = key == @state.activeTabKey

    className = @classSet
      "RevTabsAccordion": true
      "RevTabsAccordion is-active": true
      "accordion-navigation": true
      "active": active

    tab = React.addons.cloneWithProps child.props.tab,
      onClick: @handleTabClick child

    content = React.addons.cloneWithProps child,
      active: active

    <li key={key} className={className}>
      {tab}
      {content}
    </li>

  handleTabClick: (activeTab) -> (e) =>
    e.preventDefault()
    e.stopPropagation()
    @setState
      activeTabKey: activeTab.key
    e.activeTab = activeTab
    @props.onChange(e)