@ngx-formly/core 5.10.29 → 5.10.33

package/fesm5/ngx-formly-core.js

@@ -1,15 +1,30 @@
 import { DOCUMENT, CommonModule } from '@angular/common';
-import { TemplateRef, Injectable, InjectionToken, NgModule, ANALYZE_FOR_ENTRY_COMPONENTS, Inject, Optional, Component, Input, ChangeDetectionStrategy, ComponentFactoryResolver, Injector, ChangeDetectorRef, Directive, EventEmitter, NgZone, Attribute, Output, ViewChild, Renderer2, ElementRef, ViewContainerRef, defineInjectable, inject, INJECTOR } from '@angular/core';
+import { TemplateRef, Injectable, InjectionToken, NgModule, ANALYZE_FOR_ENTRY_COMPONENTS, Inject, Optional, Component, Input, ChangeDetectionStrategy, ComponentFactoryResolver, Injector, ChangeDetectorRef, Directive, EventEmitter, Renderer2, ElementRef, Attribute, Output, ViewChild, ViewContainerRef, NgZone, defineInjectable, inject, INJECTOR } from '@angular/core';
 import { DomSanitizer } from '@angular/platform-browser';
 import { debounceTime, switchMap, distinctUntilChanged, take, startWith, filter, map } from 'rxjs/operators';
 import { AbstractControl, FormArray, FormGroup, FormControl, FormGroupDirective, Validators } from '@angular/forms';
 import { isObservable, Subject, of, merge, Observable } from 'rxjs';
-import { __extends, __assign, __spread, __rest, __values, __read } from 'tslib';
+import { __extends, __assign, __spread, __rest, __read, __values } from 'tslib';
 
 /**
  * @fileoverview added by tsickle
  * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  */
+/**
+ * @param {?} form
+ * @param {?} callback
+ * @return {?}
+ */
+function disableTreeValidityCall(form, callback) {
+    /** @type {?} */
+    var _updateTreeValidity = form._updateTreeValidity.bind(form);
+    form._updateTreeValidity = (/**
+     * @return {?}
+     */
+    function () { });
+    callback();
+    form._updateTreeValidity = _updateTreeValidity;
+}
 /**
  * @param {?} formId
  * @param {?} field
@@ -21,8 +36,12 @@ function getFieldId(formId, field, index) {
         return field.id;
     /** @type {?} */
     var type = field.type;
-    if (!type && field.template)
+    if (!type && field.template) {
         type = 'template';
+    }
+    if (isFunction(type)) {
+        type = ((/** @type {?} */ (type))).prototype.constructor.name;
+    }
     return [formId, type, field.key, index].join('_');
 }
 /**
@@ -331,28 +350,6 @@ function wrapProperty(o, prop, setFn) {
      */
     function () { return fns.splice(fns.indexOf(setFn), 1); });
 }
-/**
- * @param {?} form
- * @param {?} action
- * @return {?}
- */
-function reduceFormUpdateValidityCalls(form, action) {
-    /** @type {?} */
-    var updateValidity = form._updateTreeValidity.bind(form);
-    /** @type {?} */
-    var updateValidityArgs = { called: false, emitEvent: false };
-    form._updateTreeValidity = (/**
-     * @param {?=} __0
-     * @return {?}
-     */
-    function (_a) {
-        var emitEvent = (_a === void 0 ? { emitEvent: true } : _a).emitEvent;
-        return updateValidityArgs = { called: true, emitEvent: emitEvent || updateValidityArgs.emitEvent };
-    });
-    action();
-    updateValidityArgs.called && updateValidity({ emitEvent: updateValidityArgs.emitEvent });
-    form._updateTreeValidity = updateValidity;
-}
 
 /**
  * @fileoverview added by tsickle
@@ -741,7 +738,7 @@ var FormlyFormBuilder = /** @class */ (function () {
         }
         /** @type {?} */
         var field = { fieldGroup: fieldGroup, model: model, formControl: formControl, options: this._setOptions(options) };
-        reduceFormUpdateValidityCalls(formControl, (/**
+        disableTreeValidityCall(formControl, (/**
          * @return {?}
          */
         function () { return _this._buildForm(field); }));
@@ -1028,15 +1025,22 @@ function registerControl(field, control, emitEvent) {
 }
 /**
  * @param {?} c
+ * @param {?=} onlySelf
  * @return {?}
  */
-function updateValidity(c) {
+function updateValidity(c, onlySelf) {
+    if (onlySelf === void 0) { onlySelf = false; }
     /** @type {?} */
     var status = c.status;
-    c.updateValueAndValidity({ emitEvent: false });
+    /** @type {?} */
+    var value = c.value;
+    c.updateValueAndValidity({ emitEvent: false, onlySelf: onlySelf });
     if (status !== c.status) {
         ((/** @type {?} */ (c.statusChanges))).emit(c.status);
     }
+    if (value !== c.value) {
+        ((/** @type {?} */ (c.valueChanges))).emit(c.value);
+    }
 }
 /**
  * @param {?} form
@@ -1860,16 +1864,11 @@ var FormlyField = /** @class */ (function () {
  */
 var FormlyAttributes = /** @class */ (function () {
     function FormlyAttributes(renderer, elementRef, _document) {
+        var _this = this;
         this.renderer = renderer;
         this.elementRef = elementRef;
         this.uiAttributesCache = {};
-        this.uiAttributes = __spread(FORMLY_VALIDATORS, [
-            'tabindex',
-            'placeholder',
-            'readonly',
-            'disabled',
-            'step',
-        ]);
+        this.uiAttributes = null;
         /**
          * HostBinding doesn't register listeners conditionally which may produce some perf issues.
          *
@@ -1877,12 +1876,24 @@ var FormlyAttributes = /** @class */ (function () {
          */
         this.uiEvents = {
             listeners: [],
-            events: [
-                'click',
-                'keyup',
-                'keydown',
-                'keypress',
-            ],
+            events: ['click', 'keyup', 'keydown', 'keypress', 'focus', 'blur', 'change'],
+            callback: (/**
+             * @param {?} eventName
+             * @param {?} $event
+             * @return {?}
+             */
+            function (eventName, $event) {
+                switch (eventName) {
+                    case 'focus':
+                        return _this.onFocus($event);
+                    case 'blur':
+                        return _this.onBlur($event);
+                    case 'change':
+                        return _this.onChange($event);
+                    default:
+                        return _this.to[eventName](_this.field, $event);
+                }
+            }),
         };
         this.document = _document;
     }
@@ -1925,12 +1936,12 @@ var FormlyAttributes = /** @class */ (function () {
              * @return {?}
              */
             function (eventName) {
-                if (_this.to && _this.to[eventName]) {
+                if ((_this.to && _this.to[eventName]) || ['focus', 'blur', 'change'].indexOf(eventName) !== -1) {
                     _this.uiEvents.listeners.push(_this.renderer.listen(_this.elementRef.nativeElement, eventName, (/**
                      * @param {?} e
                      * @return {?}
                      */
-                    function (e) { return _this.to[eventName](_this.field, e); })));
+                    function (e) { return _this.uiEvents.callback(eventName, e); })));
                 }
             }));
             if (this.to && this.to.attributes) {
@@ -2006,6 +2017,15 @@ var FormlyAttributes = /** @class */ (function () {
      */
     function () {
         var _this = this;
+        if (!this.uiAttributes) {
+            /** @type {?} */
+            var element_1 = (/** @type {?} */ (this.elementRef.nativeElement));
+            this.uiAttributes = __spread(FORMLY_VALIDATORS, ['tabindex', 'placeholder', 'readonly', 'disabled', 'step']).filter((/**
+             * @param {?} attr
+             * @return {?}
+             */
+            function (attr) { return !element_1.hasAttribute || !element_1.hasAttribute(attr); }));
+        }
         this.uiAttributes.forEach((/**
          * @param {?} attr
          * @return {?}
@@ -2100,6 +2120,24 @@ var FormlyAttributes = /** @class */ (function () {
             this.to.blur(this.field, $event);
         }
     };
+    // handle custom `change` event, for regular ones rely on DOM listener
+    // handle custom `change` event, for regular ones rely on DOM listener
+    /**
+     * @param {?} $event
+     * @return {?}
+     */
+    FormlyAttributes.prototype.onHostChange = 
+    // handle custom `change` event, for regular ones rely on DOM listener
+    /**
+     * @param {?} $event
+     * @return {?}
+     */
+    function ($event) {
+        if ($event instanceof Event) {
+            return;
+        }
+        this.onChange($event);
+    };
     /**
      * @param {?} $event
      * @return {?}
@@ -2186,9 +2224,7 @@ var FormlyAttributes = /** @class */ (function () {
         { type: Directive, args: [{
                     selector: '[formlyAttributes]',
                     host: {
-                        '(focus)': 'onFocus($event)',
-                        '(blur)': 'onBlur($event)',
-                        '(change)': 'onChange($event)',
+                        '(change)': 'onHostChange($event)',
                     },
                 },] }
     ];
@@ -2693,10 +2729,7 @@ FieldExpressionExtension = /** @class */ (function () {
         function (f, ignoreCache) {
             if (!checkLocked) {
                 checkLocked = true;
-                reduceFormUpdateValidityCalls(f.formControl, (/**
-                 * @return {?}
-                 */
-                function () { return _this.checkField(f, ignoreCache); }));
+                _this.checkField(f, ignoreCache);
                 checkLocked = false;
             }
         });
@@ -3498,22 +3531,7 @@ FieldFormExtension = /** @class */ (function () {
         if (field.parent) {
             return;
         }
-        /** @type {?} */
-        var fieldsToUpdate = this.setValidators(field);
-        if (fieldsToUpdate.length === 0) {
-            return;
-        }
-        if (fieldsToUpdate.length === 1) {
-            /** @type {?} */
-            var control = fieldsToUpdate[0].formControl;
-            while (control) {
-                ((/** @type {?} */ (control)))._updateTreeValidity({ onlySelf: true });
-                control = control.parent;
-            }
-        }
-        else {
-            ((/** @type {?} */ (field.formControl)))._updateTreeValidity();
-        }
+        this.setValidators(field);
     };
     /**
      * @private
@@ -3554,39 +3572,39 @@ FieldFormExtension = /** @class */ (function () {
     /**
      * @private
      * @param {?} field
+     * @param {?=} disabled
      * @return {?}
      */
     FieldFormExtension.prototype.setValidators = /**
      * @private
      * @param {?} field
+     * @param {?=} disabled
      * @return {?}
      */
-    function (field) {
+    function (field, disabled) {
         var _this = this;
+        if (disabled === void 0) { disabled = false; }
         /** @type {?} */
-        var updateValidity$$1 = false;
+        var markForCheck = false;
+        if (disabled === false && field.key && field.templateOptions && field.templateOptions.disabled) {
+            disabled = true;
+        }
+        (field.fieldGroup || []).forEach((/**
+         * @param {?} f
+         * @return {?}
+         */
+        function (f) { return _this.setValidators(f, disabled) && (markForCheck = true); }));
         if (field.key || !field.parent || (!field.key && !field.fieldGroup)) {
             var c_1 = field.formControl;
-            /** @type {?} */
-            var disabled = field.templateOptions ? field.templateOptions.disabled : false;
-            if (field.key && c_1) {
+            field.templateOptions = field.templateOptions || {};
+            if (field.key && c_1 && c_1 instanceof FormControl) {
                 if (disabled && c_1.enabled) {
                     c_1.disable({ emitEvent: false, onlySelf: true });
-                    if (!c_1.parent) {
-                        updateValidity(c_1);
-                    }
-                    else {
-                        updateValidity$$1 = true;
-                    }
+                    markForCheck = true;
                 }
                 if (!disabled && c_1.disabled) {
                     c_1.enable({ emitEvent: false, onlySelf: true });
-                    if (!c_1.parent) {
-                        updateValidity(c_1);
-                    }
-                    else {
-                        updateValidity$$1 = true;
-                    }
+                    markForCheck = true;
                 }
             }
             if (c_1 && (null === c_1.validator || null === c_1.asyncValidator)) {
@@ -3606,28 +3624,13 @@ FieldFormExtension = /** @class */ (function () {
                     var v = Validators.composeAsync(_this.mergeValidators(field, '_asyncValidators'));
                     return v ? v(c_1) : of(null);
                 }));
-                if (!c_1.parent) {
-                    updateValidity(c_1);
-                }
-                else {
-                    updateValidity$$1 = true;
-                }
+                markForCheck = true;
             }
-        }
-        /** @type {?} */
-        var fieldsToUpdate = updateValidity$$1 ? [field] : [];
-        (field.fieldGroup || []).forEach((/**
-         * @param {?} f
-         * @return {?}
-         */
-        function (f) {
-            /** @type {?} */
-            var childrenToUpdate = _this.setValidators(f);
-            if (!updateValidity$$1) {
-                fieldsToUpdate.push.apply(fieldsToUpdate, __spread(childrenToUpdate));
+            if (markForCheck) {
+                updateValidity(c_1, true);
             }
-        }));
-        return fieldsToUpdate;
+        }
+        return markForCheck;
     };
     /**
      * @private