@wavemaker/app-runtime-wm-build 11.4.0-next.1417070 → 11.4.0-next.1417072

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -11229,6 +11229,10 @@
11229
11229
  if (openedDialogs.indexOf(ref) !== -1) {
11230
11230
  openedDialogs.splice(openedDialogs.indexOf(ref), 1);
11231
11231
  }
11232
+ if (openedDialogs.length === 0 && core$1.isMobileApp()) {
11233
+ var parentSelector = $("body > app-root")[0];
11234
+ parentSelector.removeAttribute("aria-hidden");
11235
+ }
11232
11236
  };
11233
11237
  DialogServiceImpl.prototype.getOpenedDialogs = function() {
11234
11238
  return openedDialogs;
@@ -12404,7 +12408,8 @@
12404
12408
  mindate: "mindate",
12405
12409
  maxdate: "maxdate",
12406
12410
  excludedates: "excludedates",
12407
- excludedays: "excludedays"
12411
+ excludedays: "excludedays",
12412
+ invalidNumber: "invalidNumber"
12408
12413
  };
12409
12414
  var BaseFieldValidations = function() {
12410
12415
  function BaseFieldValidations(instance, formwidget, widgettype, widgetControl, widgetContext, tableFieldType) {
@@ -14215,7 +14220,7 @@
14215
14220
  var eventsTmpl = widgetType === core.FormWidgetType.UPLOAD ? "" : getEventsTemplate(attrs);
14216
14221
  var controlLayout = core.isMobileApp() ? "col-xs-12" : "col-sm-12";
14217
14222
  var isInList = pCounter === (parentList && parentList.get("parent_form_reference"));
14218
- attrs.set("__errormsg", formFieldErrorMsgId);
14223
+ attrs.set("__validationId", formFieldErrorMsgId);
14219
14224
  attrs.set("__widgetType", widgetType);
14220
14225
  attrs.delete("widget");
14221
14226
  shared.set("counter", counter);
@@ -28295,7 +28300,7 @@
28295
28300
  type: core.Component,
28296
28301
  args: [ {
28297
28302
  selector: "[wmDate]",
28298
- template: ' <input class="form-control app-textbox app-dateinput display-input"\n focus-target\n type="text"\n [name]="name"\n [tabindex]="tabindex"\n [value]="displayValue"\n (click)="toggleDpDropdown($event, true)"\n (focus)="onDateTimeInputFocus(); invokeOnFocus($event);"\n (blur)="onInputBlur($event)"\n [disabled]="disabled || readonly"\n [autofocus]="autofocus"\n [required]="required"\n [readOnly]="isReadOnly"\n [attr.placeholder]="placeholder"\n [attr.accesskey]="shortcutkey"\n [attr.aria-label]="hint"\n (change)="onDisplayDateChange($event)"\n (keydown)="this._triggeredByUser = true; onDisplayKeydown($event);">\n\n <span class="input-group-btn">\n <button type="button"\n class="btn btn-default btn-time"\n [tabindex]="tabindex"\n [disabled]="disabled || readonly"\n [attr.aria-label]="displayValue ? \'Change Date \' + displayValue : \'Choose date by pressing enter\'"\n aria-haspopup="true"\n aria-expanded="false"\n (click)="toggleDpDropdown($event, false)">\n <i aria-hidden="true"\n class="app-icon wm-sl-l sl-calendar"></i>\n </button>\n </span>\n <div style="width: 0;display: inline-block;">\n <input class="model-holder"\n aria-label="datepicker dropdownmenu"\n aria-controls="date"\n [container]="containerTarget || \'body\'"\n [bsConfig]="_dateOptions"\n [isOpen]="isOpen"\n #datepicker="bsDatepicker"\n bsDatepicker\n [daysDisabled]="excludedDaysToDisable"\n [datesDisabled]="excludedDatesToDisable"\n placement="bottom right"\n [isDisabled]="disabled || readonly"\n [bsValue]="bsDataValue"\n (onShown)="onDatePickerOpen()"\n (onHidden)="hideDatepickerDropdown()"\n (bsValueChange)="onDateChange($event)">\n</div>\n\n<ng-template [ngIf]="loadNativeDateInput">\n <wm-datetimepicker\n dateTimePicker\n mode="DATE"\n [config]="_dateOptions"\n [placement]="modal"\n [excludedDaysToDisable]="excludedDaysToDisable"\n [excludedDatesToDisable]="excludedDatesToDisable"\n [displayFormat]="dateInputFormat"\n [value]="bsDataValue"\n (change)="onDateChange($event)">\n </wm-datetimepicker>\n <div class="mobile-input mobile-datepicker-container"\n tabindex="1000000"\n (focus)="onDateTimeInputFocus(true); invokeOnFocus($event);"\n (blur)="onDateTimeInputBlur(); invokeOnTouched($event)"\n (click)="!(disabled || readonly || isCurrentDate) && showDatePickerModal()">\n </div>\n</ng-template>\n',
28303
+ template: ' <input class="form-control app-textbox app-dateinput display-input"\n focus-target\n type="text"\n [name]="name"\n [tabindex]="tabindex"\n [value]="displayValue"\n (click)="toggleDpDropdown($event, true)"\n (focus)="onDateTimeInputFocus(); invokeOnFocus($event);"\n (blur)="onInputBlur($event)"\n [disabled]="disabled || readonly"\n [autofocus]="autofocus"\n [required]="required"\n [readOnly]="isReadOnly"\n [attr.placeholder]="placeholder"\n [attr.accesskey]="shortcutkey"\n [attr.aria-label]="hint"\n (change)="onDisplayDateChange($event)"\n (keydown)="this._triggeredByUser = true; onDisplayKeydown($event);">\n\n <span class="input-group-btn">\n <button type="button"\n class="btn btn-default btn-time"\n [tabindex]="tabindex"\n [disabled]="disabled || readonly"\n [attr.aria-label]="displayValue ? \'Change Date \' + displayValue : \'Choose date by pressing enter\'"\n aria-haspopup="true"\n aria-expanded="false"\n (click)="toggleDpDropdown($event, false)">\n <i aria-hidden="true"\n class="app-icon wm-sl-l sl-calendar"></i>\n </button>\n </span>\n <div style="width: 0;display: inline-block;">\n <input class="model-holder"\n aria-label="datepicker dropdownmenu"\n aria-controls="date"\n [container]="containerTarget || \'body\'"\n [bsConfig]="_dateOptions"\n [isOpen]="isOpen"\n #datepicker="bsDatepicker"\n bsDatepicker\n [daysDisabled]="excludedDaysToDisable"\n [datesDisabled]="excludedDatesToDisable"\n placement="bottom right"\n [isDisabled]="disabled || readonly"\n [bsValue]="bsDataValue"\n (onShown)="onDatePickerOpen()"\n (onHidden)="hideDatepickerDropdown()"\n (bsValueChange)="onDateChange($event)">\n</div>\n\n<ng-template [ngIf]="loadNativeDateInput">\n <wm-datetimepicker\n dateTimePicker\n mode="DATE"\n [config]="_dateOptions"\n [placement]="modal"\n [excludedDaysToDisable]="excludedDaysToDisable"\n [excludedDatesToDisable]="excludedDatesToDisable"\n [displayFormat]="dateInputFormat"\n [value]="bsDataValue"\n (change)="onDateChange($event)">\n </wm-datetimepicker>\n <div class="mobile-input mobile-datepicker-container"\n tabindex="1000000"\n (focus)="onDateTimeInputFocus(true); invokeOnFocus($event);"\n (blur)="onDateTimeInputBlur(); invokeOnTouched($event)"\n (click)="!(disabled || readonly || isCurrentDate) && showDatePickerModal()">\n </div>\n</ng-template>\n',
28299
28304
  providers: [ base.provideAs(DateComponent, forms.NG_VALUE_ACCESSOR, true), base.provideAs(DateComponent, forms.NG_VALIDATORS, true), base.provideAsWidgetRef(DateComponent) ]
28300
28305
  } ]
28301
28306
  } ];
@@ -35726,6 +35731,8 @@
35726
35731
  }));
35727
35732
  var popoverStartBtn = popoverContainer.querySelector(".popover-start");
35728
35733
  var popoverEndBtn = popoverContainer.querySelector(".popover-end");
35734
+ popoverStartBtn.setAttribute("aria-hidden", "true");
35735
+ popoverEndBtn.setAttribute("aria-hidden", "true");
35729
35736
  popoverStartBtn.onkeydown = function(event) {
35730
35737
  var action = _this.keyEventPlugin.constructor.getEventFullKey(event);
35731
35738
  if (action === "shift.tab") {
@@ -36473,6 +36480,10 @@
36473
36480
  Object.assign(this.context, initState);
36474
36481
  this.modalOptions.ariaLabelledBy = this.titleId;
36475
36482
  this.dialogRef = this.bsModal.show(this.getTemplateRef(), this.modalOptions);
36483
+ if (this.dialogService.getOpenedDialogs().length === 1 && core.isMobileApp()) {
36484
+ var parentSelector = $("body > app-root")[0];
36485
+ parentSelector.setAttribute("aria-hidden", "true");
36486
+ }
36476
36487
  };
36477
36488
  BaseDialog.prototype.close = function() {
36478
36489
  if (this.dialogRef) {
@@ -45093,7 +45104,7 @@
45093
45104
  type: core$1.Component,
45094
45105
  args: [ {
45095
45106
  selector: "div[wmList]",
45096
- template: '<div class="panel-heading" *ngIf="title || subheading || iconclass">\n <h3 class="panel-title">\n <div class="pull-left">\n <i class="app-icon panel-icon {{iconclass}}" aria-hidden="true" [hidden]="!iconclass"></i>\n </div>\n <div class="pull-left">\n <div class="heading" [innerHTML]="title"></div>\n <div class="description" [innerHTML]="subheading"></div>\n </div>\n </h3>\n</div>\n\n<nav class="app-datanavigator" [attr.aria-disabled]="dataNavigator.isDisablePrevious" aria-label="Page navigation" *ngIf="navigation === \'Inline\' && !noDataFound">\n <ul class="pager">\n <li class="previous" [ngClass]="{\'disabled\': (dataNavigator ? dataNavigator.isDisablePrevious : true)}">\n <a href="javascript:void(0);" (click)="dataNavigator.navigatePage(\'prev\', $event)">\n <i class="wi wi-chevron-left" aria-hidden="true"></i>\n <span class="sr-only">Previous</span>\n </a>\n </li>\n </ul>\n</nav>\n<div *ngIf="navigation === \'Inline\' && !noDataFound" aria-live="polite" aria-atomic="true" class="sr-only"> {{\'Item \' + dataNavigator.dn.currentPage + \' of \' + dataNavigator.pageCount }}</div>\n\n<div>\n <div id={{titleId}} class="sr-only" >\n Press space bar to toggle drag drop mode, use arrow keys to move selected elements.\n </div>\n \n <div aria-live="assertive" *ngIf="listItems" class="sr-only" >\n {{ariaText + currentIndex + \' of \' + listItems.length}}\n </div> \n</div>\n\n<ul [attr.tabindex]="tabindex" [attr.aria-describedby] = "titleId" class="app-livelist-container clearfix {{direction === \'horizontal\' ? \'app-horizontal-list\': \'\'}} {{listclass}}" role="list"\n (keydown.enter)="handleKeyDown($event, \'select\')"\n\n (keydown.space)="handleKeyDown($event, \'space\')"\n\n (keydown.arrowup)="handleKeyDown($event, \'focusPrev\')"\n (keydown.arrowdown)="handleKeyDown($event, \'focusNext\')"\n (keydown.arrowleft)="handleKeyDown($event, \'focusPrev\')"\n (keydown.arrowright)="handleKeyDown($event, \'focusNext\')"\n\n (keydown.shift.arrowup)="handleKeyDown($event, \'selectPrev\')"\n (keydown.shift.arrowdown)="handleKeyDown($event, \'selectNext\')"\n (keydown.shift.arrowleft)="handleKeyDown($event, \'selectPrev\')"\n (keydown.shift.arrowright)="handleKeyDown($event, \'selectNext\')"\n [hidden]="noDataFound && !variableInflight"\n>\n <ng-template [ngIf]="!groupby" [ngIfElse]="groupedListTemplate">\n <li *ngFor="let item of fieldDefs; index as $index; first as $first; last as $last;" class="app-list-item {{direction === \'horizontal\' ? \'\' : itemsPerRowClass}}" [ngClass]="listItemRef.itemClass"\n [wmListItem]="item"\n #listItemRef="listItemRef"\n [attr.tabindex]="tabindex"\n role="listitem">\n <ng-container [ngTemplateOutlet]="listTemplate" [ngTemplateOutletContext]="{item: item, $index: $index, itemRef: listItemRef, $first: $first, $last: $last, currentItemWidgets: listItemRef.currentItemWidgets}"></ng-container>\n </li>\n </ng-template>\n <ng-container [ngTemplateOutlet]="listLeftActionTemplate"></ng-container>\n <ng-container [ngTemplateOutlet]="listRightActionTemplate"></ng-container>\n</ul>\n\n<div class="no-data-msg" *ngIf="noDataFound && !variableInflight" [textContent]="nodatamessage"></div>\n\n<div class="loading-data-msg" *ngIf="variableInflight && !pulltorefresh">\n <span>\n <i class="app-icon panel-icon fa-spin" aria-hidden="true" [ngClass]="loadingicon"></i>\n <span class="sr-only">Loading</span>\n <span class="loading-text" [textContent]="loadingdatamsg"></span>\n </span>\n</div>\n\n<nav class="app-datanavigator" [attr.aria-disabled]="dataNavigator.isDisableNext" *ngIf="navigation === \'Inline\' && !noDataFound">\n <ul class="pager">\n <li class="next" [ngClass]="{\'disabled\': (dataNavigator ? dataNavigator.isDisableNext : true)}">\n <a href="javascript:void(0);" (click)="dataNavigator.navigatePage(\'next\', $event)">\n <i class="wi wi-chevron-right" aria-hidden="true"></i>\n <span class="sr-only">Next</span>\n </a>\n </li>\n </ul>\n</nav>\n\n<div class="panel-footer" *ngIf="navigation !== \'None\'" [hidden]="!showNavigation || (onDemandLoad && dataNavigator.isDisableNext) || (dataNavigator.dataSize <= pagesize) || (!dataNavigator.dataSize && !dataNavigator.datasource?.pagination?.next)">\n <nav wmPagination\n navigationalign.bind="navigationalign"\n navigation.bind="navControls"\n showrecordcount.bind="showrecordcount"\n maxsize.bind="maxsize"\n boundarylinks.bind="boundarylinks"\n forceellipses.bind="forceellipses"\n directionlinks.bind="directionlinks"\n show.bind="!onDemandLoad"\n paginationchange.event="beforePaginationChange($event, $index)"\n ></nav>\n <a *ngIf="onDemandLoad" href="javascript:void(0);"\n (click)="dataNavigator.navigatePage(\'next\', $event)"\n class="app-button btn btn-block"\n [ngClass]="paginationclass"\n [textContent]="ondemandmessage"\n ></a>\n</div>\n\n\x3c!--This template will be displayed when groupby is specified--\x3e\n<ng-template #groupedListTemplate>\n <li *ngFor="let groupObj of groupedData" class="app-list-item-group clearfix">\n <ul [attr.tabindex]="tabindex" class="list-group item-group" [ngClass]="listclass">\n <li class="app-list-item-header list-item list-group-header" (click)="handleHeaderClick($event)" [ngClass]="{\'collapsible-content\': collapsible}">\n <h4>{{groupObj.key}}\n <div class="header-action">\n <i class="app-icon wi action wi-chevron-up" *ngIf="collapsible"></i>\n <span *ngIf="showcount" class="label label-default">{{groupObj.data.length}}</span>\n </div>\n </h4>\n </li>\n <ul class="list-group clearfix {{direction === \'horizontal\' ? \'app-horizontal-list\': \'\'}}">\n <li *ngFor="let item of groupObj.data; index as $index; first as $first; last as $last;" [attr.tabindex]="tabindex"\n class="app-list-item group-list-item {{itemsPerRowClass}}"\n [ngClass]="listItemRef.itemClass"\n [wmListItem]="item" #listItemRef="listItemRef">\n <ng-container [ngTemplateOutlet]="listTemplate" [ngTemplateOutletContext]="{item: item, $index: $index, itemRef: listItemRef, $first: $first, $last: $last, currentItemWidgets: listItemRef.currentItemWidgets}"></ng-container>\n </li>\n </ul>\n </ul>\n </li>\n</ng-template>\n',
45107
+ template: '<div class="panel-heading" *ngIf="title || subheading || iconclass">\n <h3 class="panel-title">\n <div class="pull-left">\n <i class="app-icon panel-icon {{iconclass}}" aria-hidden="true" [hidden]="!iconclass"></i>\n </div>\n <div class="pull-left">\n <div class="heading" [innerHTML]="title"></div>\n <div class="description" [innerHTML]="subheading"></div>\n </div>\n </h3>\n</div>\n\n<nav class="app-datanavigator" [attr.aria-disabled]="dataNavigator.isDisablePrevious" aria-label="Page navigation" *ngIf="navigation === \'Inline\' && !noDataFound">\n <ul class="pager">\n <li class="previous" [ngClass]="{\'disabled\': (dataNavigator ? dataNavigator.isDisablePrevious : true)}">\n <a href="javascript:void(0);" (click)="dataNavigator.navigatePage(\'prev\', $event)">\n <i class="wi wi-chevron-left" aria-hidden="true"></i>\n <span class="sr-only">Previous</span>\n </a>\n </li>\n </ul>\n</nav>\n<div *ngIf="navigation === \'Inline\' && !noDataFound" aria-live="polite" aria-atomic="true" class="sr-only"> {{\'Item \' + dataNavigator.dn.currentPage + \' of \' + dataNavigator.pageCount }}</div>\n\n<div>\n <div id={{titleId}} class="sr-only" *ngIf="enablereorder">\n Press space bar to toggle drag drop mode, use arrow keys to move selected elements.\n </div>\n\n <div aria-live="assertive" *ngIf="listItems && enablereorder && currentIndex" class="sr-only" >\n {{ariaText + currentIndex + \' of \' + listItems.length}}\n </div> \n</div>\n\n<ul [attr.tabindex]="tabindex" [attr.aria-describedby] = "titleId" class="app-livelist-container clearfix {{direction === \'horizontal\' ? \'app-horizontal-list\': \'\'}} {{listclass}}" role="list"\n (keydown.enter)="handleKeyDown($event, \'select\')"\n\n (keydown.space)="handleKeyDown($event, \'space\')"\n\n (keydown.arrowup)="handleKeyDown($event, \'focusPrev\')"\n (keydown.arrowdown)="handleKeyDown($event, \'focusNext\')"\n (keydown.arrowleft)="handleKeyDown($event, \'focusPrev\')"\n (keydown.arrowright)="handleKeyDown($event, \'focusNext\')"\n\n (keydown.shift.arrowup)="handleKeyDown($event, \'selectPrev\')"\n (keydown.shift.arrowdown)="handleKeyDown($event, \'selectNext\')"\n (keydown.shift.arrowleft)="handleKeyDown($event, \'selectPrev\')"\n (keydown.shift.arrowright)="handleKeyDown($event, \'selectNext\')"\n [hidden]="noDataFound && !variableInflight"\n>\n <ng-template [ngIf]="!groupby" [ngIfElse]="groupedListTemplate">\n <li *ngFor="let item of fieldDefs; index as $index; first as $first; last as $last;" class="app-list-item {{direction === \'horizontal\' ? \'\' : itemsPerRowClass}}" [ngClass]="listItemRef.itemClass"\n [wmListItem]="item"\n #listItemRef="listItemRef"\n [attr.tabindex]="tabindex"\n role="listitem">\n <ng-container [ngTemplateOutlet]="listTemplate" [ngTemplateOutletContext]="{item: item, $index: $index, itemRef: listItemRef, $first: $first, $last: $last, currentItemWidgets: listItemRef.currentItemWidgets}"></ng-container>\n </li>\n </ng-template>\n <ng-container [ngTemplateOutlet]="listLeftActionTemplate"></ng-container>\n <ng-container [ngTemplateOutlet]="listRightActionTemplate"></ng-container>\n</ul>\n\n<div class="no-data-msg" *ngIf="noDataFound && !variableInflight" [textContent]="nodatamessage"></div>\n\n<div class="loading-data-msg" *ngIf="variableInflight && !pulltorefresh">\n <span>\n <i class="app-icon panel-icon fa-spin" aria-hidden="true" [ngClass]="loadingicon"></i>\n <span class="sr-only">Loading</span>\n <span class="loading-text" [textContent]="loadingdatamsg"></span>\n </span>\n</div>\n\n<nav class="app-datanavigator" [attr.aria-disabled]="dataNavigator.isDisableNext" *ngIf="navigation === \'Inline\' && !noDataFound">\n <ul class="pager">\n <li class="next" [ngClass]="{\'disabled\': (dataNavigator ? dataNavigator.isDisableNext : true)}">\n <a href="javascript:void(0);" (click)="dataNavigator.navigatePage(\'next\', $event)">\n <i class="wi wi-chevron-right" aria-hidden="true"></i>\n <span class="sr-only">Next</span>\n </a>\n </li>\n </ul>\n</nav>\n\n<div class="panel-footer" *ngIf="navigation !== \'None\'" [hidden]="!showNavigation || (onDemandLoad && dataNavigator.isDisableNext) || (dataNavigator.dataSize <= pagesize) || (!dataNavigator.dataSize && !dataNavigator.datasource?.pagination?.next)">\n <nav wmPagination\n navigationalign.bind="navigationalign"\n navigation.bind="navControls"\n showrecordcount.bind="showrecordcount"\n maxsize.bind="maxsize"\n boundarylinks.bind="boundarylinks"\n forceellipses.bind="forceellipses"\n directionlinks.bind="directionlinks"\n show.bind="!onDemandLoad"\n paginationchange.event="beforePaginationChange($event, $index)"\n ></nav>\n <a *ngIf="onDemandLoad" href="javascript:void(0);"\n (click)="dataNavigator.navigatePage(\'next\', $event)"\n class="app-button btn btn-block"\n [ngClass]="paginationclass"\n [textContent]="ondemandmessage"\n ></a>\n</div>\n\n\x3c!--This template will be displayed when groupby is specified--\x3e\n<ng-template #groupedListTemplate>\n <li *ngFor="let groupObj of groupedData" class="app-list-item-group clearfix">\n <ul [attr.tabindex]="tabindex" class="list-group item-group" [ngClass]="listclass">\n <li class="app-list-item-header list-item list-group-header" (click)="handleHeaderClick($event)" [ngClass]="{\'collapsible-content\': collapsible}">\n <h4>{{groupObj.key}}\n <div class="header-action">\n <i class="app-icon wi action wi-chevron-up" *ngIf="collapsible"></i>\n <span *ngIf="showcount" class="label label-default">{{groupObj.data.length}}</span>\n </div>\n </h4>\n </li>\n <ul class="list-group clearfix {{direction === \'horizontal\' ? \'app-horizontal-list\': \'\'}}">\n <li *ngFor="let item of groupObj.data; index as $index; first as $first; last as $last;" [attr.tabindex]="tabindex"\n class="app-list-item group-list-item {{itemsPerRowClass}}"\n [ngClass]="listItemRef.itemClass"\n [wmListItem]="item" #listItemRef="listItemRef">\n <ng-container [ngTemplateOutlet]="listTemplate" [ngTemplateOutletContext]="{item: item, $index: $index, itemRef: listItemRef, $first: $first, $last: $last, currentItemWidgets: listItemRef.currentItemWidgets}"></ng-container>\n </li>\n </ul>\n </ul>\n </li>\n</ng-template>\n',
45097
45108
  providers: [ base.provideAsWidgetRef(ListComponent) ]
45098
45109
  } ]
45099
45110
  } ];
@@ -51046,15 +51057,20 @@
51046
51057
  };
51047
51058
  };
51048
51059
  var \u02752 = findInvalidElement;
51049
- var setTouchedState = function(ngForm) {
51060
+ var setTouchedState = function(self, ngForm, fieldName) {
51061
+ var _a, _b;
51050
51062
  if (ngForm.valid) {
51051
51063
  return;
51052
51064
  }
51053
51065
  if (ngForm.controls) {
51054
- _.forEach(ngForm.controls, (function(ctrl) {
51055
- setTouchedState(ctrl);
51066
+ _.forEach(ngForm.controls, (function(ctrl, fieldName) {
51067
+ setTouchedState(self, ctrl, fieldName);
51056
51068
  }));
51057
51069
  } else {
51070
+ var element = self.$element.find('[wmformfield][key="' + fieldName + '"]');
51071
+ element[0].setAttribute("__errormsg", element[0].getAttribute("__validationId"));
51072
+ (_a = element[0].querySelector("input")) === null || _a === void 0 ? void 0 : _a.setAttribute("aria-invalid", ngForm.invalid);
51073
+ (_b = element[0].querySelector("input")) === null || _b === void 0 ? void 0 : _b.setAttribute("aria-describedby", element[0].getAttribute("__validationId"));
51058
51074
  ngForm.markAsTouched();
51059
51075
  }
51060
51076
  };
@@ -51351,7 +51367,7 @@
51351
51367
  }));
51352
51368
  };
51353
51369
  FormComponent.prototype.highlightInvalidFields = function() {
51354
- setTouchedState(this.ngform);
51370
+ setTouchedState(this, this.ngform, "");
51355
51371
  };
51356
51372
  FormComponent.prototype.validateFieldsOnSubmit = function() {
51357
51373
  this.setValidationMsgs();
@@ -51880,8 +51896,8 @@
51880
51896
  FormComponent.prototype.generateFormFields = function() {
51881
51897
  return __awaiter(this, void 0, void 0, (function() {
51882
51898
  var noOfColumns, $gridLayout, columnWidth, fieldTemplate, colCount, index, userFields, fields, colTmpl, componentFactoryRef, component;
51883
- return __generator(this, (function(_b) {
51884
- switch (_b.label) {
51899
+ return __generator(this, (function(_c) {
51900
+ switch (_c.label) {
51885
51901
  case 0:
51886
51902
  if (_.isUndefined(this._isGridLayoutPresent)) {
51887
51903
  this._isGridLayoutPresent = this.$element.find(".panel-body [wmlayoutgrid]").length > 0;
@@ -51940,7 +51956,7 @@
51940
51956
  }) ];
51941
51957
 
51942
51958
  case 1:
51943
- componentFactoryRef = _b.sent();
51959
+ componentFactoryRef = _c.sent();
51944
51960
  component = this.dynamicFormRef.createComponent(componentFactoryRef, 0, this.inj);
51945
51961
  core.extendProto(component.instance, this._dynamicContext);
51946
51962
  $gridLayout[0].appendChild(component.location.nativeElement);
@@ -52461,10 +52477,18 @@
52461
52477
  $($evt.target).closest(".live-field").addClass("active");
52462
52478
  };
52463
52479
  FormFieldDirective.prototype._onBlurField = function($evt) {
52464
- var _a, _b;
52480
+ var _a, _b, _c, _d;
52465
52481
  $($evt.target).closest(".live-field").removeClass("active");
52466
- (_a = this.nativeElement.querySelector("input")) === null || _a === void 0 ? void 0 : _a.setAttribute("aria-invalid", "" + this.ngform.controls[this._fieldName].invalid);
52467
- (_b = this.nativeElement.querySelector("input")) === null || _b === void 0 ? void 0 : _b.setAttribute("aria-describedby", "" + this.nativeElement.getAttribute("__errormsg"));
52482
+ var ele = this.nativeElement.querySelector("p.text-danger");
52483
+ if (this.ngform.controls[this._fieldName].invalid && this.ngform.controls[this._fieldName].touched && this.form.isUpdateMode) {
52484
+ this.nativeElement.setAttribute("__errormsg", "" + this.nativeElement.getAttribute("__validationId"));
52485
+ (_a = this.nativeElement.querySelector("input")) === null || _a === void 0 ? void 0 : _a.setAttribute("aria-invalid", "" + this.ngform.controls[this._fieldName].invalid);
52486
+ (_b = this.nativeElement.querySelector("input")) === null || _b === void 0 ? void 0 : _b.setAttribute("aria-describedby", "" + this.nativeElement.getAttribute("__validationId"));
52487
+ } else {
52488
+ this.nativeElement.removeAttribute("__errormsg");
52489
+ (_c = this.nativeElement.querySelector("input")) === null || _c === void 0 ? void 0 : _c.removeAttribute("aria-invalid");
52490
+ (_d = this.nativeElement.querySelector("input")) === null || _d === void 0 ? void 0 : _d.removeAttribute("aria-describedby");
52491
+ }
52468
52492
  this._activeField = false;
52469
52493
  this._triggeredByUser = false;
52470
52494
  this._clicktriggeredByUser = false;
@@ -52686,7 +52710,7 @@
52686
52710
  });
52687
52711
  };
52688
52712
  FormFieldDirective.prototype.onValueChange = function(val) {
52689
- var _a, _b;
52713
+ var _a, _b, _c, _d;
52690
52714
  if (!this.isDestroyed) {
52691
52715
  var captionEl = $(this.nativeElement).find(".caption-floating");
52692
52716
  if (captionEl.length > 0) {
@@ -52698,8 +52722,15 @@
52698
52722
  isFocused: this._activeField
52699
52723
  });
52700
52724
  }
52701
- (_a = this.nativeElement.querySelector("input")) === null || _a === void 0 ? void 0 : _a.setAttribute("aria-invalid", this._triggeredByUser && this.ngform.controls[this._fieldName].invalid ? "true" : "false");
52702
- (_b = this.nativeElement.querySelector("input")) === null || _b === void 0 ? void 0 : _b.setAttribute("aria-describedby", "" + this.nativeElement.getAttribute("__errormsg"));
52725
+ if (this.ngform.controls[this._fieldName].invalid && this.ngform.controls[this._fieldName].touched && this.form.isUpdateMode) {
52726
+ this.nativeElement.setAttribute("__errormsg", "" + this.nativeElement.getAttribute("__validationId"));
52727
+ (_a = this.nativeElement.querySelector("input")) === null || _a === void 0 ? void 0 : _a.setAttribute("aria-invalid", this._triggeredByUser && this.ngform.controls[this._fieldName].invalid ? "true" : "false");
52728
+ (_b = this.nativeElement.querySelector("input")) === null || _b === void 0 ? void 0 : _b.setAttribute("aria-describedby", "" + this.nativeElement.getAttribute("__validationId"));
52729
+ } else {
52730
+ this.nativeElement.removeAttribute("__errormsg");
52731
+ (_c = this.nativeElement.querySelector("input")) === null || _c === void 0 ? void 0 : _c.removeAttribute("aria-invalid");
52732
+ (_d = this.nativeElement.querySelector("input")) === null || _d === void 0 ? void 0 : _d.removeAttribute("aria-describedby");
52733
+ }
52703
52734
  this.form.onFieldValueChange(this, val);
52704
52735
  this.notifyChanges();
52705
52736
  if (this.$element.find(".active").length > 0 || this.form.touched) {