@wavemaker/app-runtime-wm-build 11.4.2-rc.5403 → 11.4.2-rc.5559

app-runtime-wm-build/wmapp/scripts/wm-loader.js

@@ -17071,7 +17071,9 @@
         };
         BaseFormCustomComponent.prototype.invokeOnChange = function(value, $event, valid) {
             this._onChange(value);
-            _super.prototype.invokeOnChange.call(this, value, $event);
+            if (valid) {
+                _super.prototype.invokeOnChange.call(this, value, $event);
+            }
         };
         BaseFormCustomComponent.prototype.invokeOnTouched = function($event) {
             this._onTouched();
@@ -22705,7 +22707,7 @@
         type: core$1.Component,
         args: [ {
             selector: "[wmSearch]",
-            template: '<ng-template #customItemTemplate let-model="item" let-index="index" let-query="query" let-match="match">\n    \x3c!-- Default item template --\x3e\n    <a *ngIf="!content">\n        <img *ngIf="model.imgSrc" [src]="model.imgSrc" alt="Search" [style.width]="imagewidth">\n        <span [title]="model.label" [innerHtml]="highlight(match, query) || model.label"></span>\n    </a>\n    \x3c!-- Custom partial template --\x3e\n    <a *ngIf="content" [ngClass]="{customTemplate: content}" partialContainer [wmItemTemplate]="content" [userComponentParams]="match.item">\n        <div partial-container-target></div>\n    </a>\n</ng-template>\n\n<ng-template #customListTemplate let-matches="matches" let-itemTemplate="itemTemplate" let-query="query">\n    <ul #ulElement class="app-search dropdown-menu" scrollable>\n        <li #liElements *ngFor="let match of matches" [ngClass]="{active: typeaheadContainer && typeaheadContainer.isActive(match), \'list-group-header\': match && match.isHeader()}"\n            (mouseenter)="typeaheadContainer.selectActive(match);"\n            (click)="match && !match.isHeader() && typeaheadContainer.selectMatch(match, $event); $typeaheadEvent = $event; notifySubscriber();">\n            \x3c!-- itemTemplate comes from the <input> --\x3e\n            <h4 *ngIf="match.isHeader()" class="group-title">{{match.value}}</h4>\n            <ng-container *ngIf="!match.isHeader()" [ngTemplateOutlet]="itemTemplate"\n                          [ngTemplateOutletContext]="{item: match.item, index: i, match: match, query: query}">\n            </ng-container>\n        </li>\n        <div class="status" [hidden]="_loadingItems || !(datacompletemsg && dataProvider.isLastPage)">\n            <span [textContent]="datacompletemsg"></span>\n        </div>\n        <div class="status" [hidden]="!_loadingItems">\n            <i class="fa fa-circle-o-notch fa-spin"></i>\n            <span [textContent]="loadingdatamsg"></span>\n        </div>\n    </ul>\n</ng-template>\n\n\x3c!--This template is for search inside mobile navbar.--\x3e\n<ng-container *ngIf="navsearchbar; else searchTemplate">\n    <input [title]="query || \'\'" type="text" class="app-textbox form-control list-of-objs app-search-input" [placeholder]="placeholder || \'\'"\n           focus-target\n           container="body"\n           [disabled]="disabled"\n           autocomplete="off"\n           [(ngModel)]="query"\n           [readonly]="readonly"\n           [disabled]="disabled"\n           [typeahead]="typeaheadDataSource"\n           [typeaheadWaitMs]="debouncetime"\n           [typeaheadItemTemplate]="customItemTemplate"\n           [optionsListTemplate]="customListTemplate"\n           (input)="onInputChange($event)"\n           (keydown)="listenQuery = true"\n           (keydown.enter)="$typeaheadEvent = $event;handleEnterEvent($event)"\n           (keydown.arrowdown)="selectNext($event)"\n           (blur)="invokeOnTouched($event)"\n           (click)="handleFocus($event);"\n           (focus)="_unsubscribeDv = false; listenQuery = true; handleFocus($event); invokeOnFocus($event);"\n           (focusout)="onFocusOut()"\n           [typeaheadMinLength]="minchars"\n           [typeaheadOptionsLimit]="limit"\n           (typeaheadLoading)="_loadingItems"\n           (typeaheadOnSelect)="typeaheadOnSelect($event)"\n           typeaheadOptionField="label"\n           [typeaheadGroupField]="groupby ? \'groupby\' : null"\n           [typeaheadAsync]="true"\n           [typeaheadScrollable]="true"\n           [adaptivePosition]="true"\n           [typeaheadOptionsInScrollableView]="optionslimitinscrollableview"\n           [dropup]="dropup"\n           [tabindex]="tabindex"\n           [attr.name]="name"\n           [attr.aria-label]="hint || \'Search field\'"/>\n    <i class="btn-close wi wi-cancel" [hidden]="!showClosebtn" (click)="clearSearch($event);"></i>\n</ng-container>\n\x3c!--This template is for both web and fullscreen mode in mobile.--\x3e\n<ng-template #searchTemplate>\n    <span class="wi wi-arrow-left form-control-feedback back-btn" aria-hidden="true" (click)="closeSearch()"></span>\n    <span class="sr-only">Back button</span>\n    <input [title]="query || \'\'" type="text" class="app-textbox form-control list-of-objs app-search-input" [placeholder]="placeholder || \'\'"\n           focus-target\n           [container]="containerTarget || \'body\'"\n           [disabled]="disabled"\n           autocomplete="off"\n           [(ngModel)]="query"\n           [readonly]="readonly"\n           [typeahead]="typeaheadDataSource"\n           [typeaheadWaitMs]="debouncetime"\n           [typeaheadItemTemplate]="customItemTemplate"\n           [optionsListTemplate]="customListTemplate"\n           (input)="onInputChange($event)"\n           (keydown)="listenQuery = true"\n           (keydown.enter)="$typeaheadEvent = $event;handleEnterEvent($event)"\n           (keydown.arrowdown)="selectNext($event)"\n           (blur)="invokeOnTouched($event); onFocusOut()"\n           (click)="handleFocus($event);"\n           (focus)="_unsubscribeDv = false; listenQuery = true; handleFocus($event); invokeOnFocus($event)"\n           [typeaheadMinLength]="minchars"\n           [typeaheadOptionsLimit]="limit"\n           (typeaheadLoading)="_loadingItems"\n           (typeaheadOnSelect)="typeaheadOnSelect($event)"\n           typeaheadOptionField="label"\n           [typeaheadGroupField]="groupby ? \'groupby\' : null"\n           [typeaheadAsync]="true"\n           [typeaheadScrollable]="true"\n           [adaptivePosition]="true"\n           [typeaheadOptionsInScrollableView]="optionslimitinscrollableview"\n           [tabindex]="tabindex"\n           [dropup]="dropup"\n           [attr.name]="name"\n           [attr.aria-label]="hint || \'Search field\'">\n    <input class="model-holder" ng-model="proxyModel" ng-required="required" tabindex="-1" aria-hidden="true">\n    <span *ngIf="_loadingItems" aria-hidden="true" class="fa fa-circle-o-notch fa-spin form-control-feedback"></span>\n    <span class="wi wi-close form-control-feedback clear-btn" [ngClass]="{\'show-btn\': isQueryEntered()}" (click)="clearSearch($event, true)"></span>\n    <span class="sr-only">Clear button</span>\n    <span *ngIf="showsearchicon" class="input-group-addon" aria-label="search icon" [ngClass]="{\'disabled\': disabled}">\n        <form>\n            <button title="Search" [disabled]="disabled" class="app-search-button wm-sl-l sl-search" type="submit"\n                    (click)="onSearchSelect($event)"></button>\n        </form>\n    </span>\n</ng-template>\n',
+            template: '<ng-template #customItemTemplate let-model="item" let-index="index" let-query="query" let-match="match">\n    \x3c!-- Default item template --\x3e\n    <a *ngIf="!content">\n        <img *ngIf="model.imgSrc" [src]="model.imgSrc" alt="Search" [style.width]="imagewidth">\n        <span [title]="model.label" [innerHtml]="highlight(match, query) || model.label"></span>\n    </a>\n    \x3c!-- Custom partial template --\x3e\n    <a *ngIf="content" [ngClass]="{customTemplate: content}" partialContainer [wmItemTemplate]="content" [userComponentParams]="match.item">\n        <div partial-container-target></div>\n    </a>\n</ng-template>\n\n<ng-template #customListTemplate let-matches="matches" let-itemTemplate="itemTemplate" let-query="query">\n    <ul #ulElement class="app-search dropdown-menu" scrollable>\n        <li #liElements *ngFor="let match of matches" [ngClass]="{active: typeaheadContainer && typeaheadContainer.isActive(match), \'list-group-header\': match && match.isHeader()}"\n            (mouseenter)="typeaheadContainer.selectActive(match);"\n            (click)="match && !match.isHeader() && typeaheadContainer.selectMatch(match, $event); $typeaheadEvent = $event; notifySubscriber();">\n            \x3c!-- itemTemplate comes from the <input> --\x3e\n            <h4 *ngIf="match.isHeader()" class="group-title">{{match.value}}</h4>\n            <ng-container *ngIf="!match.isHeader()" [ngTemplateOutlet]="itemTemplate"\n                          [ngTemplateOutletContext]="{item: match.item, index: i, match: match, query: query}">\n            </ng-container>\n        </li>\n        <div class="status" [hidden]="_loadingItems || !(datacompletemsg && dataProvider.isLastPage)">\n            <span [textContent]="datacompletemsg"></span>\n        </div>\n        <div class="status" [hidden]="!_loadingItems">\n            <i class="fa fa-circle-o-notch fa-spin"></i>\n            <span [textContent]="loadingdatamsg"></span>\n        </div>\n    </ul>\n</ng-template>\n\n\x3c!--This template is for search inside mobile navbar.--\x3e\n<ng-container *ngIf="navsearchbar; else searchTemplate">\n    <input [title]="query || \'\'" type="text" class="app-textbox form-control list-of-objs app-search-input" [placeholder]="placeholder || \'\'"\n           focus-target\n           container="body"\n           [disabled]="disabled"\n           autocomplete="off"\n           [(ngModel)]="query"\n           [readonly]="readonly"\n           [disabled]="disabled"\n           [typeahead]="typeaheadDataSource"\n           [typeaheadWaitMs]="debouncetime"\n           [typeaheadItemTemplate]="customItemTemplate"\n           [optionsListTemplate]="customListTemplate"\n           (input)="onInputChange($event)"\n           (keydown)="listenQuery = true"\n           (keydown.enter)="$typeaheadEvent = $event;handleEnterEvent($event)"\n           (keydown.arrowdown)="selectNext($event)"\n           (blur)="invokeOnTouched($event)"\n           (click)="handleFocus($event);"\n           (focus)="_unsubscribeDv = false; listenQuery = true; handleFocus($event); invokeOnFocus($event);"\n           (focusout)="onFocusOut()"\n           [typeaheadMinLength]="minchars"\n           [typeaheadOptionsLimit]="limit"\n           (typeaheadLoading)="_loadingItems"\n           (typeaheadOnSelect)="typeaheadOnSelect($event)"\n           typeaheadOptionField="label"\n           [typeaheadGroupField]="groupby ? \'groupby\' : null"\n           [typeaheadAsync]="true"\n           [typeaheadScrollable]="true"\n           [typeaheadOptionsInScrollableView]="optionslimitinscrollableview"\n           [dropup]="dropup"\n           [tabindex]="tabindex"\n           [attr.name]="name"\n           [attr.aria-label]="hint || \'Search field\'"/>\n    <i class="btn-close wi wi-cancel" [hidden]="!showClosebtn" (click)="clearSearch($event);"></i>\n</ng-container>\n\x3c!--This template is for both web and fullscreen mode in mobile.--\x3e\n<ng-template #searchTemplate>\n    <span class="wi wi-arrow-left form-control-feedback back-btn" aria-hidden="true" (click)="closeSearch()"></span>\n    <span class="sr-only">Back button</span>\n    <input [title]="query || \'\'" type="text" class="app-textbox form-control list-of-objs app-search-input" [placeholder]="placeholder || \'\'"\n           focus-target\n           [container]="containerTarget || \'body\'"\n           [disabled]="disabled"\n           autocomplete="off"\n           [(ngModel)]="query"\n           [readonly]="readonly"\n           [typeahead]="typeaheadDataSource"\n           [typeaheadWaitMs]="debouncetime"\n           [typeaheadItemTemplate]="customItemTemplate"\n           [optionsListTemplate]="customListTemplate"\n           (input)="onInputChange($event)"\n           (keydown)="listenQuery = true"\n           (keydown.enter)="$typeaheadEvent = $event;handleEnterEvent($event)"\n           (keydown.arrowdown)="selectNext($event)"\n           (blur)="invokeOnTouched($event); onFocusOut()"\n           (click)="handleFocus($event);"\n           (focus)="_unsubscribeDv = false; listenQuery = true; handleFocus($event); invokeOnFocus($event)"\n           [typeaheadMinLength]="minchars"\n           [typeaheadOptionsLimit]="limit"\n           (typeaheadLoading)="_loadingItems"\n           (typeaheadOnSelect)="typeaheadOnSelect($event)"\n           typeaheadOptionField="label"\n           [typeaheadGroupField]="groupby ? \'groupby\' : null"\n           [typeaheadAsync]="true"\n           [typeaheadScrollable]="true"\n           [typeaheadOptionsInScrollableView]="optionslimitinscrollableview"\n           [tabindex]="tabindex"\n           [dropup]="dropup"\n           [attr.name]="name"\n           [attr.aria-label]="hint || \'Search field\'">\n    <input class="model-holder" ng-model="proxyModel" ng-required="required" tabindex="-1" aria-hidden="true">\n    <span *ngIf="_loadingItems" aria-hidden="true" class="fa fa-circle-o-notch fa-spin form-control-feedback"></span>\n    <span class="wi wi-close form-control-feedback clear-btn" [ngClass]="{\'show-btn\': isQueryEntered()}" (click)="clearSearch($event, true)"></span>\n    <span class="sr-only">Clear button</span>\n    <span *ngIf="showsearchicon" class="input-group-addon" aria-label="search icon" [ngClass]="{\'disabled\': disabled}">\n        <form>\n            <button title="Search" [disabled]="disabled" class="app-search-button wm-sl-l sl-search" type="submit"\n                    (click)="onSearchSelect($event)"></button>\n        </form>\n    </span>\n</ng-template>\n',
             providers: [ base.provideAs(SearchComponent, forms.NG_VALUE_ACCESSOR, true), base.provideAs(SearchComponent, forms.NG_VALIDATORS, true), base.provideAsWidgetRef(SearchComponent) ]
         } ]
     } ];
@@ -28148,7 +28150,7 @@
     }, base.PROP_BOOLEAN) ], [ "clearbutton", Object.assign({
         value: true
     }, base.PROP_BOOLEAN) ], [ "adaptiveposition", Object.assign({
-        value: true
+        value: false
     }, base.PROP_BOOLEAN) ], [ "todaybuttonlabel", Object.assign({
         value: "LABEL_TODAY_DATE"
     }, base.PROP_STRING) ], [ "clearbuttonlabel", Object.assign({
@@ -28442,7 +28444,7 @@
     }, base.PROP_BOOLEAN) ], [ "clearbutton", Object.assign({
         value: true
     }, base.PROP_BOOLEAN) ], [ "adaptiveposition", Object.assign({
-        value: true
+        value: false
     }, base.PROP_BOOLEAN) ], [ "todaybuttonlabel", Object.assign({
         value: "LABEL_TODAY_DATE"
     }, base.PROP_STRING) ], [ "clearbuttonlabel", Object.assign({
@@ -38073,9 +38075,10 @@
         value;
     }
     var registerProps = function() {
-        base.register("wm-dialog", new Map([ [ "animation", base.PROP_STRING ], [ "class", base.PROP_STRING ], [ "closable", Object.assign({
-            value: true
-        }, base.PROP_BOOLEAN) ], [ "iconclass", {
+        base.register("wm-dialog", new Map([ [ "animation", base.PROP_STRING ], [ "class", base.PROP_STRING ], [ "closable", {
+            value: true,
+            PROP_BOOLEAN: base.PROP_BOOLEAN
+        } ], [ "iconclass", {
             value: "wi wi-file-text",
             PROP_STRING: base.PROP_STRING
         } ], [ "iconheight", base.PROP_STRING ], [ "iconmargin", base.PROP_STRING ], [ "iconurl", base.PROP_STRING ], [ "iconwidth", base.PROP_STRING ], [ "modal", Object.assign({
@@ -38110,7 +38113,7 @@
             _this = _super.call(this, inj, WIDGET_INFO, {
                 class: DIALOG_CLS + " " + (dialogClass || ""),
                 backdrop: backdrop,
-                keyboard: core.toBoolean(closable) ? true : !core.toBoolean(modal)
+                keyboard: !core.toBoolean(modal)
             }) || this;
             return _this;
         }
@@ -46913,9 +46916,6 @@
                 }
             } else {
                 this.resetPageNavigation();
-                if (newVal === "" || newVal === undefined || _.get(this.datasource, "category") === "wm.Variable") {
-                    this.variableInflight = false;
-                }
                 if (!this.variableInflight) {
                     this.callDataGridMethod("setStatus", "nodata", this.nodatamessage);
                 }
@@ -47055,7 +47055,7 @@
         };
         TableComponent.prototype.setGridData = function(serverData) {
             var data = this.filternullrecords ? this.removeEmptyRecords(serverData) : serverData;
-            if (_.get(this.datasource, "category") === "wm.Variable" || _.get(this.datasource, "category") === undefined) {
+            if (_.get(this.datasource, "category") === "wm.Variable") {
                 this.variableInflight = false;
             }
             if (!this.variableInflight) {
@@ -58673,14 +58673,14 @@
                 $event: $event
             });
         };
-        TabPaneComponent.prototype.select = function($event) {
+        TabPaneComponent.prototype.select = function($event, isKeyBoardEvent) {
             if (this.isActive || this.disabled) {
                 return;
             }
             this.isActive = true;
             this.$lazyLoad();
             this.redrawChildren();
-            this.notifyParent($event);
+            this.notifyParent($event, isKeyBoardEvent);
         };
         TabPaneComponent.prototype.tabpaneHeaderClick = function($event, paneIndex) {
             this.invokeEventCallback("headerclick", {
@@ -58718,8 +58718,8 @@
                 }
             }), 100);
         };
-        TabPaneComponent.prototype.notifyParent = function(evt) {
-            this.tabsRef.notifyChange(this, evt);
+        TabPaneComponent.prototype.notifyParent = function(evt, isKeyBoardEvent) {
+            this.tabsRef.notifyChange(this, evt, isKeyBoardEvent);
         };
         TabPaneComponent.prototype.handleSwipeLeft = function() {
             this.tabsRef.next();
@@ -58917,7 +58917,7 @@
                 paneRef.remove();
             }
         };
-        TabsComponent.prototype.notifyChange = function(paneRef, evt) {
+        TabsComponent.prototype.notifyChange = function(paneRef, evt, isKeyBoardEvent) {
             if (!this.isSelectableTab(paneRef)) {
                 return;
             }
@@ -58949,7 +58949,7 @@
             if (!evt || !headerElement || !headerElement.length) {
                 headerElement = this.nativeElement.querySelector("li[data-paneid=" + paneRef.widgetId + "]");
                 var insideTabs = !!$(headerElement).closest(".app-tabs").parent().closest(".app-tabs").length;
-                if (!insideTabs) {
+                if (!insideTabs && isKeyBoardEvent) {
                     $(headerElement).children().focus();
                 }
             }
@@ -59021,16 +59021,16 @@
                 }
             }
         };
-        TabsComponent.prototype.next = function($event) {
+        TabsComponent.prototype.next = function($event, isKeyBoardEvent) {
             var pane = this.getSelectableTabAfterIndex(this.getActiveTabIndex());
             if (pane) {
-                pane.select($event);
+                pane.select($event, isKeyBoardEvent);
             }
         };
-        TabsComponent.prototype.prev = function($event) {
+        TabsComponent.prototype.prev = function($event, isKeyBoardEvent) {
             var pane = this.getSelectableTabBeforeIndex(this.getActiveTabIndex());
             if (pane) {
-                pane.select($event);
+                pane.select($event, isKeyBoardEvent);
             }
         };
         TabsComponent.prototype.selectDefaultPaneByIndex = function(index) {
@@ -59119,13 +59119,13 @@
             switch (event.key) {
               case "ArrowLeft":
               case "ArrowUp":
-                this.prev();
+                this.prev(null, true);
                 event.preventDefault();
                 break;
 
               case "ArrowRight":
               case "ArrowDown":
-                this.next();
+                this.next(null, true);
                 event.preventDefault();
                 break;