classGreetingextendsCraft.UI.View{constructor(){super();this.views={local: newLocal(),world: newWorld()};}viewDidLoad(callback){this.appendView({id: "whom",component: this.views.local});if(callback){callback();}}greet(){this.replaceView({id: "whom",component: this.views.world});}style(componentId){return` .container { display: flex; flex-direction: row; } `;}template(componentId){return` <div class="root"> <div class="container> <div>Hello</div> <div id="whom"></div> </div> <button onclick="${componentId}.greet()">Greet</button> </div> `;}}classHelloPlaceextendsCraft.UI.View{constructor(){super();this.data={place: "Any Where"};}style(componentId){return` .msg { color: blue; } `;}template(componentId){return` <div class="root"> <span class="msg">${this.data.place}<\span> </div> `;}}classLocalextendsHelloPlace{constructor(){super();this.data={place: "Local"};}}classWorldextendsHelloPlace{constructor(){super();this.data={place: "World!"};}style(componentId){returnsuper.style(componentId)+` .msg { color: red; } `;}}