fix navigate component

ui/app/components/navigate-input.js

@@ -163,24 +163,25 @@ export default Component.extend(FocusOnInsertMixin, {
   },
 
   actions: {
-    handleInput: function(event) {
-      var filter = event.target.value;
+    handleInput: function(filter) {
       this.get('filterDidChange')(filter);
       debounce(this, 'filterUpdated', filter, 200);
     },
 
     setFilterFocused: function(isFocused) {
       this.get('filterFocusDidChange')(isFocused);
+      console.log(isFocused);
     },
 
-    handleKeyPress: function(val, event) {
+    handleKeyPress: function(event) {
       if (event.keyCode === keys.TAB) {
         this.onTab(event);
       }
     },
 
-    handleKeyUp: function(val, event) {
+    handleKeyUp: function(event) {
       var keyCode = event.keyCode;
+      let val = event.target.value;
       if (keyCode === keys.ENTER) {
         this.onEnter(val);
       }

ui/app/templates/components/navigate-input.hbs

@@ -1,16 +1,17 @@
 <div class="field">
   <p class="control has-icons-left has-icons-right">
-  {{input
-    value=filter
-    placeholder=(or placeholder "Filter keys")
+  <input
     class="filter input"
-    disabled=disabled
-    key-up=(action "handleKeyUp")
-    key-down=(action "handleKeyPress")
-    input=(action "handleInput")
-    focus-in=(action "setFilterFocused" true)
-    focus-out=(action "setFilterFocused" false)
-    }}
+    disabled={{disabled}}
+    value={{@filter}}
+    placeholder={{ or @placeholder "Filter keys" }}
+
+    oninput={{action "handleInput" value="target.value"}}
+    onkeyup={{action "handleKeyUp" }}
+    onkeydown={{action "handleKeyPress"}} 
+    onfocus={{action "setFilterFocused" true}}
+    onblur={{action "setFilterFocused" false}}
+   /> 
 
     {{i-con glyph="ios-search-strong" class="is-left has-text-grey" size=18}}
   </p>