add subwidget example

Author: gavinr

builder-2d/widgets/MyWidget/Widget.ts

@@ -16,6 +16,7 @@ import Query from 'esri/tasks/query';
 import * as on from 'dojo/on';
 
 import IConfig from './config';
+import Subwidget from './widgets/Subwidget';
 
 interface IWidget {
   baseClass: string;
@@ -29,13 +30,20 @@ class Widget implements IWidget {
 
   private map: EsriMap;
   private widgetWrapper: HTMLElement;
+  private subwidget: Subwidget;
 
   private postCreate(args: any): void {
     const self: any = this;
     self.inherited(arguments);
 
     this.widgetWrapper.innerHTML = this.config.demoSetting;
     this.createLayer();
+
+    // create a new instance of "Subwidget" wich is just a plain old dojo Widget.
+    this.subwidget = new Subwidget({
+      text: 'This is a subwidget.'
+    });
+    this.subwidget.placeAt(this.widgetWrapper, 'last');
   }
 
   /**
@@ -45,8 +53,7 @@ class Widget implements IWidget {
     const layer: FeatureLayer = new FeatureLayer(
       'https://sampleserver6.arcgisonline.com/arcgis/rest/services/Recreation/FeatureServer/0',
     );
-    on.once(this.map, 'update-end', (evt) => {
-      console.log('evt', evt);
+    on.once(this.map, 'update-end', () => {
       this.queryLayer(layer);
     });
     this.map.addLayers([layer]);

builder-2d/widgets/MyWidget/widgets/Subwidget.html

@@ -0,0 +1,3 @@
+<div>
+  Subwidget!
+</div>

builder-2d/widgets/MyWidget/widgets/Subwidget.ts

@@ -0,0 +1,25 @@
+/// <amd-dependency path="dojo/text!./Subwidget.html" name="template" />
+declare var template: any;
+
+import declare from '../support/declareDecorator';
+import WidgetBase from 'dijit/_WidgetBase';
+import _TemplatedMixin from 'dijit/_TemplatedMixin';
+import _WidgetsInTemplateMixin from 'dijit/_WidgetsInTemplateMixin';
+
+// This line tells Typescript that our Subwidget extends from WidgetBase,
+// so when we call built-in properties or functions (like .placeAt()), 
+// Typescript will not error:
+interface Subwidget extends WidgetBase {};
+
+@declare(WidgetBase, _TemplatedMixin, _WidgetsInTemplateMixin)
+class Subwidget {
+  private templateString: string = template;
+
+  baseClass: string = 'subwidget';
+
+  constructor(params?: any, srcNodeRef?: dojo.NodeOrString) {
+    // lang.mixin(this, params);
+  }
+}
+
+export default Subwidget;