implab/implabjs-djx Files · src/test/ts/view/MyWidget.tsx

* tsx/{Xxx}Context renamed to tsx/{Xxx}Rendition, for old types made...

* tsx/{Xxx}Context renamed to tsx/{Xxx}Rendition, for old types made compatibility stubs with @deprected comments * Improved handling of functional component output, added support for boolean, null, undefined and widgets. * RenditionBase: fixed startup for the DocumentFragment nodes * startupWidgets: fixed startup of the widget when passed domNode of the widget. * DjxFragment converted to the functional component

cin - - Load All Authors

File last commit:

r57:f2499237b5bf v1.0.9 default


                r63:1a0018655d1c

v1.1.0 default

Download file

             MyWidget.tsx
        
                    50 lines
            
             | 1.3 KiB
            
                | text/x-typescript
            
             |
                TypeScriptLexer
            
             / src / test / ts / view / MyWidget.tsx
          
                    History
                
                 |
                  Source
                 | Raw
                 |Copy content
                 |Copy permalink

        cin
    
Added 'Attrs', 'Events' type parameters to DjxWidgetBase, typed 'on' and 'emit' methods

              r30
            
      import { djbase, djclass, bind, prototype, AbstractConstructor } from "../declare";

        cin
    
fixed strict mode @bind decorator

              r28
            
      import { DjxWidgetBase } from "../tsx/DjxWidgetBase";

      import { createElement } from "../tsx";

        cin
    
Added 'Attrs', 'Events' type parameters to DjxWidgetBase, typed 'on' and 'emit' methods

              r30
            
      interface MyWidgetAttrs {

          title: string;

          counter: number;

      }

      interface MyWidgetEvents {

          "count-inc": Event;

          "count-dec": Event;

      }

        cin
    
fixed strict mode @bind decorator

              r28
            
      @djclass

        cin
    
Added 'Attrs', 'Events' type parameters to DjxWidgetBase, typed 'on' and 'emit' methods

              r30
            
      export class MyWidget extends djbase(DjxWidgetBase as AbstractConstructor<DjxWidgetBase<MyWidgetAttrs, MyWidgetEvents>>) {

        cin
    
fixed strict mode @bind decorator

              r28
            
        cin
    
Support for Function Components...

              r34
            
          @bind({ node: "titleNode", type: "innerHTML" })

        cin
    
fixed strict mode @bind decorator

              r28
            
          title = "";

          @prototype()

          counter = 0;

          render() {

        cin
    
Support for Function Components...

              r34
            
              const Frame = (props: any) => <div>{props.children}</div>;

        cin
    
DjxWidgetBase: implemented copying content from srcNode to contentNode

              r57
            
              return <div className="myWidget" onsubmit={e => this._onSubmit(e)} tabIndex={3} style={{ alignContent: "center", border: "1px solid" }} >

        cin
    
fixed strict mode @bind decorator

              r28
            
                  <h1 data-dojo-attach-point="titleNode"></h1>

        cin
    
Support for Function Components...

              r34
            
                  <Frame>

                      <span class="up-button" onclick={e => this._onIncClick(e)}>[+]</span>

        cin
    
Corrected tsx typings

              r41
            
                      <span class="down-button" onclick={() => this._onDecClick()}>[-]</span>

        cin
    
Support for Function Components...

              r34
            
                  </Frame>

        cin
    
fixed strict mode @bind decorator

              r28
            
              </div>;

          }

        cin
    
DjxWidgetBase: implemented copying content from srcNode to contentNode

              r57
            
          _onSubmit(e: Event) {

          }

        cin
    
Support for Function Components...

              r34
            
          _onIncClick(e: MouseEvent) {

              this.emit("count-inc", { bubbles: false });

        cin
    
Added 'Attrs', 'Events' type parameters to DjxWidgetBase, typed 'on' and 'emit' methods

              r30
            
          }

          _onDecClick() {

        cin
    
Support for Function Components...

              r34
            
              this.emit("count-dec", { bubbles: false });

        cin
    
Added 'Attrs', 'Events' type parameters to DjxWidgetBase, typed 'on' and 'emit' methods

              r30
            
          }

        cin
    
fixed strict mode @bind decorator

              r28
            
      }

	Site-wide shortcuts
/	Use quick search box
g h	Goto home page
g g	Goto my private gists page
g G	Goto my public gists page
g 0-9	Goto bookmarked items from 0-9
n r	New repository page
n g	New gist page

	Repositories
g s	Goto summary page
g c	Goto changelog page
g f	Goto files page
g F	Goto files page with file search activated
g p	Goto pull requests page
g o	Goto repository settings
g O	Goto repository access permissions settings
t s	Toggle sidebar on some pages

cin Added 'Attrs', 'Events' type parameters to DjxWidgetBase, typed 'on' and 'emit' methods	r30	import { djbase, djclass, bind, prototype, AbstractConstructor } from "../declare";
cin fixed strict mode @bind decorator	r28
		import { DjxWidgetBase } from "../tsx/DjxWidgetBase";
		import { createElement } from "../tsx";

cin Added 'Attrs', 'Events' type parameters to DjxWidgetBase, typed 'on' and 'emit' methods	r30	interface MyWidgetAttrs {
		title: string;

		counter: number;
		}

		interface MyWidgetEvents {
		"count-inc": Event;

		"count-dec": Event;
		}

cin fixed strict mode @bind decorator	r28
		@djclass
cin Added 'Attrs', 'Events' type parameters to DjxWidgetBase, typed 'on' and 'emit' methods	r30	export class MyWidget extends djbase(DjxWidgetBase as AbstractConstructor<DjxWidgetBase<MyWidgetAttrs, MyWidgetEvents>>) {
cin fixed strict mode @bind decorator	r28
cin Support for Function Components...	r34	@bind({ node: "titleNode", type: "innerHTML" })
cin fixed strict mode @bind decorator	r28	title = "";

		@prototype()
		counter = 0;

		render() {
cin Support for Function Components...	r34	const Frame = (props: any) => <div>{props.children}</div>;
cin DjxWidgetBase: implemented copying content from srcNode to contentNode	r57	return <div className="myWidget" onsubmit={e => this._onSubmit(e)} tabIndex={3} style={{ alignContent: "center", border: "1px solid" }} >
cin fixed strict mode @bind decorator	r28	<h1 data-dojo-attach-point="titleNode"></h1>
cin Support for Function Components...	r34	<Frame>
		<span class="up-button" onclick={e => this._onIncClick(e)}>[+]</span>
cin Corrected tsx typings	r41	<span class="down-button" onclick={() => this._onDecClick()}>[-]</span>
cin Support for Function Components...	r34	</Frame>
cin fixed strict mode @bind decorator	r28	</div>;
		}

cin DjxWidgetBase: implemented copying content from srcNode to contentNode	r57	_onSubmit(e: Event) {

		}

cin Support for Function Components...	r34	_onIncClick(e: MouseEvent) {
		this.emit("count-inc", { bubbles: false });
cin Added 'Attrs', 'Events' type parameters to DjxWidgetBase, typed 'on' and 'emit' methods	r30	}

		_onDecClick() {
cin Support for Function Components...	r34	this.emit("count-dec", { bubbles: false });
cin Added 'Attrs', 'Events' type parameters to DjxWidgetBase, typed 'on' and 'emit' methods	r30	}
cin fixed strict mode @bind decorator	r28	}