@magic-xpa/angular 4.801.7 → 4.900.0-dev4100.11

package/fesm2020/magic-xpa-angular.mjs

@@ -10,14 +10,14 @@ import * as i3 from 'ng-dynamic-component';
 import { DynamicModule } from 'ng-dynamic-component';
 import { InteractiveCommandType, OverlayType, Styles, HtmlProperties, GuiConstants, CommandType, PIC, GuiEnvironment, Modifiers } from '@magic-xpa/gui';
 import { MagicBridge, getGuiEventObj, CookieService } from '@magic-xpa/engine';
-import { MagicProperties, Logger, StrUtil, StorageAttribute, BindingLevel, StorageAttributeType, MgControlType, PICInterface } from '@magic-xpa/utils';
+import { MagicProperties, Logger, StrUtil, StorageAttribute, PICInterface, BindingLevel, StorageAttributeType, MgControlType } from '@magic-xpa/utils';
 import { filter, map, debounceTime } from 'rxjs/operators';
 import { Subject, fromEvent } from 'rxjs';
 import { __decorate, __metadata } from 'tslib';
 import * as i1$1 from '@angular/platform-browser';
 import * as i1$2 from '@angular/common/http';
 import { HttpClientModule } from '@angular/common/http';
-import { NativeDateAdapter, DateAdapter, MAT_DATE_FORMATS } from '@angular/material/core';
+import { NativeDateAdapter, MAT_DATE_LOCALE, DateAdapter, MAT_DATE_FORMATS } from '@angular/material/core';
 import * as i1$3 from '@angular/cdk/platform';
 
 class ControlMetadata {
@@ -934,7 +934,7 @@ MagicOverlayContainer.ɵcmp = i0.ɵɵdefineComponent({ type: MagicOverlayContain
         i0.ɵɵproperty("ngIf", ctx.getShowTitleBar());
         i0.ɵɵadvance(1);
         i0.ɵɵproperty("ngStyle", ctx.getClientAreaStyles());
-    } }, directives: [i1.NgIf, i1.NgStyle, MagicViewContainerRef], styles: [".modal-foreground[_ngcontent-%COMP%]{position:fixed;top:0;right:0;bottom:0;left:0;background-color:#fff}.modal-background[_ngcontent-%COMP%]{position:fixed;top:0;right:0;bottom:0;left:0;background-color:#000;opacity:.75}.modal-header[_ngcontent-%COMP%]{background-color:beige;border-bottom:2px solid red}"] });
+    } }, directives: [i1.NgIf, i1.NgStyle, MagicViewContainerRef], styles: [".modal-foreground[_ngcontent-%COMP%]{position:fixed;inset:0;background-color:#fff}.modal-background[_ngcontent-%COMP%]{position:fixed;inset:0;background-color:#000;opacity:.75}.modal-header[_ngcontent-%COMP%]{background-color:beige;border-bottom:2px solid red}"] });
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(MagicOverlayContainer, [{
         type: Component,
         args: [{ selector: 'app-magic-overlay-container', template: `
@@ -953,7 +953,7 @@ MagicOverlayContainer.ɵcmp = i0.ɵɵdefineComponent({ type: MagicOverlayContain
         </div>
       </div>
     </div>
-  `, styles: [".modal-foreground{position:fixed;top:0;right:0;bottom:0;left:0;background-color:#fff}.modal-background{position:fixed;top:0;right:0;bottom:0;left:0;background-color:#000;opacity:.75}.modal-header{background-color:beige;border-bottom:2px solid red}\n"] }]
+  `, styles: [".modal-foreground{position:fixed;inset:0;background-color:#fff}.modal-background{position:fixed;inset:0;background-color:#000;opacity:.75}.modal-header{background-color:beige;border-bottom:2px solid red}\n"] }]
     }], function () { return [{ type: i0.ComponentFactoryResolver }]; }, { headerElementRef: [{
             type: ViewChild,
             args: ['modalheader', { static: false }]
@@ -1128,7 +1128,7 @@ MagicOverlayContainerWrapper.ɵcmp = i0.ɵɵdefineComponent({ type: MagicOverlay
         i0.ɵɵelementEnd();
         i0.ɵɵelement(6, "div", 5);
         i0.ɵɵelementEnd();
-    } }, directives: [MagicFocusDirective, MagicViewContainerRef], styles: [".overlay-container-wrapper-background[_ngcontent-%COMP%]{position:fixed;top:0;z-index:999;right:0;bottom:0;left:0}"] });
+    } }, directives: [MagicFocusDirective, MagicViewContainerRef], styles: [".overlay-container-wrapper-background[_ngcontent-%COMP%]{position:fixed;z-index:999;inset:0}"] });
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(MagicOverlayContainerWrapper, [{
         type: Component,
         args: [{
@@ -1961,7 +1961,7 @@ class TaskMagicService {
                     return val;
             }
             case StorageAttribute.NUMERIC:
-                return val;
+                return +val;
             default:
                 return val;
         }
@@ -2339,9 +2339,9 @@ class AccessorMagicService {
         let properties;
         properties = this.task.Records.list[0].getControlMetadata(controlId);
         if (properties.properties.get(HtmlProperties.ReadOnly) !== null && properties.properties.get(HtmlProperties.ReadOnly) === true)
-            return false;
-        else
             return true;
+        else
+            return false;
     }
     getText(controlId, rowId) {
         return this.task.getProperty(controlId, HtmlProperties.Text, rowId);
@@ -2371,6 +2371,29 @@ class AccessorMagicService {
         let vis = this.getProperty(controlId, HtmlProperties.Visible, rowId);
         return vis ? 'visible' : 'hidden';
     }
+    getAlphaMask(controlId, rowId) {
+        if (isNullOrUndefined(controlId))
+            return null;
+        let pic = this.task.GetControlPictureMask(controlId);
+        let mask = pic.getMask();
+        let valueStr = new StringBuilder();
+        for (let i = 0; i < mask.length; i++) {
+            switch (mask.charCodeAt(i)) {
+                case PICInterface.PIC_N:
+                    valueStr.Append("0");
+                    break;
+                case PICInterface.PIC_U:
+                case PICInterface.PIC_L:
+                case PICInterface.PIC_X:
+                    valueStr.Append("A");
+                    break;
+                default:
+                    valueStr.Append(mask.charAt(i));
+                    break;
+            }
+        }
+        return (pic != null) ? valueStr.toString() : null;
+    }
     getNumericPicture(picture) {
         var obj = {};
         if (isNullOrUndefined(picture))
@@ -2552,7 +2575,7 @@ class AccessorMagicService {
         if (c.hasError('maxlength'))
             return 'Max length allowed is : ' + c.errors.maxlength.requiredLength;
         if (c.hasError('max'))
-            return 'Max value alllowed is : ' + c.errors.max.max;
+            return 'Max value allowed is : ' + c.errors.max.max;
         let controlMetadata = this.task.Records.list[rowId].getControlMetadata(id);
         for (let key of controlMetadata.customValidators.keys()) {
             if (c.hasError(key)) {
@@ -2929,15 +2952,15 @@ class MagicDirective {
     }
     handleSetProperty(command) {
         switch (command.Operation) {
-            case HtmlProperties.ReadOnly: {
-                if (command.obj.Type == MgControlType.CTRL_TYPE_TEXT) {
-                    if (command.obj1 != true)
-                        this.renderer.removeAttribute(this.htmlElement, command.Operation);
-                    else
-                        this.renderer.setAttribute(this.htmlElement, command.Operation, command.str);
+            case HtmlProperties.ReadOnly:
+                {
+                    if (command.obj.Type == MgControlType.CTRL_TYPE_TEXT)
+                        if (command.obj1 != true)
+                            this.renderer.removeAttribute(this.htmlElement, command.Operation);
+                        else
+                            this.renderer.setAttribute(this.htmlElement, command.Operation, command.str);
                 }
                 break;
-            }
         }
     }
     ngOnDestroy() {
@@ -3258,6 +3281,25 @@ class MgformatMagicDirective {
         }
     }
     onFocusEvent($event) {
+        this.calculatePattern();
+    }
+    onInputEvent($event) {
+        this.calculatePattern();
+    }
+    onChangeEvent($event) {
+        let control = this._task.getFormControl(this.magicDir.rowId, this.magicDir.id);
+        let attr = this._task.Records.list[0].getControlMetadata(this.magicDir.id).dataType;
+        switch (attr) {
+            case StorageAttribute.ALPHA:
+            case StorageAttribute.UNICODE:
+                this.formatAlphaUnicode(control);
+                break;
+            case StorageAttribute.BOOLEAN:
+                this.formatBoolean(control);
+                break;
+        }
+    }
+    calculatePattern() {
         let control = this._task.getFormControl(this.magicDir.rowId, this.magicDir.id);
         if (control != null) {
             let attr = this._task.Records.list[0].getControlMetadata(this.magicDir.id).dataType;
@@ -3274,26 +3316,22 @@ class MgformatMagicDirective {
                     if (attr == StorageAttribute.ALPHA || attr == StorageAttribute.UNICODE) {
                         if (control.validator == null)
                             control.setValidators(Validators.maxLength(pic.getMaskLength()));
-                        else
-                            control.setValidators([control.validator, Validators.maxLength(pic.getMaskLength())]);
+                        else {
+                            if (pic.isFormatExp()) {
+                                control.setValidators(Validators.maxLength(pic.getMaskLength()));
+                                if (isUndefined(this.magicDir.rowId))
+                                    this.magicDir.rowId = '0';
+                                control.setValidators([control.validator, this._task.customValidator(this.magicDir.rowId, this.magicDir.id)]);
+                            }
+                            else
+                                control.setValidators([control.validator, Validators.maxLength(pic.getMaskLength())]);
+                        }
+                        control.updateValueAndValidity();
                     }
                 }
             }
         }
     }
-    onChangeEvent($event) {
-        let control = this._task.getFormControl(this.magicDir.rowId, this.magicDir.id);
-        let attr = this._task.Records.list[0].getControlMetadata(this.magicDir.id).dataType;
-        switch (attr) {
-            case StorageAttribute.ALPHA:
-            case StorageAttribute.UNICODE:
-                this.formatAlphaUnicode(control);
-                break;
-            case StorageAttribute.BOOLEAN:
-                this.formatBoolean(control);
-                break;
-        }
-    }
     formatDate(pic) {
         let mgDateFormatter = new MgDateFormatter();
         this._task.mgInputDateFormat = mgDateFormatter.ConvertMgDateFormatToAngular(pic.getMask());
@@ -3442,7 +3480,7 @@ class MgformatMagicDirective {
 }
 MgformatMagicDirective.ɵfac = function MgformatMagicDirective_Factory(t) { return new (t || MgformatMagicDirective)(i0.ɵɵdirectiveInject(MagicDirective), i0.ɵɵdirectiveInject(TaskMagicService)); };
 MgformatMagicDirective.ɵdir = i0.ɵɵdefineDirective({ type: MgformatMagicDirective, selectors: [["", "mgFormat", ""]], hostBindings: function MgformatMagicDirective_HostBindings(rf, ctx) { if (rf & 1) {
-        i0.ɵɵlistener("focus", function MgformatMagicDirective_focus_HostBindingHandler($event) { return ctx.onFocusEvent($event); })("change", function MgformatMagicDirective_change_HostBindingHandler($event) { return ctx.onChangeEvent($event); });
+        i0.ɵɵlistener("focus", function MgformatMagicDirective_focus_HostBindingHandler($event) { return ctx.onFocusEvent($event); })("input", function MgformatMagicDirective_input_HostBindingHandler($event) { return ctx.onInputEvent($event); })("change", function MgformatMagicDirective_change_HostBindingHandler($event) { return ctx.onChangeEvent($event); });
     } } });
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(MgformatMagicDirective, [{
         type: Directive,
@@ -3452,6 +3490,9 @@ MgformatMagicDirective.ɵdir = i0.ɵɵdefineDirective({ type: MgformatMagicDirec
     }], function () { return [{ type: MagicDirective }, { type: TaskMagicService }]; }, { onFocusEvent: [{
             type: HostListener,
             args: ['focus', ['$event']]
+        }], onInputEvent: [{
+            type: HostListener,
+            args: ['input', ['$event']]
         }], onChangeEvent: [{
             type: HostListener,
             args: ['change', ['$event']]
@@ -3910,7 +3951,7 @@ MagicShellComponent.ɵcmp = i0.ɵɵdefineComponent({ type: MagicShellComponent,
         i0.ɵɵproperty("ngIf", ctx.RootComponent !== null);
         i0.ɵɵadvance(3);
         i0.ɵɵproperty("ngIf", ctx.showSpinner);
-    } }, directives: [i1.NgIf, i3.DynamicComponent, i3.DynamicIoDirective, MagicViewContainerRef, i1.NgTemplateOutlet], styles: [".mgSpinnerClass[_ngcontent-%COMP%]{border:10px solid #cccccc;border-top:10px solid black;border-radius:50%;position:fixed;margin:auto;top:0;right:0;bottom:0;left:0;width:100px;height:100px;animation:spin 2s linear infinite}.spinner-background[_ngcontent-%COMP%]{position:fixed;top:0;right:0;bottom:0;z-index:1000;left:0;opacity:.5}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}"] });
+    } }, directives: [i1.NgIf, i3.DynamicComponent, i3.DynamicIoDirective, MagicViewContainerRef, i1.NgTemplateOutlet], styles: [".mgSpinnerClass[_ngcontent-%COMP%]{border:10px solid #cccccc;border-top:10px solid black;border-radius:50%;position:fixed;margin:auto;inset:0;width:100px;height:100px;animation:spin 2s linear infinite}.spinner-background[_ngcontent-%COMP%]{position:fixed;z-index:1000;inset:0;opacity:.5}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}"] });
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(MagicShellComponent, [{
         type: Component,
         args: [{
@@ -4305,11 +4346,13 @@ const MG_FORMATS = {
     }
 };
 class MgDateAdapter extends NativeDateAdapter {
-    constructor(platform, task) {
-        super('en-US', platform);
+    constructor(platform, task, localeId) {
+        super(localeId, platform);
         this.platform = platform;
         this.task = task;
+        this.localeId = localeId;
         this.mgdtfmt = null;
+        this.setLocale(localeId);
     }
     parse(value) {
         let valueStr = value;
@@ -4369,7 +4412,7 @@ class MgDateAdapter extends NativeDateAdapter {
             }
             if (month == 0 && year == 0 && date == 0)
                 return null;
-            return new Date(Date.UTC(year, month, date));
+            return new Date(year, month, date);
         }
     }
     format(date, displayFormat) {
@@ -4385,11 +4428,14 @@ class MgDateAdapter extends NativeDateAdapter {
         }
     }
 }
-MgDateAdapter.ɵfac = function MgDateAdapter_Factory(t) { return new (t || MgDateAdapter)(i0.ɵɵinject(i1$3.Platform), i0.ɵɵinject(TaskMagicService)); };
+MgDateAdapter.ɵfac = function MgDateAdapter_Factory(t) { return new (t || MgDateAdapter)(i0.ɵɵinject(i1$3.Platform), i0.ɵɵinject(TaskMagicService), i0.ɵɵinject(MAT_DATE_LOCALE)); };
 MgDateAdapter.ɵprov = i0.ɵɵdefineInjectable({ token: MgDateAdapter, factory: MgDateAdapter.ɵfac });
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(MgDateAdapter, [{
         type: Injectable
-    }], function () { return [{ type: i1$3.Platform }, { type: TaskMagicService }]; }, null); })();
+    }], function () { return [{ type: i1$3.Platform }, { type: TaskMagicService }, { type: undefined, decorators: [{
+                type: Inject,
+                args: [MAT_DATE_LOCALE]
+            }] }]; }, null); })();
 
 const matDateProviders = [
     { provide: DateAdapter, useClass: MgDateAdapter },