import Component from '@ember/component'
import { alias } from '@ember/object/computed'
import { computed, observer } from '@ember/object'

import HasParent from 'leaf-semantic-core/mixins/leaf-has-parent'
import layout from 'leaf-semantic-core/templates/components/leaf-wizard-step'

WizardStep = Component.extend(HasParent,
  layout: layout

  tagName: 'li'
  selectable: false
  classNameBindings: ['completed', 'active', 'hide']

  #
  #
  #
  mandatoryParent: true


  #
  # true if this nav is active/selected
  #
  active: alias('selected')

  #
  #
  #
  completed: computed('parent.completed-steps.[]', 'idx', ->
    @get('parent.completed-steps').includes(@get('idx')) if @get('parent')
  )


  actions:
    stepTo: ->
      if @get('completed') && (parent = @get('parent'))
        parent.stepTo(this)

)

export default WizardStep