Updates for compatibility with handlebars 2.0 and ember 1.9

Brocfile.js

@@ -1,17 +1,16 @@
-var moduleFilter = require('broccoli-dist-es6-module');
-var templateFilter = require('broccoli-template-compiler');
+var mergeTrees = require('broccoli-merge-trees'),
+    moduleFilter = require('broccoli-dist-es6-module'),
+    templateFilter = require('ember-cli-htmlbars');
 
-module.exports = function(broccoli) {
-  var tree = broccoli.makeTree('lib');
-  var templates = templateFilter(tree, {module: true});
-  var modules = moduleFilter(templates, {
-    global: 'ic.tabs',
-    packageName: 'ic-tabs',
-    main: 'main',
-    shim: {
-      'ember': 'Ember'
-    }
-  });
-  return modules;
-};
+var templates = templateFilter('lib');
 
+var dist = moduleFilter(templates, {
+      global: 'ic.tabs',
+      packageName: 'ic-tabs',
+      main: 'main',
+      shim: {
+        'ember': 'Ember'
+      }
+    });
+
+module.exports = mergeTrees([dist]);

bower.json

@@ -20,12 +20,15 @@
   ],
   "dependencies": {
     "ember": "^1.3.0",
-    "ic-styled": "~1.1.6"
+    "ic-styled": "^2.0.0"
   },
   "devDependencies": {
     "ember-qunit": "^0.1.3",
     "jquery-simulate": "https://raw.github.com/jquery/jquery-simulate/master/jquery.simulate.js",
     "ember-canary": "http://builds.emberjs.com/canary/ember.js",
-    "ic-styled": "~1.1.6"
+    "ic-styled": "^2.0.0"
+  },
+  "resolutions": {
+    "ember": ">= 1.8.1 < 2.0.0"
   }
-}
+}

dist/amd/tab-panel.js

@@ -82,18 +82,6 @@ define(
         return this.get('tab.active');
       }.property('tab.active'),
 
-      /**
-       * Shows or hides this panel depending on whether or not its active.
-       *
-       * @method toggleVisibility
-       * @private
-       */
-
-      toggleVisibility: function() {
-        var display = this.get('active') ? '' : 'none';
-        this.$().css('display', display);
-      }.observes('active'),
-
       /**
        * Registers with the TabsComponent.
        *

dist/cjs/tab-panel.js

@@ -79,18 +79,6 @@ exports["default"] = Component.extend({
     return this.get('tab.active');
   }.property('tab.active'),
 
-  /**
-   * Shows or hides this panel depending on whether or not its active.
-   *
-   * @method toggleVisibility
-   * @private
-   */
-
-  toggleVisibility: function() {
-    var display = this.get('active') ? '' : 'none';
-    this.$().css('display', display);
-  }.observes('active'),
-
   /**
    * Registers with the TabsComponent.
    *

dist/globals/main.js

@@ -269,18 +269,6 @@ exports["default"] = Component.extend({
     return this.get('tab.active');
   }.property('tab.active'),
 
-  /**
-   * Shows or hides this panel depending on whether or not its active.
-   *
-   * @method toggleVisibility
-   * @private
-   */
-
-  toggleVisibility: function() {
-    var display = this.get('active') ? '' : 'none';
-    this.$().css('display', display);
-  }.observes('active'),
-
   /**
    * Registers with the TabsComponent.
    *
@@ -491,16 +479,9 @@ exports["default"] = Component.extend({
 });
 },{}],5:[function(_dereq_,module,exports){
 "use strict";
-var Ember = window.Ember["default"] || window.Ember;
-exports["default"] = Ember.Handlebars.template(function anonymous(Handlebars,depth0,helpers,partials,data) {
-this.compilerInfo = [4,'>= 1.0.0'];
-helpers = this.merge(helpers, Ember.Handlebars.helpers); data = data || {};
-
-
-
-  data.buffer.push("ic-tabs,\nic-tab-list,\nic-tab-panel {\n  display: block\n}\n\nic-tab-list {\n  border-bottom: 1px solid #aaa;\n}\n\nic-tab {\n  display: inline-block;\n  padding: 6px 12px;\n  border: 1px solid transparent;\n  border-top-left-radius: 3px;\n  border-top-right-radius: 3px;\n  cursor: pointer;\n  margin-bottom: -1px;\n  position: relative;\n}\n\nic-tab[selected] {\n  border-color: #aaa;\n  border-bottom-color: #fff;\n}\n\nic-tab:focus {\n  box-shadow: 0 10px 0 0 #fff,\n              0 0 5px hsl(208, 99%, 50%);\n  border-color: hsl(208, 99%, 50%);\n  border-bottom-color: #fff;\n  outline: none;\n}\n\nic-tab:focus:before,\nic-tab:focus:after {\n  content: '';\n  position: absolute;\n  bottom: -6px;\n  width: 5px;\n  height: 5px;\n  background: #fff;\n}\n\nic-tab:focus:before {\n  left: -4px;\n}\n\nic-tab:focus:after {\n  right: -4px;\n}\n\n");
-
-});
+exports["default"] = Ember.Handlebars.template({"compiler":[6,">= 2.0.0-beta.1"],"main":function(depth0,helpers,partials,data) {
+  data.buffer.push("ic-tabs,\nic-tab-list {\n  display: block;\n}\n\nic-tab-panel {\n  display: none;\n}\n\nic-tab-list {\n  border-bottom: 1px solid #aaa;\n}\n\nic-tab {\n  display: inline-block;\n  padding: 6px 12px;\n  border: 1px solid transparent;\n  border-top-left-radius: 3px;\n  border-top-right-radius: 3px;\n  cursor: pointer;\n  margin-bottom: -1px;\n  position: relative;\n}\n\nic-tab[selected] {\n  border-color: #aaa;\n  border-bottom-color: #fff;\n}\n\nic-tab:focus {\n  box-shadow: 0 10px 0 0 #fff,\n              0 0 5px hsl(208, 99%, 50%);\n  border-color: hsl(208, 99%, 50%);\n  border-bottom-color: #fff;\n  outline: none;\n}\n\nic-tab:focus:before,\nic-tab:focus:after {\n  content: '';\n  position: absolute;\n  bottom: -6px;\n  width: 5px;\n  height: 5px;\n  background: #fff;\n}\n\nic-tab:focus:before {\n  left: -4px;\n}\n\nic-tab:focus:after {\n  right: -4px;\n}\n\nic-tab-panel.active {\n  display: block;\n}\n\n");
+  },"useData":true});
 },{}],6:[function(_dereq_,module,exports){
 "use strict";
 var Component = window.Ember.Component;

dist/named-amd/main.js

@@ -24,7 +24,8 @@ define("ic-tabs",
     __exports__.TabListComponent = TabListComponent;
     __exports__.TabPanelComponent = TabPanelComponent;
     __exports__.TabsComponent = TabsComponent;
-  });define("ic-tabs/tab-list",
+  });
+define("ic-tabs/tab-list",
   ["ember","exports"],
   function(__dependency1__, __exports__) {
     "use strict";
@@ -191,7 +192,8 @@ define("ic-tabs",
       }
 
     });
-  });define("ic-tabs/tab-panel",
+  });
+define("ic-tabs/tab-panel",
   ["ember","exports"],
   function(__dependency1__, __exports__) {
     "use strict";
@@ -275,18 +277,6 @@ define("ic-tabs",
         return this.get('tab.active');
       }.property('tab.active'),
 
-      /**
-       * Shows or hides this panel depending on whether or not its active.
-       *
-       * @method toggleVisibility
-       * @private
-       */
-
-      toggleVisibility: function() {
-        var display = this.get('active') ? '' : 'none';
-        this.$().css('display', display);
-      }.observes('active'),
-
       /**
        * Registers with the TabsComponent.
        *
@@ -303,7 +293,8 @@ define("ic-tabs",
       }.on('willDestroyElement')
 
     });
-  });define("ic-tabs/tab",
+  });
+define("ic-tabs/tab",
   ["ember","exports"],
   function(__dependency1__, __exports__) {
     "use strict";
@@ -497,21 +488,16 @@ define("ic-tabs",
 
 
     });
-  });define("ic-tabs/tabs-css",
-  ["ember","exports"],
-  function(__dependency1__, __exports__) {
+  });
+define("ic-tabs/tabs-css",
+  ["exports"],
+  function(__exports__) {
     "use strict";
-    var Ember = __dependency1__["default"] || __dependency1__;
-    __exports__["default"] = Ember.Handlebars.template(function anonymous(Handlebars,depth0,helpers,partials,data) {
-    this.compilerInfo = [4,'>= 1.0.0'];
-    helpers = this.merge(helpers, Ember.Handlebars.helpers); data = data || {};
-
-
-
-      data.buffer.push("ic-tabs,\nic-tab-list,\nic-tab-panel {\n  display: block\n}\n\nic-tab-list {\n  border-bottom: 1px solid #aaa;\n}\n\nic-tab {\n  display: inline-block;\n  padding: 6px 12px;\n  border: 1px solid transparent;\n  border-top-left-radius: 3px;\n  border-top-right-radius: 3px;\n  cursor: pointer;\n  margin-bottom: -1px;\n  position: relative;\n}\n\nic-tab[selected] {\n  border-color: #aaa;\n  border-bottom-color: #fff;\n}\n\nic-tab:focus {\n  box-shadow: 0 10px 0 0 #fff,\n              0 0 5px hsl(208, 99%, 50%);\n  border-color: hsl(208, 99%, 50%);\n  border-bottom-color: #fff;\n  outline: none;\n}\n\nic-tab:focus:before,\nic-tab:focus:after {\n  content: '';\n  position: absolute;\n  bottom: -6px;\n  width: 5px;\n  height: 5px;\n  background: #fff;\n}\n\nic-tab:focus:before {\n  left: -4px;\n}\n\nic-tab:focus:after {\n  right: -4px;\n}\n\n");
-
-    });
-  });define("ic-tabs/tabs",
+    __exports__["default"] = Ember.Handlebars.template({"compiler":[6,">= 2.0.0-beta.1"],"main":function(depth0,helpers,partials,data) {
+      data.buffer.push("ic-tabs,\nic-tab-list {\n  display: block;\n}\n\nic-tab-panel {\n  display: none;\n}\n\nic-tab-list {\n  border-bottom: 1px solid #aaa;\n}\n\nic-tab {\n  display: inline-block;\n  padding: 6px 12px;\n  border: 1px solid transparent;\n  border-top-left-radius: 3px;\n  border-top-right-radius: 3px;\n  cursor: pointer;\n  margin-bottom: -1px;\n  position: relative;\n}\n\nic-tab[selected] {\n  border-color: #aaa;\n  border-bottom-color: #fff;\n}\n\nic-tab:focus {\n  box-shadow: 0 10px 0 0 #fff,\n              0 0 5px hsl(208, 99%, 50%);\n  border-color: hsl(208, 99%, 50%);\n  border-bottom-color: #fff;\n  outline: none;\n}\n\nic-tab:focus:before,\nic-tab:focus:after {\n  content: '';\n  position: absolute;\n  bottom: -6px;\n  width: 5px;\n  height: 5px;\n  background: #fff;\n}\n\nic-tab:focus:before {\n  left: -4px;\n}\n\nic-tab:focus:after {\n  right: -4px;\n}\n\nic-tab-panel.active {\n  display: block;\n}\n\n");
+      },"useData":true});
+  });
+define("ic-tabs/tabs",
   ["ember","exports"],
   function(__dependency1__, __exports__) {
     "use strict";

examples/basic.html

@@ -105,7 +105,7 @@ <h2>Toast</h2>
 
 </script>
 
-<script src="../bower_components/jquery/jquery.js"></script>
+<script src="../bower_components/jquery/dist/jquery.js"></script>
 <script src="../bower_components/handlebars/handlebars.js"></script>
 <script src="../bower_components/ember/ember.js"></script>
 <script src="../bower_components/ic-styled/main.js"></script>

examples/dynamic.html

@@ -14,18 +14,18 @@
 
 {{#ic-tabs selected-index=selectedTabIndex}}
   {{#ic-tab-list}}
-    {{#each tabs}}
+    {{#each tab in tabs}}
       {{#ic-tab}}
-        <b>{{name}}</b>
-        <button {{action "removeTab" this}}>×</button>
+        <b>{{tab.name}}</b>
+        <button {{action "removeTab" tab}}>×</button>
       {{/ic-tab}}
     {{/each}}
     <button {{action "editNewTab"}}>add a tab</button>
   {{/ic-tab-list}}
 
-  {{#each tabs}}
+  {{#each tab in tabs}}
     {{#ic-tab-panel}}
-      <p>{{description}}</p>
+      <p>{{tab.description}}</p>
     {{/ic-tab-panel}}
   {{/each}}
 {{/ic-tabs}}
@@ -48,7 +48,7 @@
 
 </script>
 
-<script src="../bower_components/jquery/jquery.js"></script>
+<script src="../bower_components/jquery/dist/jquery.js"></script>
 <script src="../bower_components/handlebars/handlebars.js"></script>
 <script src="../bower_components/ember/ember.js"></script>
 <script src="../bower_components/ic-styled/main.js"></script>

examples/query-params.html

@@ -108,7 +108,7 @@ <h2>Toast</h2>
 <script>
   Ember = { ENV: { FEATURES: { 'query-params-new': true }}};
 </script>
-<script src="../bower_components/jquery/jquery.js"></script>
+<script src="../bower_components/jquery/dist/jquery.js"></script>
 <script src="../bower_components/handlebars/handlebars.js"></script>
 <script src="../bower_components/ember-canary/index.js"></script>
 <script src="../bower_components/ic-styled/main.js"></script>

karma.conf.js

@@ -4,7 +4,7 @@ module.exports = function(config) {
     frameworks: ['qunit'],
 
     files: [
-      'bower_components/jquery/jquery.js',
+      'bower_components/jquery/dist/jquery.js',
       'bower_components/handlebars/handlebars.js',
       'bower_components/ember/ember.js',
       'bower_components/jquery-simulate/index.js',

lib/tab-panel.js

@@ -77,18 +77,6 @@ export default Component.extend({
     return this.get('tab.active');
   }.property('tab.active'),
 
-  /**
-   * Shows or hides this panel depending on whether or not its active.
-   *
-   * @method toggleVisibility
-   * @private
-   */
-
-  toggleVisibility: function() {
-    var display = this.get('active') ? '' : 'none';
-    this.$().css('display', display);
-  }.observes('active'),
-
   /**
    * Registers with the TabsComponent.
    *

lib/tabs-css.hbs

@@ -1,7 +1,10 @@
 ic-tabs,
-ic-tab-list,
+ic-tab-list {
+  display: block;
+}
+
 ic-tab-panel {
-  display: block
+  display: none;
 }
 
 ic-tab-list {
@@ -50,3 +53,7 @@ ic-tab:focus:after {
   right: -4px;
 }
 
+ic-tab-panel.active {
+  display: block;
+}
+

package.json

@@ -10,20 +10,21 @@
   "license": "MIT",
   "devDependencies": {
     "bower": "^1.2.8",
-    "broccoli": "^0.2.0",
-    "qunitjs": "~1.12.0",
-    "karma-qunit": "^0.1.1",
-    "karma-script-launcher": "^0.1.0",
+    "broccoli": "^0.13.3",
+    "broccoli-cli": "0.0.1",
+    "broccoli-dist-es6-module": "^0.2.1",
+    "broccoli-merge-trees": "^0.2.1",
+    "ember-cli-htmlbars": "^0.6.0",
+    "karma": "^0.10.9",
     "karma-chrome-launcher": "^0.1.2",
     "karma-firefox-launcher": "^0.1.3",
     "karma-html2js-preprocessor": "^0.1.0",
-    "karma": "^0.10.9",
-    "broccoli-dist-es6-module": "^0.1.8",
-    "broccoli-cli": "0.0.1",
-    "broccoli-template-compiler": "^1.4.1",
+    "karma-qunit": "^0.1.1",
+    "karma-script-launcher": "^0.1.0",
+    "qunitjs": "~1.14.0",
     "rf-release": "^0.1.2"
   },
   "dependencies": {
     "ic-styled": "^1.1.6"
   }
-}
+}

test/support/setup.js

@@ -1,3 +1,6 @@
+document.write('<div id="ember-testing-container"><div id="ember-testing"></div></div>');
+document.write('<style>#ember-testing-container { position: absolute; background: white; bottom: 0; right: 0; width: 640px; height: 384px; overflow: auto; z-index: 9999; border: 1px solid #ccc; } #ember-testing { zoom: 50%; }</style>');
+
 emq.globalize();
 
 setResolver(Ember.DefaultResolver.extend({

testem.json

@@ -1,7 +1,7 @@
 {
   "framework": "qunit",
   "src_files": [
-    "bower_components/jquery/jquery.js",
+    "bower_components/jquery/dist/jquery.js",
     "bower_components/handlebars/handlebars.js",
     "bower_components/ember/ember.js",
     "bower_components/jquery-simulate/index.js",