
import { component, on } from 'app-decorators';

@component({
    name: 'todo-new',
    extends: 'input',
})
class TodoNew {

    created(){

        this.classList.add('new-todo');
    }

    @on('keypress') onKeypress({ keyCode, target }){

        if (keyCode === 13) {
            let event = new CustomEvent('todo-new', {
                detail: target.value,
                bubbles: true,
            });
            document.dispatchEvent(event);
        }
    }
}

export {
    TodoNew
}
@@ -266,16 +266,57 @@
 == 13) %7B
+%0A%0A            // create and trigger event
 %0A       
@@ -489,16 +489,84 @@
 (event);
+%0A%0A            // cleanup target field%0A            target.value = '';
 %0A       

clean target field after typing todo