@xdam/ember-partials 0.9.0-beta.1 → 0.10.1

package/addon/components/xep-toolbar-item-icon.js

@@ -3,8 +3,6 @@ import {
   classNames, layout, tagName, attribute,
 } from '@ember-decorators/component';
 import template from '@xdam/ember-partials/templates/components/xep-toolbar-item-icon';
-import { argument } from '@ember-decorators/argument';
-import { optional } from '@ember-decorators/argument/types';
 
 @layout(template)
 @tagName('span')
@@ -15,7 +13,6 @@ export default class XepToolbarItemIconComponent extends Component {
    * @argument [testSelector]
    * @type {String}
    */
-  @argument(optional('string'))
   @attribute('data-test-toolbar-item-icon')
   testSelector;
 }

package/addon/components/xep-toolbar-item-text.js

@@ -3,8 +3,6 @@ import {
   classNames, layout, tagName, attribute,
 } from '@ember-decorators/component';
 import template from '@xdam/ember-partials/templates/components/xep-toolbar-item-text';
-import { argument } from '@ember-decorators/argument';
-import { optional } from '@ember-decorators/argument/types';
 
 @layout(template)
 @tagName('span')
@@ -15,7 +13,6 @@ export default class XepToolbarItemTextComponent extends Component {
    * @argument [testSelector]
    * @type {String}
    */
-  @argument(optional('string'))
   @attribute('data-test-toolbar-item-text')
   testSelector;
 }

package/addon/components/xep-toolbar-item.js

@@ -1,8 +1,6 @@
 import Component from '@ember/component';
 import { classNames, layout, attribute } from '@ember-decorators/component';
 import template from '@xdam/ember-partials/templates/components/xep-toolbar-item';
-import { argument } from '@ember-decorators/argument';
-import { optional, Action } from '@ember-decorators/argument/types';
 
 /**
  * Toolbar items are used to expose actions, page titles, breadcrumbs, etc... within
@@ -23,7 +21,6 @@ export default class XepToolbarItemComponent extends Component {
    * @argument [testSelector]
    * @type {String}
    */
-  @argument(optional('string'))
   @attribute('data-test-toolbar-item')
   testSelector;
 
@@ -32,6 +29,5 @@ export default class XepToolbarItemComponent extends Component {
    * @argument [click]
    * @type {Action}
    */
-  @argument(optional(Action))
   click;
 }

package/addon/components/xep-toolbar-section.js

@@ -3,10 +3,7 @@ import {
   classNames, layout, tagName, className, attribute,
 } from '@ember-decorators/component';
 import template from '@xdam/ember-partials/templates/components/xep-toolbar-section';
-import { argument } from '@ember-decorators/argument';
-import { optional, oneOf, Action } from '@ember-decorators/argument/types';
-import { computed } from '@ember-decorators/object';
-import EmberObject from '@ember/object';
+import EmberObject, { computed } from '@ember/object';
 
 const ALIGN_TYPES = {
   // Makes section align to the start.
@@ -39,7 +36,6 @@ export default class XepToolbarSectionComponent extends Component {
    * @argument [testSelector]
    * @type {String}
    */
-  @argument(optional('string'))
   @attribute('data-test-toolbar-section')
   testSelector;
 
@@ -48,7 +44,6 @@ export default class XepToolbarSectionComponent extends Component {
    * @argument [align]
    * @type {String}
    */
-  @argument(optional(oneOf(...Object.keys(ALIGN_TYPES))))
   align = 'start';
 
   // Map of classNames for each alignment type
@@ -73,7 +68,6 @@ export default class XepToolbarSectionComponent extends Component {
    * @argument [flex]
    * @type {String}
    */
-  @argument(optional(oneOf(...Object.keys(FLEX_TYPES))))
   flex = 'grow';
 
   // Map of classNames for each flex type
@@ -97,6 +91,5 @@ export default class XepToolbarSectionComponent extends Component {
    * @argument [click]
    * @type {Action}
    */
-  @argument(optional(Action))
   click;
 }

package/addon/components/xep-toolbar.js

@@ -1,15 +1,10 @@
 import {
   classNames, layout, className, attribute,
 } from '@ember-decorators/component';
-import {
-  optional, oneOf, shapeOf,
-} from '@ember-decorators/argument/types';
 import template from '@xdam/ember-partials/templates/components/xep-toolbar';
-import { argument } from '@ember-decorators/argument';
-import { computed } from '@ember-decorators/object';
 import Component from '@ember/component';
-import EmberObject from '@ember/object';
-import { inject as service } from '@ember-decorators/service';
+import EmberObject, { computed } from '@ember/object';
+import { inject as service } from '@ember/service';
 
 import styleString from '@xdam/ember-partials/utils/style-string';
 
@@ -40,7 +35,6 @@ export default class XepToolbarComponent extends Component {
    * @argument [testSelector]
    * @type {String}
    */
-  @argument(optional('string'))
   @attribute('data-test-toolbar')
   testSelector;
 
@@ -49,7 +43,6 @@ export default class XepToolbarComponent extends Component {
    * @argument [register]
    * @type {String}
    */
-  @argument(optional('string'))
   register;
 
   /**
@@ -57,12 +50,6 @@ export default class XepToolbarComponent extends Component {
    * @argument [position]
    * @type {Object<top: String, right: String, bottom: String, left: String>}
    */
-  @argument(optional(shapeOf({
-    top: optional('string'),
-    right: optional('string'),
-    bottom: optional('string'),
-    left: optional('string'),
-  })))
   position;
 
   /**
@@ -70,7 +57,6 @@ export default class XepToolbarComponent extends Component {
    * @argument [orientation]
    * @type {"horizontal"|"vertical"}
    */
-  @argument(oneOf('horizontal', 'vertical'))
   orientation = 'horizontal';
 
   /**
@@ -78,7 +64,6 @@ export default class XepToolbarComponent extends Component {
    * @argument [variantType]
    * @type {String}
    */
-  @argument(optional(oneOf(...Object.keys(VARIANT_TYPES))))
   variant = 'standard';
 
   // Map of classNames for each variant type

package/addon/services/xep-manager.js

@@ -1,6 +1,6 @@
 import Service from '@ember/service';
 import Evented from '@ember/object/evented';
-import { action } from '@ember-decorators/object';
+import { action } from '@ember/object';
 import ResizeObserver from 'resize-observer-polyfill';
 
 /**

package/addon/templates/components/xep-avatar.hbs

@@ -3,7 +3,7 @@
     class="xep-avatar__image"
     src={{@image}}
     alt={{this.name}}
-    role="presentation"
+    role="img"
   >
 {{else}}
   <div class="xep-avatar__text">

package/app/styles/ember-partials/components/xep-avatar.scss

@@ -1,24 +1,24 @@
-.xep-avatar {
-  display: inline-block;
-  position: relative;
-  border-radius: 50%;
-  overflow: hidden;
-  text-decoration: none;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-
-  &__image,
-  &__text {
-    display: block;
-  }
-
-  &__image {
-    border: 0;
-  }
-
-  &__text {
-    color: $mdc-theme-on-primary;
-    text-transform: uppercase;
-  }
-}
+.xep-avatar {
+  display: inline-block;
+  position: relative;
+  border-radius: 50%;
+  overflow: hidden;
+  text-decoration: none;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+
+  &__image,
+  &__text {
+    display: block;
+  }
+
+  &__image {
+    border: 0;
+  }
+
+  &__text {
+    color: $mdc-theme-on-primary;
+    text-transform: uppercase;
+  }
+}

package/app/styles/ember-partials/components/xep-bubble.scss

@@ -1,20 +1,20 @@
-$xep-bubble-font-size: 0.65rem;
-
-.xep-bubble {
-  display: inline-block;
-  min-width: $xep-bubble-font-size * 2;
-  line-height: $xep-bubble-font-size * 2;
-  // padding: 3px;
-  border-radius: 50%;
-  font-size: $xep-bubble-font-size;
-  text-align: center;
-  background: $mdc-theme-primary;
-  color: $mdc-theme-on-primary;
-  font-weight: bold;
-
-  &--floating {
-    position: absolute;
-    top: -#{$xep-bubble-font-size / 2};
-    right: -#{$xep-bubble-font-size / 2};
-  }
-}
+$xep-bubble-font-size: 0.65rem;
+
+.xep-bubble {
+  display: inline-block;
+  min-width: $xep-bubble-font-size * 2;
+  line-height: $xep-bubble-font-size * 2;
+  // padding: 3px;
+  border-radius: 50%;
+  font-size: $xep-bubble-font-size;
+  text-align: center;
+  background: $mdc-theme-primary;
+  color: $mdc-theme-on-primary;
+  font-weight: bold;
+
+  &--floating {
+    position: absolute;
+    top: -#{$xep-bubble-font-size / 2};
+    right: -#{$xep-bubble-font-size / 2};
+  }
+}

package/app/styles/ember-partials/components/xep-button.scss

@@ -1,58 +1,58 @@
-.xep-button {
-  &__trailing-icon {
-    // Note: styles reflect .mdc-button__icon
-    margin-right: 0;
-    margin-left: 8px;
-    display: inline-block;
-    width: 18px;
-    height: 18px;
-    font-size: 18px;
-    vertical-align: top;
-  }
-
-  // Attempt to strip down some properties
-  &--unstyled {
-    min-width: 0;
-
-    &:not(:disabled) {
-      color: currentColor;
-    }
-
-    &::before,
-    &::after {
-      background-color: transparent;
-    }
-  }
-
-  &.mdc-icon-button {
-    min-width: 0;
-  }
-
-  // Button colors...
-  @each $name, $value in $xep-colors {
-    &--#{"" + $name}-color {
-      &:not(:disabled) {
-        color: $value;
-      }
-
-      &.mdc-button--raised,
-      &.mdc-button--unelevated {
-        &:not(:disabled) {
-          background-color: $value;
-          color: $mdc-theme-on-primary;
-        }
-      }
-
-      &.mdc-button--outlined {
-        &:not(:disabled) {
-          border-color: $value;
-        }
-      }
-
-      &::before,
-      &::after {
-        background-color: $value;
-      }
-    }
-  }
-}
+.xep-button {
+  &__trailing-icon {
+    // Note: styles reflect .mdc-button__icon
+    margin-right: 0;
+    margin-left: 8px;
+    display: inline-block;
+    width: 18px;
+    height: 18px;
+    font-size: 18px;
+    vertical-align: top;
+  }
+
+  // Attempt to strip down some properties
+  &--unstyled {
+    min-width: 0;
+
+    &:not(:disabled) {
+      color: currentColor;
+    }
+
+    &::before,
+    &::after {
+      background-color: transparent;
+    }
+  }
+
+  &.mdc-icon-button {
+    min-width: 0;
+  }
+
+  // Button colors...
+  @each $name, $value in $xep-colors {
+    &--#{"" + $name}-color {
+      &:not(:disabled) {
+        color: $value;
+      }
+
+      &.mdc-button--raised,
+      &.mdc-button--unelevated {
+        &:not(:disabled) {
+          background-color: $value;
+          color: $mdc-theme-on-primary;
+        }
+      }
+
+      &.mdc-button--outlined {
+        &:not(:disabled) {
+          border-color: $value;
+        }
+      }
+
+      &::before,
+      &::after {
+        background-color: $value;
+      }
+    }
+  }
+}

package/app/styles/ember-partials/components/xep-drawer.scss

@@ -1,21 +1,21 @@
-.xep-drawer {
-  top: 0;
-  border: none;
-
-  &--right {
-    right: 0;
-    left: initial;
-
-    &.mdc-drawer--animate {
-      transform: translateX(100%);
-    }
-
-    &.mdc-drawer--opening {
-      transform: translateX(0);
-    }
-
-    &.mdc-drawer--closing {
-      transform: translateX(100%);
-    }
-  }
-}
+.xep-drawer {
+  top: 0;
+  border: none;
+
+  &--right {
+    right: 0;
+    left: initial;
+
+    &.mdc-drawer--animate {
+      transform: translateX(100%);
+    }
+
+    &.mdc-drawer--opening {
+      transform: translateX(0);
+    }
+
+    &.mdc-drawer--closing {
+      transform: translateX(100%);
+    }
+  }
+}

package/app/styles/ember-partials/components/xep-snackbar.scss

@@ -1,3 +1,3 @@
-.xep-snackbar {
-  z-index: 2; // snackbar show be elevated above toolbars
-}
+.xep-snackbar {
+  z-index: 2; // snackbar show be elevated above toolbars
+}