@ngx-formly/core 5.10.29 → 5.10.33

package/fesm2015/ngx-formly-core.js

@@ -1,5 +1,5 @@
 import { DOCUMENT, CommonModule } from '@angular/common';
-import { TemplateRef, Injectable, InjectionToken, NgModule, ANALYZE_FOR_ENTRY_COMPONENTS, Inject, Optional, Component, Input, ChangeDetectionStrategy, EventEmitter, Output, Attribute, ViewChild, ElementRef, NgZone, Directive, Renderer2, ViewContainerRef, ComponentFactoryResolver, Injector, ChangeDetectorRef, defineInjectable, inject, INJECTOR } from '@angular/core';
+import { TemplateRef, Injectable, InjectionToken, NgModule, ANALYZE_FOR_ENTRY_COMPONENTS, Inject, Optional, Component, Input, ChangeDetectionStrategy, EventEmitter, Output, ViewContainerRef, ViewChild, Attribute, ComponentFactoryResolver, Renderer2, ElementRef, Directive, NgZone, Injector, ChangeDetectorRef, defineInjectable, inject, INJECTOR } from '@angular/core';
 import { DomSanitizer } from '@angular/platform-browser';
 import { __rest } from 'tslib';
 import { debounceTime, switchMap, distinctUntilChanged, take, startWith, filter, map } from 'rxjs/operators';
@@ -10,6 +10,21 @@ import { isObservable, Subject, of, merge, Observable } from 'rxjs';
  * @fileoverview added by tsickle
  * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  */
+/**
+ * @param {?} form
+ * @param {?} callback
+ * @return {?}
+ */
+function disableTreeValidityCall(form, callback) {
+    /** @type {?} */
+    const _updateTreeValidity = form._updateTreeValidity.bind(form);
+    form._updateTreeValidity = (/**
+     * @return {?}
+     */
+    () => { });
+    callback();
+    form._updateTreeValidity = _updateTreeValidity;
+}
 /**
  * @param {?} formId
  * @param {?} field
@@ -21,8 +36,12 @@ function getFieldId(formId, field, index) {
         return field.id;
     /** @type {?} */
     let 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('_');
 }
 /**
@@ -316,25 +335,6 @@ function wrapProperty(o, prop, setFn) {
      */
     () => fns.splice(fns.indexOf(setFn), 1));
 }
-/**
- * @param {?} form
- * @param {?} action
- * @return {?}
- */
-function reduceFormUpdateValidityCalls(form, action) {
-    /** @type {?} */
-    const updateValidity = form._updateTreeValidity.bind(form);
-    /** @type {?} */
-    let updateValidityArgs = { called: false, emitEvent: false };
-    form._updateTreeValidity = (/**
-     * @param {?=} __0
-     * @return {?}
-     */
-    ({ emitEvent } = { emitEvent: true }) => updateValidityArgs = { called: true, emitEvent: emitEvent || updateValidityArgs.emitEvent });
-    action();
-    updateValidityArgs.called && updateValidity({ emitEvent: updateValidityArgs.emitEvent });
-    form._updateTreeValidity = updateValidity;
-}
 
 /**
  * @fileoverview added by tsickle
@@ -651,7 +651,7 @@ class FormlyFormBuilder {
         }
         /** @type {?} */
         const field = { fieldGroup, model, formControl, options: this._setOptions(options) };
-        reduceFormUpdateValidityCalls(formControl, (/**
+        disableTreeValidityCall(formControl, (/**
          * @return {?}
          */
         () => this._buildForm(field)));
@@ -914,15 +914,21 @@ function registerControl(field, control, emitEvent = false) {
 }
 /**
  * @param {?} c
+ * @param {?=} onlySelf
  * @return {?}
  */
-function updateValidity(c) {
+function updateValidity(c, onlySelf = false) {
     /** @type {?} */
     const status = c.status;
-    c.updateValueAndValidity({ emitEvent: false });
+    /** @type {?} */
+    const value = c.value;
+    c.updateValueAndValidity({ emitEvent: false, onlySelf });
     if (status !== c.status) {
         ((/** @type {?} */ (c.statusChanges))).emit(c.status);
     }
+    if (value !== c.value) {
+        ((/** @type {?} */ (c.valueChanges))).emit(c.value);
+    }
 }
 /**
  * @param {?} form
@@ -1646,14 +1652,7 @@ class FormlyAttributes {
         this.renderer = renderer;
         this.elementRef = elementRef;
         this.uiAttributesCache = {};
-        this.uiAttributes = [
-            ...FORMLY_VALIDATORS,
-            'tabindex',
-            'placeholder',
-            'readonly',
-            'disabled',
-            'step',
-        ];
+        this.uiAttributes = null;
         /**
          * HostBinding doesn't register listeners conditionally which may produce some perf issues.
          *
@@ -1661,12 +1660,24 @@ class FormlyAttributes {
          */
         this.uiEvents = {
             listeners: [],
-            events: [
-                'click',
-                'keyup',
-                'keydown',
-                'keypress',
-            ],
+            events: ['click', 'keyup', 'keydown', 'keypress', 'focus', 'blur', 'change'],
+            callback: (/**
+             * @param {?} eventName
+             * @param {?} $event
+             * @return {?}
+             */
+            (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;
     }
@@ -1690,18 +1701,18 @@ class FormlyAttributes {
              * @param {?} listener
              * @return {?}
              */
-            listener => listener()));
+            (listener) => listener()));
             this.uiEvents.events.forEach((/**
              * @param {?} eventName
              * @return {?}
              */
-            eventName => {
-                if (this.to && this.to[eventName]) {
+            (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 {?}
                      */
-                    (e) => this.to[eventName](this.field, e))));
+                    (e) => this.uiEvents.callback(eventName, e))));
                 }
             }));
             if (this.to && this.to.attributes) {
@@ -1757,6 +1768,15 @@ class FormlyAttributes {
      * @return {?}
      */
     ngDoCheck() {
+        if (!this.uiAttributes) {
+            /** @type {?} */
+            const element = (/** @type {?} */ (this.elementRef.nativeElement));
+            this.uiAttributes = [...FORMLY_VALIDATORS, 'tabindex', 'placeholder', 'readonly', 'disabled', 'step'].filter((/**
+             * @param {?} attr
+             * @return {?}
+             */
+            (attr) => !element.hasAttribute || !element.hasAttribute(attr)));
+        }
         this.uiAttributes.forEach((/**
          * @param {?} attr
          * @return {?}
@@ -1832,6 +1852,17 @@ class FormlyAttributes {
             this.to.blur(this.field, $event);
         }
     }
+    // handle custom `change` event, for regular ones rely on DOM listener
+    /**
+     * @param {?} $event
+     * @return {?}
+     */
+    onHostChange($event) {
+        if ($event instanceof Event) {
+            return;
+        }
+        this.onChange($event);
+    }
     /**
      * @param {?} $event
      * @return {?}
@@ -1894,9 +1925,7 @@ FormlyAttributes.decorators = [
     { type: Directive, args: [{
                 selector: '[formlyAttributes]',
                 host: {
-                    '(focus)': 'onFocus($event)',
-                    '(blur)': 'onBlur($event)',
-                    '(change)': 'onChange($event)',
+                    '(change)': 'onHostChange($event)',
                 },
             },] }
 ];
@@ -2306,10 +2335,7 @@ class FieldExpressionExtension {
         (f, ignoreCache) => {
             if (!checkLocked) {
                 checkLocked = true;
-                reduceFormUpdateValidityCalls(f.formControl, (/**
-                 * @return {?}
-                 */
-                () => this.checkField(f, ignoreCache)));
+                this.checkField(f, ignoreCache);
                 checkLocked = false;
             }
         });
@@ -2982,22 +3008,7 @@ class FieldFormExtension {
         if (field.parent) {
             return;
         }
-        /** @type {?} */
-        const fieldsToUpdate = this.setValidators(field);
-        if (fieldsToUpdate.length === 0) {
-            return;
-        }
-        if (fieldsToUpdate.length === 1) {
-            /** @type {?} */
-            let control = fieldsToUpdate[0].formControl;
-            while (control) {
-                ((/** @type {?} */ (control)))._updateTreeValidity({ onlySelf: true });
-                control = control.parent;
-            }
-        }
-        else {
-            ((/** @type {?} */ (field.formControl)))._updateTreeValidity();
-        }
+        this.setValidators(field);
     }
     /**
      * @private
@@ -3033,33 +3044,31 @@ class FieldFormExtension {
     /**
      * @private
      * @param {?} field
+     * @param {?=} disabled
      * @return {?}
      */
-    setValidators(field) {
+    setValidators(field, disabled = false) {
         /** @type {?} */
-        let updateValidity$$1 = false;
+        let markForCheck = false;
+        if (disabled === false && field.key && field.templateOptions && field.templateOptions.disabled) {
+            disabled = true;
+        }
+        (field.fieldGroup || []).forEach((/**
+         * @param {?} f
+         * @return {?}
+         */
+        f => this.setValidators(f, disabled) && (markForCheck = true)));
         if (field.key || !field.parent || (!field.key && !field.fieldGroup)) {
             const { formControl: c } = field;
-            /** @type {?} */
-            const disabled = field.templateOptions ? field.templateOptions.disabled : false;
-            if (field.key && c) {
+            field.templateOptions = field.templateOptions || {};
+            if (field.key && c && c instanceof FormControl) {
                 if (disabled && c.enabled) {
                     c.disable({ emitEvent: false, onlySelf: true });
-                    if (!c.parent) {
-                        updateValidity(c);
-                    }
-                    else {
-                        updateValidity$$1 = true;
-                    }
+                    markForCheck = true;
                 }
                 if (!disabled && c.disabled) {
                     c.enable({ emitEvent: false, onlySelf: true });
-                    if (!c.parent) {
-                        updateValidity(c);
-                    }
-                    else {
-                        updateValidity$$1 = true;
-                    }
+                    markForCheck = true;
                 }
             }
             if (c && (null === c.validator || null === c.asyncValidator)) {
@@ -3079,28 +3088,13 @@ class FieldFormExtension {
                     const v = Validators.composeAsync(this.mergeValidators(field, '_asyncValidators'));
                     return v ? v(c) : of(null);
                 }));
-                if (!c.parent) {
-                    updateValidity(c);
-                }
-                else {
-                    updateValidity$$1 = true;
-                }
+                markForCheck = true;
             }
-        }
-        /** @type {?} */
-        const fieldsToUpdate = updateValidity$$1 ? [field] : [];
-        (field.fieldGroup || []).forEach((/**
-         * @param {?} f
-         * @return {?}
-         */
-        f => {
-            /** @type {?} */
-            const childrenToUpdate = this.setValidators(f);
-            if (!updateValidity$$1) {
-                fieldsToUpdate.push(...childrenToUpdate);
+            if (markForCheck) {
+                updateValidity(c, true);
             }
-        }));
-        return fieldsToUpdate;
+        }
+        return markForCheck;
     }
     /**
      * @private