Merge remote-tracking branch 'upstream/master'

.pullapprove.yml

@@ -1 +1 @@
-extends: default
+extends: base

.travis.yml

@@ -1,19 +1,11 @@
 language: node_js
-sudo: false
 node_js:
-- '5.3'
+- '5.0'
+- 'stable'
+sudo: false
 branches:
   except:
-  - /^v[0-9\.]+/
-before_install:
-- npm install -g coveralls pr-bumper
-- pr-bumper check
-install:
-- npm install
-- bower install
-after_success:
-- sed -i -- 's/SF:ember-frost-button\/\(.*\)/SF:addon\/\1.js/' coverage/lcov.info && rm -f coverage/lcov.info--
-- cat coverage/lcov.info | coveralls
+  - "/^v[0-9\\.]+/"
 addons:
   apt:
     sources:
@@ -22,9 +14,29 @@ addons:
     - g++-4.8
 env:
   matrix:
-  - CXX=g++-4.8
+  - EMBER_TRY_SCENARIO=default
+  - EMBER_TRY_SCENARIO=ember-release
+  - EMBER_TRY_SCENARIO=ember-beta
+  - EMBER_TRY_SCENARIO=ember-canary
   global:
-    secure: Waeeo/oid+a1OH+NjEME9KXNrqCny9a3iSX4QcUjApJvU3WDS58ELqvcIxbO29pJHcsvrbunhd/siVQ32RTFzkyz6l+jBAj+eHQH+MfCNA7en/0Jx5idPt7A6WARKBPdv81cTdv7oWr5iRZMrpX1JpN1h+lqNH7FrZ4yL8pt9vZWEQanUaL/6DCXh0hUPUXg+8MQ0/UbA3DoT1NfeOjPUK8JUKQjUZVM5f+pPsTCkbzkoQZho5jdFIhg7jWZX+QrqIuZdN+AtizmS+kI48h/DafN3T3w2lO5JS/YHBel7EcsW/X4WcfJrR1Av7QlOY/tLwzAkD/Ys3RMnK+a9EuBbE8wOGGWY4wmSYOgh4yZTKAHe6lEHKX/ztQFotB9pBcx1OjT6s/4k/V+VRXM6TfAS2hoB5lxL4ZX++QPVXRQD8lZGP+EJ3NRdtn05BMJiruhMgxnA6jiDOm8pp5iIPc4goG2GKbCgNFocXIz5mYBPxRC6WeiD8jjE4TA1XcoDqGNPuJaNOGyKrEOcyhPdvZ6B6aDGNq6FT7fXzvK9WnZEFKpEqnCR33TBOOxUWZCKh/Ce9xrySZowc3Wa6H7Tc7AR6hW2e/Egkv99DKOrbXY+20mjvnKmuJLYy1Tm9/Q5cz90/eVzxwuivfwWRRJPELh4VuzkODbM3Pn1vOAMPV10ng=
+    - CXX=g++-4.8
+    - secure: Waeeo/oid+a1OH+NjEME9KXNrqCny9a3iSX4QcUjApJvU3WDS58ELqvcIxbO29pJHcsvrbunhd/siVQ32RTFzkyz6l+jBAj+eHQH+MfCNA7en/0Jx5idPt7A6WARKBPdv81cTdv7oWr5iRZMrpX1JpN1h+lqNH7FrZ4yL8pt9vZWEQanUaL/6DCXh0hUPUXg+8MQ0/UbA3DoT1NfeOjPUK8JUKQjUZVM5f+pPsTCkbzkoQZho5jdFIhg7jWZX+QrqIuZdN+AtizmS+kI48h/DafN3T3w2lO5JS/YHBel7EcsW/X4WcfJrR1Av7QlOY/tLwzAkD/Ys3RMnK+a9EuBbE8wOGGWY4wmSYOgh4yZTKAHe6lEHKX/ztQFotB9pBcx1OjT6s/4k/V+VRXM6TfAS2hoB5lxL4ZX++QPVXRQD8lZGP+EJ3NRdtn05BMJiruhMgxnA6jiDOm8pp5iIPc4goG2GKbCgNFocXIz5mYBPxRC6WeiD8jjE4TA1XcoDqGNPuJaNOGyKrEOcyhPdvZ6B6aDGNq6FT7fXzvK9WnZEFKpEqnCR33TBOOxUWZCKh/Ce9xrySZowc3Wa6H7Tc7AR6hW2e/Egkv99DKOrbXY+20mjvnKmuJLYy1Tm9/Q5cz90/eVzxwuivfwWRRJPELh4VuzkODbM3Pn1vOAMPV10ng=
+matrix:
+  fast_finish: true
+  allow_failures:
+  - env: EMBER_TRY_SCENARIO=ember-canary
+before_install:
+- npm config set spin false
+- npm install -g coveralls pr-bumper
+- pr-bumper check
+install:
+- npm install
+- bower install
+script:
+- npm run lint
+- ember try:one $EMBER_TRY_SCENARIO --- ember test
+after_success:
+- .travis/publish-coverage.sh
 before_deploy:
 - pr-bumper bump
 deploy:
@@ -35,6 +47,8 @@ deploy:
     secure: B4UIGF/KLwS3vOpemKDRLtDjtl8rl4bpYClQEcjzAALx23nieKFCKXEKbOM5W7U8XNx0ygWuYNcaTnuKP6G67ijCdZRP7SnRPc5hP+F0Hhv35i2VGcUaczqCJpkuaC/8ncjoR9asBTFyNzVlUag5/ZdmCzFBvn+PUpSMUBsUNxAhulDXUsuG8XeCOEAt8Bz1Ej4oN4DP8dDJZQs+vCgZl6156YDHk9ZHWyGdwMmA2CI7YFq6iy5Kc+QvTu25Ymjbz5HeIY8c6fTqYbpvYMm1zBLWFFRmrv93O87YCv61Lw7F+GbxZw6KYn1ufL7puGQ+ffgiXqZR8OZfm6DMHHIGl//wE5OJ6qbxLos/GFAakUCKdGtF6OEjKM/0tW6OD98i0FBiAxXYF9mSy8yC2npFKBDkvW2ghsOZTFuyIcfCnbp4iahJWXaKNpStdPIeFxq52fcjMx1cE4+XOdjwQ1hx/FeVpJrgNn/zVGzqTmzXmrWzMZ9T3ANB8xT6JpAHzP+adap3GUu5kBwRYjWyvVvz0Mh8xF5s2efam9z6MI1Blt+uRqt9wEZTa/8Im44IDXLKyYPBU9R81RFTkiDQLzTp0Ww7DMjeqmFU4M8JkjgVfDsKtIJafvnrIPGxDrNgq5TlC73Up46FS/lAzPTkIf/PgnD8chrtc44gHJtm2rnmrEw=
   on:
     branch: master
+    condition: "$EMBER_TRY_SCENARIO = 'default'"
+    node: 'stable'
     tags: false
 after_deploy:
 - .travis/publish-gh-pages.sh

.travis/publish-coverage.sh

@@ -0,0 +1,9 @@
+#!/bin/bash
+
+if [ "$EMBER_TRY_SCENARIO" != "default" ]
+then
+  echo "Skipping coverage publish for EMBER_TRY_SCENARIO ${EMBER_TRY_SCENARIO}"
+  exit 0
+fi
+
+cat coverage/lcov.info | coveralls

README.md

@@ -32,15 +32,16 @@ ember install ember-frost-button
 | `text` | `string` | `<button-text>` | text do display on the button |
 | `subtext` | `string` | `<button-subtext>` | subtext do display on the button underneath main `text` |
 | `size` | `string` | `small` | The smallest button you ever did see |
-| | | `medium` | **default**: Not quite as small as `small`, but not very big either |
+| | | `medium` | Not quite as small as `small`, but not very big either |
 | | | `large` | Now *that's* what I call a button! |
 | | | `extra-large` | My grandma, what a big button you have! <br /> Recommended when `icon`, `text`, and `subtext` are used together |
 | `priority` | `string` | `primary` | Call-to-action :telephone: |
-| | | `secondary` | **default**: Run of the mill, garden variety  |
+| | | `secondary` | Run of the mill, garden variety  |
 | | | `tertiary` | Low-key, subdued  |
 | | | `confirm` | An alias for `primary`  |
 | | | `normal` | An alias for `secondary`  |
 | | | `cancel` | An alias for `tertiary`  |
+| `design`| `string` | `tab` | Custom styling for applications that use buttons but don't follow the button styling.  Requires `text` or `icon` to be specified.  Should not be used with `priority` and `size`. |
 
 ## Examples
 
@@ -89,7 +90,15 @@ ember install ember-frost-button
 }}
 ```
 
+### Design
+```handlebars
+{{frost-button
+  design='tab'
+  text='Tab'
+}}
+
 ## Development
+
 ### Setup
 ```
 git clone git@github.com:ciena-frost/ember-frost-button.git

addon/components/frost-button.js

@@ -55,6 +55,28 @@ function addSizeClass (size, classes) {
   }
 }
 
+/**
+ * Add the appropriate class for the button design to the Array of classes
+ * Button design is restricted for use with specific applications.
+ * For example, frost-tabs uses button for tabs, but styling for
+ * tabs is quite different then for a button.  By providing 'design'
+ * property, we can style the button appropriately and still re-use
+ * other functionality.
+ *
+ * @param {String} design - button design
+ * @param {String[]} classes - the classes to add the size class to
+ */
+function addDesignClass (design, classes) {
+  switch (design) {
+    case 'tab':
+      classes.push('tab')
+      break
+    default:
+      // no class to add for this invalid size
+      break
+  }
+}
+
 export default Ember.Component.extend({
   tagName: 'button',
   classNames: [
@@ -92,15 +114,23 @@ export default Ember.Component.extend({
    * 'cancel' => 'tertiary'
    * @type {String}
    */
-  priority: 'confirm',
+  priority: '',
 
   /**
    * How big do you want your button?
    * Currently available options are:
    * ['small', 'medium', 'large', 'extra-large']
    * @type {String}
    */
-  size: 'medium',
+  size: '',
+
+  /**
+   *  Specifies design of the button.
+   *  Currently available options are:
+   *  ['tab']
+   *  @type {String}
+   */
+  design: '',
 
   /**
    * The text to display within this button
@@ -156,11 +186,26 @@ export default Ember.Component.extend({
 
   extraClasses: Ember.computed('priority', 'vertical', function () {
     const classes = []
-    addSizeClass(this.get('size'), classes)
-    addPriorityClass(this.get('priority'), classes)
-
-    if (this.get('vertical')) {
-      classes.push('vertical')
+    addDesignClass(this.get('design'), classes)
+
+    // only add size and priority if design has not been specified
+    if (classes.length === 0) {
+      addSizeClass(this.get('size'), classes)
+      addPriorityClass(this.get('priority'), classes)
+      if (this.get('vertical')) {
+        classes.push('vertical')
+      }
+    } else {
+      // design button needs to have either text or icon property present
+      if ((this.get('text') === '') && (this.get('icon') === '')) {
+        Ember.Logger.error('Error: The `design` property requires `text` or `icon` property to be specified.')
+        return
+      }
+
+      // display warning when design property is used together with size and/or priority
+      if ((this.get('priority') !== '') || (this.get('size') !== '')) {
+        Ember.Logger.warn('Warning: The `design` property takes precedence over `size` and `priority`.')
+      }
     }
 
     return classes.join(' ')

addon/styles/addon.scss

@@ -1,4 +1,3 @@
-@import 'node_modules/ember-frost-css-core/scss/frost-core';
 @import 'node_modules/ember-frost-theme/scss/frost-theme';
 
 @mixin button-color ($color) {
@@ -15,7 +14,6 @@ $frost-color-button-primary-active: $frost-color-blue-4; // TODO move to ember-f
   padding: 0;
   border: none;
   border-radius: 2px;
-  font-family: $frost-font-family;
   background-color: transparent;
   color: $frost-color-white;
   cursor: pointer;
@@ -24,6 +22,10 @@ $frost-color-button-primary-active: $frost-color-blue-4; // TODO move to ember-f
     outline: none;
   }
 
+  &:focus {
+    box-shadow: 0px 1px 6px transparentize($frost-color-blue-1, .25)
+  }
+
   &.disabled {
     opacity: 0.25;
   }
@@ -39,7 +41,10 @@ $frost-color-button-primary-active: $frost-color-blue-4; // TODO move to ember-f
 
     &:hover {
       background-color: $frost-color-button-primary-hover-bg;
-      box-shadow: 0 0 1px 1px lightgrey; // TODO Variable
+    }
+
+    &:focus {
+      border: solid 2px $frost-color-blue-4;
     }
 
     &.disabled:hover {
@@ -54,12 +59,12 @@ $frost-color-button-primary-active: $frost-color-blue-4; // TODO move to ember-f
   }
 
   &.secondary {
-    border: 1px solid $frost-color-button-secondary-border;
+    border: 2px solid $frost-color-button-secondary-border;
     background-color: $frost-color-button-secondary-bg;
     @include button-color($frost-color-button-secondary);
 
     &:hover {
-      box-shadow: 1px 1px 1px 1px lightgrey; // TODO Variable
+      background-color: transparentize($frost-color-blue-1, .9);
     }
 
     &.disabled:hover {
@@ -81,6 +86,10 @@ $frost-color-button-primary-active: $frost-color-blue-4; // TODO move to ember-f
       background-color: $frost-color-button-tertiary-hover-bg;
     }
 
+    &:focus {
+      border: 1px solid $frost-color-blue-4;
+    }
+
     &.disabled:hover {
       background-color: $frost-color-button-tertiary-bg;
     }
@@ -135,6 +144,24 @@ $frost-color-button-primary-active: $frost-color-blue-4; // TODO move to ember-f
     }
   }
 
+  // Design - 'tab'
+  &.tab {
+    height: 35px;
+    padding: 0 15px;
+    box-shadow: none;
+    cursor: default;
+
+    .text {
+      font-family: $frost-font-family;
+      font-size: $frost-font-m;
+      color: $frost-color-grey-5;
+    }
+
+    &:hover {
+      background-color: $frost-color-button-tertiary-hover-bg;
+    }
+  }
+
   // Content - text
   &.text {
     // Deprecated format

blueprints/ember-frost-button/index.js

@@ -0,0 +1,19 @@
+module.exports = {
+  description: '',
+  normalizeEntityName: function () {},
+
+  /**
+    Installs specified packages at the root level of the application.
+    Triggered by 'ember install <addon name>'.
+
+    @returns {Promise} package names and versions
+  */
+  afterInstall: function () {
+    return this.addAddonsToProject({
+      packages: [
+        {name: 'ember-frost-theme', target: '^1.0.3'},
+        {name: 'ember-frost-icons', target: '^1.4.0'}
+      ]
+    })
+  }
+}

bower.json

@@ -16,5 +16,8 @@
   },
   "resolutions": {
     "ember": "2.3.1"
+  },
+  "devDependencies": {
+    "blanket": "5e94fc30f2e694bb5c3718ddcbf60d467f4b4d26"
   }
 }

package.json

@@ -1,14 +1,14 @@
 {
   "name": "ember-frost-button",
-  "version": "1.1.0",
+  "version": "2.0.0",
   "description": "Simple Frost Button",
   "frostGuideDirectory": "ui-components/button-controls/button",
   "directories": {
     "doc": "doc",
     "test": "tests"
   },
   "scripts": {
-    "lint": "eslint *.js addon app config tests",
+    "lint": "eslint *.js addon app blueprints config tests",
     "start": "ember server",
     "build": "ember build",
     "test": "npm run-script lint && ember test"
@@ -22,13 +22,15 @@
   "contributors": [
     "Roxanne Panthaky (https://github.com/rox163)",
     "Adam Meadows (https://github.com/job13er)",
-    "Matthew Dahl (https://github.com/sandersky)"
+    "Matthew Dahl (https://github.com/sandersky)",
+    "Gosia Hyndman (https://github.com/vesper2000)"
   ],
   "license": "MIT",
   "devDependencies": {
     "broccoli-asset-rev": "^2.4.2",
     "ember-cli": "^2.3.0",
     "ember-cli-app-version": "^1.0.0",
+    "ember-cli-blanket": "0.9.1",
     "ember-cli-content-security-policy": "^0.5.0",
     "ember-cli-dependency-checker": "^1.2.0",
     "ember-cli-htmlbars-inline-precompile": "^0.3.1",
@@ -40,7 +42,10 @@
     "ember-cli-uglify": "^1.2.0",
     "ember-disable-proxy-controllers": "^1.0.1",
     "ember-export-application-global": "^1.0.5",
-    "ember-frost-checkbox": "^1.0.0",
+    "ember-frost-checkbox": "^1.1.0",
+    "ember-frost-css-core": "^1.1.2",
+    "ember-frost-icons": "^1.4.0",
+    "ember-frost-theme": "^1.0.3",
     "ember-load-initializers": "^0.5.1",
     "ember-resolver": "^2.0.3",
     "ember-truth-helpers": "1.2.0",
@@ -59,9 +64,6 @@
     "ember-cli-babel": "^5.1.5",
     "ember-cli-htmlbars": "^1.0.1",
     "ember-cli-sass": "^5.1.0",
-    "ember-frost-css-core": "^1.0.0",
-    "ember-frost-icons": "^1.0.0",
-    "ember-frost-theme": "^1.0.1",
     "ember-lodash": "^0.0.6"
   },
   "ember-addon": {