Aurelia custom element for auto completion using awesomeplete

auto-complete.js

import {bindable, inject, inlineView} from 'aurelia-framework';
import * as Awe from 'awesomplete'; //eslint-disable-line

/* USAGE:
<auto-complete 
  data.two-way="values" 
  selected.bind="selectedValue" 
  placeholder="Select a value" 
  label="Autocomplete">
</auto-complete>



*/

export class AwesompleteFactory {
  create(input) {
    const awe = new Awesomplete(input);

    // monkey patch Awesomplete to add toggle function
    awe.toggle = function () {
      if (this.ul.childNodes.length === 0) {
        this.minChars = 0;
        this.evaluate();
      } else if (this.ul.hasAttribute('hidden')) {
        this.evaluate();
        this.open();
      } else {
        this.evaluate();
        this.close();
      }
    };

    return awe;
  }
}

@inject(AwesompleteFactory)
@inlineView(`<template>
  <label for.bind="inputId">${label}</label>
  <input name.bind="inputId"
         id.bind="inputId"
         placeholder.bind="placeholder"
         selected.two-way="selectedFilter">
</template>`)
export class AutoComplete {
  const SELECT_COMPLETE = 'awesomplete-selectcomplete';

  @bindable data;
  input;
  @bindable inputId;
  @bindable label;
  @bindable placeholder;
  awe;

  constructor(awesompleteFactory) {
    this.awesompleteFactory = awesompleteFactory;
  }

  listener(e) {
    this.selected = e.target.value;
    e.target.value = null;
  }

  attached() {
    this.input = document.getElementById(this.inputId);
    this.awe = this.awesompleteFactory.create(this.input);
    this.awe.list = this.data;
    this.input.addEventListener(this.SELECT_COMPLETE, this.listener);
  }

  detached() {
    this.input.removeEventListener(this.SELECT_COMPLETE, this.listener);
  }

  toggle() {
    this.input.value = '';
    this.awe.toggle();
  }
}

Hi I'm using type script so I'm getting some errors. I want to fix those can you help me sort out these
Awesomplete(input) : from where this constructor comming from.