9/9/2016 - 8:52 PM


import Ember from 'ember';

const { 
} = Ember;

export default Mixin.create({
  classNameBindings: ['idClass'],

   * This is used in components to identify the id of the component's model.
   * The recommended use is to define this property within your component
   * using, `computed.readOnly('')`. This will automatically add an
   * id class that looks like `id-5`.
   * @type {Integer}
  idKey: null,

   * Computed property that builds out the id class name that can be used for
   * reference of testing
   * @param  {Integer} 'idKey' Integer that is observed for changes
   * @return {String} Class name to be added to component
  idClass: computed('idKey', function() {
    const idKey = get(this, 'idKey');

    return idKey ? `id-${idKey.dasherize()}` : null;

   * Within this init, a script is ran that fetches the component name, and
   * creates a kebab case string from it that is then added to the component
   * as a class name
   * @return {Undefined}
  init() {

    // Auto add the component name as a class to the element
    let componentName = this._debugContainerKey;
    componentName = componentName.split(":").pop();
    componentName = componentName.replace('/', '-');

    get(this, 'classNames').push(componentName);