Merge pull request #80 from alexdiliberto/feature/updates

feat(helpers): add general ui class helpers
open-tux · Oct 3, 2017 · f0445e8 · f0445e8
2 parents 8e7621c + d608b75
commit f0445e8
Show file tree

Hide file tree

Showing 48 changed files with 178 additions and 89 deletions.
diff --git a/addon/.gitkeep b/addon/.gitkeep
diff --git a/addon/components/bulma-button.js b/addon/components/bulma-button.js
@@ -1,7 +1,7 @@
 import Ember from 'ember';
 import layout from '../templates/components/bulma-button';
 import { alias, bool } from 'ember-decorators/object/computed';
-import { _colorBindings } from '../constants';
+import { _colorBindings, _helpers } from '../constants';
 
 const {
   Component
@@ -11,7 +11,7 @@ export default Component.extend({
   layout,
   tagName: 'a',
   classNames: ['button'],
-  classNameBindings: ['isLoading:is-loading', 'loading:is-loading', 'isOutlined:is-outlined', 'outlined:is-outlined', 'isFullwidth:is-fullwidth', 'isFullWidth:is-fullwidth', 'isInverted:is-inverted', 'inverted:is-inverted'].concat(_colorBindings),
+  classNameBindings: ['isLoading:is-loading', 'loading:is-loading', 'isOutlined:is-outlined', 'outlined:is-outlined', 'isFullwidth:is-fullwidth', 'isFullWidth:is-fullwidth', 'isInverted:is-inverted', 'inverted:is-inverted'].concat(_colorBindings, _helpers),
   attributeBindings: ['disabled'],
 
   /**

diff --git a/addon/components/bulma-column.js b/addon/components/bulma-column.js
@@ -1,6 +1,6 @@
 import Ember from 'ember';
 import layout from '../templates/components/bulma-column';
-import { _responsiveHelpers, _gridBindings } from '../constants';
+import { _helpers, _responsiveHelpers, _gridBindings } from '../constants';
 
 const {
   Component,
@@ -20,7 +20,7 @@ export default Component.extend({
     @private
   */
   concatBindings() {
-    set(this, 'classNameBindings', ['content'].concat(_gridBindings, _responsiveHelpers));
+    set(this, 'classNameBindings', ['content'].concat(_gridBindings, _responsiveHelpers, _helpers));
   },
 
   init() {

diff --git a/addon/components/bulma-columns.js b/addon/components/bulma-columns.js
@@ -1,6 +1,6 @@
 import Ember from 'ember';
 import layout from '../templates/components/bulma-columns';
-import { _responsiveHelpers } from '../constants';
+import { _helpers, _responsiveHelpers } from '../constants';
 
 const {
   Component
@@ -17,5 +17,5 @@ export default Component.extend({
     'isMultiline:is-multiline',
     'isGapless:is-gapless',
     'isVcentered:is-vcentered'
-  ].concat(_responsiveHelpers)
+  ].concat(_helpers, _responsiveHelpers)
 });
diff --git a/addon/components/bulma-container.js b/addon/components/bulma-container.js
@@ -1,6 +1,6 @@
 import Ember from 'ember';
 import layout from '../templates/components/bulma-container';
-import { _responsiveHelpers } from '../constants';
+import { _helpers, _responsiveHelpers } from '../constants';
 
 const {
   Component
@@ -9,5 +9,5 @@ const {
 export default Component.extend({
   layout,
   classNames: ['container'],
-  classNameBindings: ['isFluid:is-fluid'].concat(_responsiveHelpers)
+  classNameBindings: ['isFluid:is-fluid'].concat(_helpers, _responsiveHelpers)
 });
diff --git a/addon/components/bulma-control.js b/addon/components/bulma-control.js
@@ -1,5 +1,6 @@
 import Ember from 'ember';
 import layout from '../templates/components/bulma-control';
+import { _helpers } from '../constants';
 
 const {
   Component
@@ -20,5 +21,5 @@ export default Component.extend({
     'isGroup:is-group',
     'isExpanded:is-expanded',
     'isHorizontal:is-horizontal'
-  ]
+  ].concat(_helpers)
 });
diff --git a/addon/components/bulma-footer.js b/addon/components/bulma-footer.js
@@ -1,6 +1,6 @@
 import Ember from 'ember';
 import layout from '../templates/components/bulma-footer';
-import { _responsiveHelpers } from '../constants';
+import { _helpers, _responsiveHelpers } from '../constants';
 
 const {
   Component
@@ -10,5 +10,5 @@ export default Component.extend({
   layout,
   tagName: 'footer',
   classNames: ['footer'],
-  classNameBindings: _responsiveHelpers
+  classNameBindings: [].concat(_helpers, _responsiveHelpers)
 });
diff --git a/addon/components/bulma-header-menu.js b/addon/components/bulma-header-menu.js
@@ -1,6 +1,6 @@
 import Ember from 'ember';
 import layout from '../templates/components/bulma-header-menu';
-import { _responsiveHelpers } from '../constants';
+import { _helpers, _responsiveHelpers } from '../constants';
 
 const {
   Component,
@@ -15,7 +15,7 @@ export default Component.extend({
     'isRight:header-right',
     'left:header-left',
     'right:header-right'
-  ].concat(_responsiveHelpers),
+  ].concat(_helpers, _responsiveHelpers),
   /**
     Array of links for this menu
 

diff --git a/addon/components/bulma-header.js b/addon/components/bulma-header.js
@@ -1,6 +1,6 @@
 import Ember from 'ember';
 import layout from '../templates/components/bulma-header';
-import { _responsiveHelpers } from '../constants';
+import { _helpers, _responsiveHelpers } from '../constants';
 
 const {
   Component
@@ -10,5 +10,5 @@ export default Component.extend({
   layout,
   tagName: 'header',
   classNames: ['header'],
-  classNameBindings: _responsiveHelpers
+  classNameBindings: [].concat(_helpers, _responsiveHelpers)
 });
diff --git a/addon/components/bulma-hero-content.js b/addon/components/bulma-hero-content.js
@@ -1,7 +1,7 @@
 import Ember from 'ember';
 import layout from '../templates/components/bulma-hero-content';
 import { alias } from 'ember-decorators/object/computed';
-import { _responsiveHelpers } from '../constants';
+import { _helpers, _responsiveHelpers } from '../constants';
 
 const {
   Component
@@ -12,7 +12,7 @@ export default Component.extend({
   classNames: ['hero-body'],
   classNameBindings: [
     'full:is-fullwidth'
-  ].concat(_responsiveHelpers),
+  ].concat(_helpers, _responsiveHelpers),
 
   /**
     Signal if is-fluid should be added to the outer container

diff --git a/addon/components/bulma-hero-footer.js b/addon/components/bulma-hero-footer.js
@@ -1,6 +1,6 @@
 import Ember from 'ember';
 import layout from '../templates/components/bulma-hero-footer';
-import { _responsiveHelpers } from '../constants';
+import { _helpers, _responsiveHelpers } from '../constants';
 
 const {
   Component
@@ -9,7 +9,7 @@ const {
 export default Component.extend({
   layout,
   classNames: ['hero-foot'],
-  classNameBindings: _responsiveHelpers,
+  classNameBindings: [].concat(_helpers, _responsiveHelpers),
   /**
     Signal if content should be nested in a container (div.container)
 

diff --git a/addon/components/bulma-hero-header.js b/addon/components/bulma-hero-header.js
@@ -1,6 +1,6 @@
 import Ember from 'ember';
 import layout from '../templates/components/bulma-hero-header';
-import { _responsiveHelpers } from '../constants';
+import { _helpers, _responsiveHelpers } from '../constants';
 
 const {
   Component
@@ -10,5 +10,5 @@ export default Component.extend({
   layout,
   tagName: 'section',
   classNames: ['hero-head'],
-  classNameBindings: _responsiveHelpers
+  classNameBindings: [].concat(_helpers, _responsiveHelpers)
 });
diff --git a/addon/components/bulma-hero.js b/addon/components/bulma-hero.js
@@ -1,6 +1,6 @@
 import Ember from 'ember';
 import layout from '../templates/components/bulma-hero';
-import { _colorBindings, _responsiveHelpers } from '../constants';
+import { _helpers, _colorBindings, _responsiveHelpers } from '../constants';
 import { alias } from 'ember-decorators/object/computed';
 
 const {
@@ -32,7 +32,7 @@ export default Component.extend({
 
     'isRight:is-right',
     'right:is-right'
-  ].concat(_colorBindings, _responsiveHelpers),
+  ].concat(_helpers, _colorBindings, _responsiveHelpers),
 
   /**
     Signal if container wrapper should be used

diff --git a/addon/components/bulma-input.js b/addon/components/bulma-input.js
@@ -1,6 +1,7 @@
 import Ember from 'ember';
 import layout from '../templates/components/bulma-input';
 import { deprecations } from '../utils';
+import { _helpers } from '../constants';
 
 const {
   Component,
@@ -15,7 +16,7 @@ export default Component.extend({
     'isSmall:is-small',
     'isMedium:is-medium',
     'isLarge:is-large'
-  ],
+  ].concat(_helpers),
   // Bindings are not comprehensive. More complex implementations should use a native element with classes applied
   attributeBindings: [
     'type',

diff --git a/addon/components/bulma-menu.js b/addon/components/bulma-menu.js
@@ -1,6 +1,6 @@
 import Ember from 'ember';
 import layout from '../templates/components/bulma-menu';
-import { _responsiveHelpers } from '../constants';
+import { _helpers, _responsiveHelpers } from '../constants';
 
 const {
   Component
@@ -10,5 +10,5 @@ export default Component.extend({
   layout,
   tagName: 'aside',
   classNames: ['menu'],
-  classNameBindings: _responsiveHelpers
+  classNameBindings: [].concat(_helpers, _responsiveHelpers)
 });
diff --git a/addon/components/bulma-message-body.js b/addon/components/bulma-message-body.js
@@ -1,12 +1,12 @@
 import Ember from 'ember';
 import layout from '../templates/components/bulma-message-body';
-import { _responsiveHelpers } from '../constants';
+import { _helpers, _responsiveHelpers } from '../constants';
 
 const {
   Component
 } = Ember;
 
 export default Component.extend({
   layout,
-  classNameBindings: _responsiveHelpers
+  classNameBindings: [].concat(_helpers, _responsiveHelpers)
 });
diff --git a/addon/components/bulma-message-header.js b/addon/components/bulma-message-header.js
@@ -1,12 +1,12 @@
 import Ember from 'ember';
 import layout from '../templates/components/bulma-message-header';
-import { _responsiveHelpers } from '../constants';
+import { _helpers, _responsiveHelpers } from '../constants';
 
 const {
   Component
 } = Ember;
 
 export default Component.extend({
   layout,
-  classNameBindings: _responsiveHelpers
+  classNameBindings: [].concat(_helpers, _responsiveHelpers)
 });
diff --git a/addon/components/bulma-message.js b/addon/components/bulma-message.js
@@ -1,16 +1,17 @@
 import Ember from 'ember';
 import layout from '../templates/components/bulma-message';
 import { alias } from 'ember-decorators/object/computed';
-import { _colorBindings, _responsiveHelpers } from '../constants';
+import { _helpers, _colorBindings, _responsiveHelpers } from '../constants';
 
 const {
   Component
 } = Ember;
 
+// TODO: Convert to use higher-order component API
 export default Component.extend({
   layout,
   classNames: ['message'],
-  classNameBindings: [].concat(_colorBindings, _responsiveHelpers),
+  classNameBindings: [].concat(_helpers, _colorBindings, _responsiveHelpers),
 
   /**
     A alternative semantic alias for body

diff --git a/addon/components/bulma-modal.js b/addon/components/bulma-modal.js
@@ -1,5 +1,6 @@
 import Ember from 'ember';
 import layout from '../templates/components/bulma-modal';
+import { _helpers } from '../constants';
 
 const {
   Component,
@@ -19,7 +20,7 @@ const {
 export default Component.extend({
   layout,
   classNames: ['modal'],
-  classNameBindings: ['show:is-active'],
+  classNameBindings: ['show:is-active'].concat(_helpers),
   /**
     * Include background container
     *

diff --git a/addon/components/bulma-nav-center.js b/addon/components/bulma-nav-center.js
@@ -1,6 +1,6 @@
 import Ember from 'ember';
 import layout from '../templates/components/bulma-nav-center';
-import { _responsiveHelpers } from '../constants';
+import { _helpers, _responsiveHelpers } from '../constants';
 
 const {
   Component
@@ -9,5 +9,5 @@ const {
 export default Component.extend({
   layout,
   classNames: ['nav-center'],
-  classNameBindings: _responsiveHelpers
+  classNameBindings: [].concat(_helpers, _responsiveHelpers)
 });
diff --git a/addon/components/bulma-nav-left.js b/addon/components/bulma-nav-left.js
@@ -1,6 +1,6 @@
 import Ember from 'ember';
 import layout from '../templates/components/bulma-nav-left';
-import { _responsiveHelpers } from '../constants';
+import { _helpers, _responsiveHelpers } from '../constants';
 
 const {
   Component
@@ -9,5 +9,5 @@ const {
 export default Component.extend({
   layout,
   classNames: ['nav-left'],
-  classNameBindings: _responsiveHelpers
+  classNameBindings: [].concat(_helpers, _responsiveHelpers)
 });
diff --git a/addon/components/bulma-nav-right.js b/addon/components/bulma-nav-right.js
@@ -1,6 +1,6 @@
 import Ember from 'ember';
 import layout from '../templates/components/bulma-nav-right';
-import { _responsiveHelpers } from '../constants';
+import { _helpers, _responsiveHelpers } from '../constants';
 
 const {
   Component
@@ -9,5 +9,5 @@ const {
 export default Component.extend({
   layout,
   classNames: ['nav-right'],
-  classNameBindings: ['isMenu:nav-menu'].concat(_responsiveHelpers)
+  classNameBindings: ['isMenu:nav-menu'].concat(_helpers, _responsiveHelpers)
 });
diff --git a/addon/components/bulma-nav-toggle.js b/addon/components/bulma-nav-toggle.js
@@ -1,6 +1,6 @@
 import Ember from 'ember';
 import layout from '../templates/components/bulma-nav-toggle';
-import { _responsiveHelpers } from '../constants';
+import { _helpers, _responsiveHelpers } from '../constants';
 
 const {
   Component
@@ -10,7 +10,7 @@ export default Component.extend({
   layout,
   tagName: 'span',
   classNames: ['nav-toggle'],
-  classNameBindings: _responsiveHelpers,
+  classNameBindings: [].concat(_helpers, _responsiveHelpers),
   /**
     Handle click action on mousedown, return instance of component for mutablity
 

diff --git a/addon/components/bulma-nav.js b/addon/components/bulma-nav.js
@@ -1,6 +1,6 @@
 import Ember from 'ember';
 import layout from '../templates/components/bulma-nav';
-import { _responsiveHelpers } from '../constants';
+import { _helpers, _responsiveHelpers } from '../constants';
 
 const {
   Component
@@ -10,5 +10,5 @@ export default Component.extend({
   layout,
   tagName: 'nav',
   classNames: ['nav'],
-  classNameBindings: ['hasShadow:has-shadow'].concat(_responsiveHelpers)
+  classNameBindings: ['hasShadow:has-shadow'].concat(_helpers, _responsiveHelpers)
 });
diff --git a/addon/components/bulma-notification.js b/addon/components/bulma-notification.js
@@ -1,7 +1,7 @@
 import Ember from 'ember';
 import layout from '../templates/components/bulma-notification';
 import { computed } from 'ember-decorators/object';
-import { _colorBindings, _responsiveHelpers } from '../constants';
+import { _helpers, _colorBindings, _responsiveHelpers } from '../constants';
 
 const {
   Component
@@ -10,7 +10,7 @@ const {
 export default Component.extend({
   layout,
   classNames: ['notification'],
-  classNameBindings: [].concat(_colorBindings, _responsiveHelpers),
+  classNameBindings: [].concat(_helpers, _colorBindings, _responsiveHelpers),
 
   /**
     If a close action has been provided, close button should display by default