"use strict"; import * as ko from "knockout"; import componentStrings = require("ojL10n!./resources/nls/demo-update-item-strings"); import Context = require("ojs/ojcontext"); import Composite = require("ojs/ojcomposite"); import "ojs/ojknockout"; import * as ResponsiveUtils from "ojs/ojresponsiveutils"; import * as ResponsiveKnockoutUtils from "ojs/ojresponsiveknockoututils"; import "ojs/ojformlayout"; import "ojs/ojinputtext"; export default class ViewModel implements Composite.ViewModel { busyResolve: (() => void); composite: Element; messageText: ko.Observable; properties: Composite.PropertiesType; res: { [key: string]: string }; smallQuery = ResponsiveUtils.getFrameworkQuery( ResponsiveUtils.FRAMEWORK_QUERY_KEY.SM_ONLY); isSmall: ko.Observable = ResponsiveKnockoutUtils.createMediaQueryObservable(this.smallQuery!); labelEdge: ko.Computed = ko.computed(() => { return this.isSmall() ? "top" : "start"; }, this); constructor(context: Composite.ViewModelContext) { //At the start of your viewModel constructor const elementContext: Context = Context.getContext(context.element); const busyContext: Context.BusyContext = elementContext.getBusyContext(); const options = {description: "Web Component Startup - Waiting for data"}; this.busyResolve = busyContext.addBusyState(options); this.composite = context.element; //Example observable this.messageText = ko.observable("Hello from demo-update-item"); this.properties = context.properties; this.res = componentStrings["demo-update-item"]; // Example for parsing context properties // if (context.properties.name) { // parse the context properties here // } //Once all startup and async activities have finished, relocate if there are any async activities this.busyResolve(); } //Lifecycle methods - implement if necessary activated(context: Composite.ViewModelContext): Promise | void { }; connected(context: Composite.ViewModelContext): void { }; bindingsApplied(context: Composite.ViewModelContext): void { }; propertyChanged(context: Composite.PropertyChangedContext): void { }; disconnected(element: Element): void { }; };