How to use the ember-power-select/components/power-select-multiple.extend function in ember-power-select

import $ from 'jquery';
import PowerSelectMultiple from 'ember-power-select/components/power-select-multiple';
import {bind} from '@ember/runloop';

const endActions = 'click.ghToken mouseup.ghToken touchend.ghToken';

// triggering focus on the search input within ESA's onfocus event breaks the
// drag-n-drop functionality in ember-drag-drop so we watch for events that
// could be the start of a drag and disable the default focus behaviour until
// we get another event signalling the end of a drag

export default PowerSelectMultiple.extend({

    tagName: 'div',

    _canFocus: true,

    willDestroyElement() {
        this._super(...arguments);

        if (this._allowFocusListener) {
            $(window).off(endActions, this._allowFocusListener);
        }
    },

    actions: {
        optionMouseDown(event) {
            if (event.which === 1 && !event.ctrlKey) {

import PowerSelectMultipleComponent from 'ember-power-select/components/power-select-multiple';
import layout from '../templates/components/model-select-multiple';
import fallbackIfUndefined from '../utils/computed-fallback-if-undefined';

/**
 * {{model-select-multiple}} component. This is a wrapper around the normal model-select component. The same arguments apply.
 *
 * @class ModelSelectMultipleComponent
 */
export default PowerSelectMultipleComponent.extend({
  layout,

  triggerClass: fallbackIfUndefined('ember-model-select-multiple-trigger'),

  actions: {
    change(option, select){
      const suggestion = option.find(item => item.__isSuggestion__);

      if(suggestion){
        this.get('oncreate')(suggestion.__value__, select);
      } else {
        this.get('onchange')(option, select);
      }
    }
  }
});