can/demos/forms/elements-text-enter.html

MIT-licensed, client-side, JavaScript framework that makes building rich web applications easy.

<text-enter></text-enter>

<script src="../../node_modules/steal/steal.js" dev-bundle main="@empty" id="demo-source">
import { domEvents, enterEvent, StacheElement } from "can";

domEvents.addEvent(enterEvent);

class TextEnter extends StacheElement {
    static view = `
        <p>
            whatYouTyped: {{ this.whatYouTyped }}
        </p>
        <label>
            Type something and then hit the Enter key:
            <input type="text" value:from="this.whatYouTyped" on:enter:value:to="this.whatYouTyped">
        </label>
    `;

    static props = {
        whatYouTyped: ""
    };
};
customElements.define("text-enter", TextEnter);
</script>