Emberjs nested components jquery on initialization

I keep running into problems with nested components in EmberJS with component initialization. I am trying to use jquery.steps (http://ift.tt/18F2BGV) to create a wizard.

I have a wizard component, and I want to have each step as a component which can have actions to change the view for the wizard step. However, after initializing jquery.steps, my events are being detected but the view is not changing in the wizard.

I expect the value of {{temp}} to change in the view depending on the radio button that was selected. This works if I do not instantiate $().steps in the parent component, but stops working if I do instantiate jquery.steps. What could be going on here? And how do I get it to work? I tried using Ember.run in various ways to execute loadSteps() to no avail.

wizard.js

import Ember from 'ember';

export default Ember.Component.extend({
  temp: null,

  didInsertElement: function () {
    this._super();
    this.loadSteps();
  },
  loadSteps: function () {
    this.$().steps({
      headerTag: "h3",
      bodyTag: "section",
      transitionEffect: "slideLeft",
      autoFocus: true
    });
  },

  actions: {
    addByHandSelected: function () {
      this.set('temp', true);
    },
    setupSheetSelected: function () {
      this.set('temp', false);
      //TODO: show file input
    },
    removeStep: function (step) {
      this.$().steps("remove", step);
    },
    addStep: function (step) {
      this.$().steps("add", step);
    },
  }
});

wizard.hbs

{{creation-method-wizard-step addByHandSelected='addByHandSelected' setupSheetSelected='setupSheetSelected'}}
{{label-size-wizard-step}}

creation-method-wizard-step.js

import Ember from 'ember';

export default Ember.Component.extend({
  tagName:'',
  temp: true,
  actions: {
    addByHandSelected: function () {
      this.set('temp',false);
    },
    setupSheetSelected: function () {
      this.set('temp',true);
    }
  }
});

creation-method-wizard-step.hbs

<h3>Creation Method</h3>
<section>
<div class="radio">
{{#radio-button  value="hand" name='creationMethod' groupValue=creationMethod changed="addByHandSelected"}}Enter By Hand{{/radio-button}}
</div>
    <div class="radio">
      {{#radio-button value="setupSheet" name='creationMethod' groupValue=creationMethod changed="setupSheetSelected"}}Use Setup
          Sheet{{/radio-button}}
    </div>
    Temp is {{temp}}
</section>