all files / addon/components/ el-tag.js

0% Statements 0/14
0% Branches 0/6
0% Functions 0/2
0% Lines 0/14
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65                                                                                                                                 
import Component from '@ember/component';
import layout from '../templates/components/el-tag';
import {computed, get, set} from "@ember/object";
import transition from "../utils/transition";
 
export default Component.extend({
  layout,
  tagName: 'span',
  classNames: ['el-tag'],
 
  classNameBindings: ['getClassName',
    'hit:is-hit',
    'isClosed:el-hidden',
  ],
 
 
  getClassName: computed('type', 'size', function () {
 
    let classNames = '';
 
    if (get(this, 'type')) {
      classNames += ` el-tag--${get(this, 'type')}`;
    }
    if (get(this, 'size')) {
      classNames += ` el-tag--${get(this, 'size')}`;
    }
 
    return classNames;
  }),
 
  isClosed: false,
 
  closable: false,
  type: '',
  hit: false,
  color: '',
  size: '',
 
  handleClose: null,
 
 
  actions: {
    handleClose() {
      // this.$().addClass('animated flipOutY');
      let e = this.element;
 
      let transitionEvent = transition('animation');
      e.addEventListener(transitionEvent, () => {
        set(this, 'isClosed', true);
        if (this.get('close')) {
          this.get('close')();
        }
      });
 
      e.classList.add('animated');
      e.classList.add('flipOutY');
 
    }
  },
 
 
 
});