##// END OF EJS Templates
Merge
Merge

File last commit:

r57:f2499237b5bf v1.0.9 default
r62:141ef477a5ff merge default
Show More
MyWidget.tsx
50 lines | 1.3 KiB | text/x-typescript | TypeScriptLexer
import { djbase, djclass, bind, prototype, AbstractConstructor } from "../declare";
import { DjxWidgetBase } from "../tsx/DjxWidgetBase";
import { createElement } from "../tsx";
interface MyWidgetAttrs {
title: string;
counter: number;
}
interface MyWidgetEvents {
"count-inc": Event;
"count-dec": Event;
}
@djclass
export class MyWidget extends djbase(DjxWidgetBase as AbstractConstructor<DjxWidgetBase<MyWidgetAttrs, MyWidgetEvents>>) {
@bind({ node: "titleNode", type: "innerHTML" })
title = "";
@prototype()
counter = 0;
render() {
const Frame = (props: any) => <div>{props.children}</div>;
return <div className="myWidget" onsubmit={e => this._onSubmit(e)} tabIndex={3} style={{ alignContent: "center", border: "1px solid" }} >
<h1 data-dojo-attach-point="titleNode"></h1>
<Frame>
<span class="up-button" onclick={e => this._onIncClick(e)}>[+]</span>
<span class="down-button" onclick={() => this._onDecClick()}>[-]</span>
</Frame>
</div>;
}
_onSubmit(e: Event) {
}
_onIncClick(e: MouseEvent) {
this.emit("count-inc", { bubbles: false });
}
_onDecClick() {
this.emit("count-dec", { bubbles: false });
}
}