angular-hybrid-forms - npm Package Compare versions

Comparing version 0.0.20 to 0.0.21

angular-hybrid-forms.es5.js

@@ -105,6 +105,8 @@ import { ChangeDetectorRef, Component, ContentChild, Directive, EventEmitter, Input, NgModule, Optional, Output, Pipe, Self, SkipSelf } from '@angular/core';
      * @param {?} formGroupNameDirective
+     * @param {?} cd
      */
-    function FormControlNameDirective(formGroupDirective, formGroupNameDirective) {
+    function FormControlNameDirective(formGroupDirective, formGroupNameDirective, cd) {
         this.formGroupDirective = formGroupDirective;
         this.formGroupNameDirective = formGroupNameDirective;
+        this.cd = cd;
         this.validValueChangeDebounce = defaultValidValueChangeDebounce;
@@ -178,2 +180,3 @@ this.formControlValueChange = new EventEmitter();
         addControl(this.formGroupNameDirective, this.formGroupDirective, this.formControlName, this.formControl, this.formControlValueChange, this.formControlValidValueChange, this.formControlValidValueDebounceStarted, this.validValueChangeDebounce);
+        this.cd.markForCheck();
     };
@@ -189,2 +192,3 @@ FormControlNameDirective.decorators = [
         { type: FormGroupNameDirective, decorators: [{ type: Optional }, { type: SkipSelf },] },
+        { type: ChangeDetectorRef, },
     ]; };
@@ -191,0 +195,0 @@ FormControlNameDirective.propDecorators = {

angular-hybrid-forms.js

@@ -104,6 +104,8 @@ import { ChangeDetectorRef, Component, ContentChild, Directive, EventEmitter, Input, NgModule, Optional, Output, Pipe, Self, SkipSelf } from '@angular/core';
      * @param {?} formGroupNameDirective
+     * @param {?} cd
      */
-    constructor(formGroupDirective, formGroupNameDirective) {
+    constructor(formGroupDirective, formGroupNameDirective, cd) {
         this.formGroupDirective = formGroupDirective;
         this.formGroupNameDirective = formGroupNameDirective;
+        this.cd = cd;
         this.validValueChangeDebounce = defaultValidValueChangeDebounce;
@@ -157,2 +159,3 @@ this.formControlValueChange = new EventEmitter();
         addControl(this.formGroupNameDirective, this.formGroupDirective, this.formControlName, this.formControl, this.formControlValueChange, this.formControlValidValueChange, this.formControlValidValueDebounceStarted, this.validValueChangeDebounce);
+        this.cd.markForCheck();
     }
@@ -169,2 +172,3 @@ }
     { type: FormGroupNameDirective, decorators: [{ type: Optional }, { type: SkipSelf },] },
+    { type: ChangeDetectorRef, },
 ];
@@ -171,0 +175,0 @@ FormControlNameDirective.propDecorators = {

angular-hybrid-forms.metadata.json

@@ -1,1 +0,1 @@
-{"__symbolic":"module","version":3,"metadata":{"HybridFormsModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule"},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule"},{"__symbolic":"reference","module":"@angular/forms","name":"ReactiveFormsModule"}],"declarations":[{"__symbolic":"reference","name":"ɵa"},{"__symbolic":"reference","name":"ɵb"},{"__symbolic":"reference","name":"ɵd"},{"__symbolic":"reference","name":"ɵe"},{"__symbolic":"reference","name":"ɵf"},{"__symbolic":"reference","name":"ɵc"}],"exports":[{"__symbolic":"reference","name":"ɵa"},{"__symbolic":"reference","name":"ɵb"},{"__symbolic":"reference","name":"ɵd"},{"__symbolic":"reference","name":"ɵe"},{"__symbolic":"reference","name":"ɵf"},{"__symbolic":"reference","name":"ɵc"}]}]}],"members":{}},"ɵa":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"hf-form","template":"\n    <form [formGroup]=\"group\" (submit)=\"onSubmit($event)\" class=\"hf-form\" novalidate>\n      <div class=\"hf-form__content\">\n        <ng-content></ng-content>\n      </div>\n      <div class=\"hf-form__buttons\">\n      </div>\n    </form>\n  "}]}],"members":{"buttons":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"validSubmit":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onSubmit":[{"__symbolic":"method"}]}},"ɵb":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive"},"arguments":[{"selector":"[formControlName]"}]}],"members":{"formControlName":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"validValueChangeDebounce":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"formControlValueChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"formControlValidValueChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"SkipSelf"}}],[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional"}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"SkipSelf"}}]],"parameters":[{"__symbolic":"reference","module":"@angular/forms","name":"FormGroupDirective"},{"__symbolic":"reference","name":"ɵc"}]}],"formControlValue":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"ngOnInit":[{"__symbolic":"method"}]}},"ɵc":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive"},"arguments":[{"selector":"[formGroupName],[formGroup]"}]}],"members":{"formGroupName":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"validValueChangeDebounce":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"formControlValueChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"formControlValidValueChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional"}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Self"}}],[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional"}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"SkipSelf"}}],[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional"}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"SkipSelf"}}],null],"parameters":[{"__symbolic":"reference","module":"@angular/forms","name":"FormGroupDirective"},{"__symbolic":"reference","module":"@angular/forms","name":"FormGroupDirective"},{"__symbolic":"reference","name":"ɵc"},{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef"}]}],"ngOnInit":[{"__symbolic":"method"}]}},"ɵd":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Pipe"},"arguments":[{"name":"formGroup"}]}],"members":{"transform":[{"__symbolic":"method"}]}},"ɵe":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"hf-form-control","template":"\n    <div class=\"hf-field\"\n         [class.hf-field--required]=\"required\" \n         [class.hf-field--invalid]=\"!valid\" \n         [class.hf-field--valid-value-changes]=\"validValueChanges\">\n      <label class=\"hf-field__label\">{{label}}</label>\n      <span class=\"hf-field__control\"><ng-content></ng-content></span>\n      <label *ngIf=\"!valid\" class=\"hf-field__errors\">{{errors|json}}</label>\n    </div>"}]}],"members":{"label":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"requiredValidator":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild"},"arguments":[{"__symbolic":"reference","module":"@angular/forms","name":"RequiredValidator"}]}]}],"formControlNameDirective":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild"},"arguments":[{"__symbolic":"reference","name":"ɵb"}]}]}],"ngAfterContentInit":[{"__symbolic":"method"}]}},"ɵf":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"hf-form-group","template":"<ng-content></ng-content>"}]}],"members":{"formGroupNameDirective":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild"},"arguments":[{"__symbolic":"reference","name":"ɵc"}]}]}]}}},"origins":{"HybridFormsModule":"./src/hybrid-forms.module","ɵa":"./src/component/form.component","ɵb":"./src/directive/form-control-name.directive","ɵc":"./src/directive/form-group-name.directive","ɵd":"./src/pipe/form-group.pipe","ɵe":"./src/component/form-control.component","ɵf":"./src/component/form-group.component"},"importAs":"angular-hybrid-forms"}
+{"__symbolic":"module","version":3,"metadata":{"HybridFormsModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule"},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule"},{"__symbolic":"reference","module":"@angular/forms","name":"ReactiveFormsModule"}],"declarations":[{"__symbolic":"reference","name":"ɵa"},{"__symbolic":"reference","name":"ɵb"},{"__symbolic":"reference","name":"ɵd"},{"__symbolic":"reference","name":"ɵe"},{"__symbolic":"reference","name":"ɵf"},{"__symbolic":"reference","name":"ɵc"}],"exports":[{"__symbolic":"reference","name":"ɵa"},{"__symbolic":"reference","name":"ɵb"},{"__symbolic":"reference","name":"ɵd"},{"__symbolic":"reference","name":"ɵe"},{"__symbolic":"reference","name":"ɵf"},{"__symbolic":"reference","name":"ɵc"}]}]}],"members":{}},"ɵa":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"hf-form","template":"\n    <form [formGroup]=\"group\" (submit)=\"onSubmit($event)\" class=\"hf-form\" novalidate>\n      <div class=\"hf-form__content\">\n        <ng-content></ng-content>\n      </div>\n      <div class=\"hf-form__buttons\">\n      </div>\n    </form>\n  "}]}],"members":{"buttons":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"validSubmit":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onSubmit":[{"__symbolic":"method"}]}},"ɵb":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive"},"arguments":[{"selector":"[formControlName]"}]}],"members":{"formControlName":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"validValueChangeDebounce":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"formControlValueChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"formControlValidValueChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"SkipSelf"}}],[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional"}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"SkipSelf"}}],null],"parameters":[{"__symbolic":"reference","module":"@angular/forms","name":"FormGroupDirective"},{"__symbolic":"reference","name":"ɵc"},{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef"}]}],"formControlValue":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"ngOnInit":[{"__symbolic":"method"}]}},"ɵc":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive"},"arguments":[{"selector":"[formGroupName],[formGroup]"}]}],"members":{"formGroupName":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"validValueChangeDebounce":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"formControlValueChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"formControlValidValueChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional"}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Self"}}],[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional"}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"SkipSelf"}}],[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional"}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"SkipSelf"}}],null],"parameters":[{"__symbolic":"reference","module":"@angular/forms","name":"FormGroupDirective"},{"__symbolic":"reference","module":"@angular/forms","name":"FormGroupDirective"},{"__symbolic":"reference","name":"ɵc"},{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef"}]}],"ngOnInit":[{"__symbolic":"method"}]}},"ɵd":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Pipe"},"arguments":[{"name":"formGroup"}]}],"members":{"transform":[{"__symbolic":"method"}]}},"ɵe":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"hf-form-control","template":"\n    <div class=\"hf-field\"\n         [class.hf-field--required]=\"required\" \n         [class.hf-field--invalid]=\"!valid\" \n         [class.hf-field--valid-value-changes]=\"validValueChanges\">\n      <label class=\"hf-field__label\">{{label}}</label>\n      <span class=\"hf-field__control\"><ng-content></ng-content></span>\n      <label *ngIf=\"!valid\" class=\"hf-field__errors\">{{errors|json}}</label>\n    </div>"}]}],"members":{"label":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"requiredValidator":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild"},"arguments":[{"__symbolic":"reference","module":"@angular/forms","name":"RequiredValidator"}]}]}],"formControlNameDirective":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild"},"arguments":[{"__symbolic":"reference","name":"ɵb"}]}]}],"ngAfterContentInit":[{"__symbolic":"method"}]}},"ɵf":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"hf-form-group","template":"<ng-content></ng-content>"}]}],"members":{"formGroupNameDirective":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild"},"arguments":[{"__symbolic":"reference","name":"ɵc"}]}]}]}}},"origins":{"HybridFormsModule":"./src/hybrid-forms.module","ɵa":"./src/component/form.component","ɵb":"./src/directive/form-control-name.directive","ɵc":"./src/directive/form-group-name.directive","ɵd":"./src/pipe/form-group.pipe","ɵe":"./src/component/form-control.component","ɵf":"./src/component/form-group.component"},"importAs":"angular-hybrid-forms"}

bundles/angular-hybrid-forms.umd.js

@@ -105,6 +105,8 @@ (function (global, factory) {
      * @param {?} formGroupNameDirective
+     * @param {?} cd
      */
-    function FormControlNameDirective(formGroupDirective, formGroupNameDirective) {
+    function FormControlNameDirective(formGroupDirective, formGroupNameDirective, cd) {
         this.formGroupDirective = formGroupDirective;
         this.formGroupNameDirective = formGroupNameDirective;
+        this.cd = cd;
         this.validValueChangeDebounce = defaultValidValueChangeDebounce;
@@ -178,2 +180,3 @@ this.formControlValueChange = new _angular_core.EventEmitter();
         addControl(this.formGroupNameDirective, this.formGroupDirective, this.formControlName, this.formControl, this.formControlValueChange, this.formControlValidValueChange, this.formControlValidValueDebounceStarted, this.validValueChangeDebounce);
+        this.cd.markForCheck();
     };
@@ -189,2 +192,3 @@ FormControlNameDirective.decorators = [
         { type: FormGroupNameDirective, decorators: [{ type: _angular_core.Optional }, { type: _angular_core.SkipSelf },] },
+        { type: _angular_core.ChangeDetectorRef, },
     ]; };
@@ -191,0 +195,0 @@ FormControlNameDirective.propDecorators = {

bundles/angular-hybrid-forms.umd.min.js

@@ -1,2 +0,2 @@
-!function(e,r){"object"==typeof exports&&"undefined"!=typeof module?r(exports,require("@angular/core"),require("@angular/common"),require("@angular/forms"),require("rxjs/add/operator/debounceTime"),require("rxjs/Subject")):"function"==typeof define&&define.amd?define(["exports","@angular/core","@angular/common","@angular/forms","rxjs/add/operator/debounceTime","rxjs/Subject"],r):r(e.angularHybridForms=e.angularHybridForms||{},e.ng.core,e.ng.common,e.ng.forms,null,e.rxjs_Subject)}(this,function(e,r,t,o,n,i){"use strict";function a(e,r,t,o,n,i,a,l){var s=e&&e.formGroup||r&&r.form;s!=o&&(u(s,t,o),o.valueChanges.subscribe(function(e){return n.emit(e)}),o.valueChanges.subscribe(function(e){return o.valid?a.next(e):null}),o.valueChanges.debounceTime(l).subscribe(function(e){return o.valid?i.emit(e):null}))}function u(e,r,t){e&&(l(e,r),e.addControl(r,t))}function l(e,r){if(e.get(r))throw new Error("A control of named: '"+r+"' already exists on parent: "+JSON.stringify(e.value)+". Perhaps you did not name your group or control?")}var s=400,f=function(){function e(e,t,n,a){this.self=e,this.formGroupDirective=t,this.formGroupNameDirective=n,this.cd=a,this.validValueChangeDebounce=s,this.formControlValueChange=new r.EventEmitter,this.formControlValidValueChange=new r.EventEmitter,this.formControlValidValueDebounceStarted=new i.Subject,this.formGroup=new o.FormGroup({})}return e.prototype.ngOnInit=function(){this.formGroupName||(this.formGroup=this.self.form),a(this.formGroupNameDirective,this.formGroupDirective,this.formGroupName,this.formGroup,this.formControlValueChange,this.formControlValidValueChange,this.formControlValidValueDebounceStarted,this.validValueChangeDebounce),this.cd.detectChanges()},e.decorators=[{type:r.Directive,args:[{selector:"[formGroupName],[formGroup]"}]}],e.ctorParameters=function(){return[{type:o.FormGroupDirective,decorators:[{type:r.Optional},{type:r.Self}]},{type:o.FormGroupDirective,decorators:[{type:r.Optional},{type:r.SkipSelf}]},{type:e,decorators:[{type:r.Optional},{type:r.SkipSelf}]},{type:r.ChangeDetectorRef}]},e.propDecorators={formGroupName:[{type:r.Input}],validValueChangeDebounce:[{type:r.Input}],formControlValueChange:[{type:r.Output}],formControlValidValueChange:[{type:r.Output}]},e}(),c=function(){function e(e,t){this.formGroupDirective=e,this.formGroupNameDirective=t,this.validValueChangeDebounce=s,this.formControlValueChange=new r.EventEmitter,this.formControlValidValueChange=new r.EventEmitter,this.formControlValidValueDebounceStarted=new i.Subject,this.formControl=new o.FormControl}return Object.defineProperty(e.prototype,"formControlValue",{get:function(){return this.formControl.value},set:function(e){this.formControl.setValue(e)},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"valid",{get:function(){return this.formControl.valid},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"pristine",{get:function(){return this.formControl.pristine},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"groupSubmitted",{get:function(){return this.formGroupDirective.submitted},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"errors",{get:function(){return this.formControl.errors},enumerable:!0,configurable:!0}),e.prototype.ngOnInit=function(){a(this.formGroupNameDirective,this.formGroupDirective,this.formControlName,this.formControl,this.formControlValueChange,this.formControlValidValueChange,this.formControlValidValueDebounceStarted,this.validValueChangeDebounce)},e.decorators=[{type:r.Directive,args:[{selector:"[formControlName]"}]}],e.ctorParameters=function(){return[{type:o.FormGroupDirective,decorators:[{type:r.SkipSelf}]},{type:f,decorators:[{type:r.Optional},{type:r.SkipSelf}]}]},e.propDecorators={formControlName:[{type:r.Input}],validValueChangeDebounce:[{type:r.Input}],formControlValueChange:[{type:r.Output}],formControlValidValueChange:[{type:r.Output}],formControlValue:[{type:r.Input}]},e}(),p=function(){function e(){}return e.prototype.transform=function(){return new o.FormGroup({})},e.decorators=[{type:r.Pipe,args:[{name:"formGroup"}]}],e.ctorParameters=function(){return[]},e}(),m=function(){function e(){this.validValueChanges=!1}return e.prototype.ngAfterContentInit=function(){var e=this;this.formControlNameDirective.formControlValidValueDebounceStarted.subscribe(function(r){return e.validValueChanges=!0}),this.formControlNameDirective.formControlValidValueChange.subscribe(function(r){return e.validValueChanges=!1})},Object.defineProperty(e.prototype,"required",{get:function(){return this.requiredValidator&&this.requiredValidator.required},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"valid",{get:function(){return this.formControlNameDirective&&(!this.formControlNameDirective.groupSubmitted&&this.formControlNameDirective.pristine||this.formControlNameDirective.valid)},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"errors",{get:function(){return this.formControlNameDirective&&this.formControlNameDirective.errors},enumerable:!0,configurable:!0}),e.decorators=[{type:r.Component,args:[{selector:"hf-form-control",template:'\n    <div class="hf-field"\n         [class.hf-field--required]="required" \n         [class.hf-field--invalid]="!valid" \n         [class.hf-field--valid-value-changes]="validValueChanges">\n      <label class="hf-field__label">{{label}}</label>\n      <span class="hf-field__control"><ng-content></ng-content></span>\n      <label *ngIf="!valid" class="hf-field__errors">{{errors|json}}</label>\n    </div>'}]}],e.ctorParameters=function(){return[]},e.propDecorators={label:[{type:r.Input}],requiredValidator:[{type:r.ContentChild,args:[o.RequiredValidator]}],formControlNameDirective:[{type:r.ContentChild,args:[c]}]},e}(),d=function(){function e(){}return Object.defineProperty(e.prototype,"group",{get:function(){return this.formGroupNameDirective.formGroup},enumerable:!0,configurable:!0}),e.decorators=[{type:r.Component,args:[{selector:"hf-form-group",template:"<ng-content></ng-content>"}]}],e.ctorParameters=function(){return[]},e.propDecorators={formGroupNameDirective:[{type:r.ContentChild,args:[f]}]},e}(),h=function(){function e(){this.validSubmit=new r.EventEmitter,this.group=new o.FormGroup({})}return e.prototype.onSubmit=function(e){this.group.valid&&this.validSubmit.emit(e)},e.decorators=[{type:r.Component,args:[{selector:"hf-form",template:'\n    <form [formGroup]="group" (submit)="onSubmit($event)" class="hf-form" novalidate>\n      <div class="hf-form__content">\n        <ng-content></ng-content>\n      </div>\n      <div class="hf-form__buttons">\n      </div>\n    </form>\n  '}]}],e.ctorParameters=function(){return[]},e.propDecorators={buttons:[{type:r.Input}],validSubmit:[{type:r.Output}]},e}(),g=function(){function e(){}return e.decorators=[{type:r.NgModule,args:[{imports:[t.CommonModule,o.ReactiveFormsModule],declarations:[h,c,p,m,d,f],exports:[h,c,p,m,d,f]}]}],e.ctorParameters=function(){return[]},e}();e.HybridFormsModule=g,e.ɵe=m,e.ɵf=d,e.ɵa=h,e.ɵb=c,e.ɵc=f,e.ɵd=p,Object.defineProperty(e,"__esModule",{value:!0})});
+!function(e,r){"object"==typeof exports&&"undefined"!=typeof module?r(exports,require("@angular/core"),require("@angular/common"),require("@angular/forms"),require("rxjs/add/operator/debounceTime"),require("rxjs/Subject")):"function"==typeof define&&define.amd?define(["exports","@angular/core","@angular/common","@angular/forms","rxjs/add/operator/debounceTime","rxjs/Subject"],r):r(e.angularHybridForms=e.angularHybridForms||{},e.ng.core,e.ng.common,e.ng.forms,null,e.rxjs_Subject)}(this,function(e,r,t,o,n,i){"use strict";function a(e,r,t,o,n,i,a,l){var s=e&&e.formGroup||r&&r.form;s!=o&&(u(s,t,o),o.valueChanges.subscribe(function(e){return n.emit(e)}),o.valueChanges.subscribe(function(e){return o.valid?a.next(e):null}),o.valueChanges.debounceTime(l).subscribe(function(e){return o.valid?i.emit(e):null}))}function u(e,r,t){e&&(l(e,r),e.addControl(r,t))}function l(e,r){if(e.get(r))throw new Error("A control of named: '"+r+"' already exists on parent: "+JSON.stringify(e.value)+". Perhaps you did not name your group or control?")}var s=400,c=function(){function e(e,t,n,a){this.self=e,this.formGroupDirective=t,this.formGroupNameDirective=n,this.cd=a,this.validValueChangeDebounce=s,this.formControlValueChange=new r.EventEmitter,this.formControlValidValueChange=new r.EventEmitter,this.formControlValidValueDebounceStarted=new i.Subject,this.formGroup=new o.FormGroup({})}return e.prototype.ngOnInit=function(){this.formGroupName||(this.formGroup=this.self.form),a(this.formGroupNameDirective,this.formGroupDirective,this.formGroupName,this.formGroup,this.formControlValueChange,this.formControlValidValueChange,this.formControlValidValueDebounceStarted,this.validValueChangeDebounce),this.cd.detectChanges()},e.decorators=[{type:r.Directive,args:[{selector:"[formGroupName],[formGroup]"}]}],e.ctorParameters=function(){return[{type:o.FormGroupDirective,decorators:[{type:r.Optional},{type:r.Self}]},{type:o.FormGroupDirective,decorators:[{type:r.Optional},{type:r.SkipSelf}]},{type:e,decorators:[{type:r.Optional},{type:r.SkipSelf}]},{type:r.ChangeDetectorRef}]},e.propDecorators={formGroupName:[{type:r.Input}],validValueChangeDebounce:[{type:r.Input}],formControlValueChange:[{type:r.Output}],formControlValidValueChange:[{type:r.Output}]},e}(),f=function(){function e(e,t,n){this.formGroupDirective=e,this.formGroupNameDirective=t,this.cd=n,this.validValueChangeDebounce=s,this.formControlValueChange=new r.EventEmitter,this.formControlValidValueChange=new r.EventEmitter,this.formControlValidValueDebounceStarted=new i.Subject,this.formControl=new o.FormControl}return Object.defineProperty(e.prototype,"formControlValue",{get:function(){return this.formControl.value},set:function(e){this.formControl.setValue(e)},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"valid",{get:function(){return this.formControl.valid},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"pristine",{get:function(){return this.formControl.pristine},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"groupSubmitted",{get:function(){return this.formGroupDirective.submitted},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"errors",{get:function(){return this.formControl.errors},enumerable:!0,configurable:!0}),e.prototype.ngOnInit=function(){a(this.formGroupNameDirective,this.formGroupDirective,this.formControlName,this.formControl,this.formControlValueChange,this.formControlValidValueChange,this.formControlValidValueDebounceStarted,this.validValueChangeDebounce),this.cd.markForCheck()},e.decorators=[{type:r.Directive,args:[{selector:"[formControlName]"}]}],e.ctorParameters=function(){return[{type:o.FormGroupDirective,decorators:[{type:r.SkipSelf}]},{type:c,decorators:[{type:r.Optional},{type:r.SkipSelf}]},{type:r.ChangeDetectorRef}]},e.propDecorators={formControlName:[{type:r.Input}],validValueChangeDebounce:[{type:r.Input}],formControlValueChange:[{type:r.Output}],formControlValidValueChange:[{type:r.Output}],formControlValue:[{type:r.Input}]},e}(),p=function(){function e(){}return e.prototype.transform=function(){return new o.FormGroup({})},e.decorators=[{type:r.Pipe,args:[{name:"formGroup"}]}],e.ctorParameters=function(){return[]},e}(),m=function(){function e(){this.validValueChanges=!1}return e.prototype.ngAfterContentInit=function(){var e=this;this.formControlNameDirective.formControlValidValueDebounceStarted.subscribe(function(r){return e.validValueChanges=!0}),this.formControlNameDirective.formControlValidValueChange.subscribe(function(r){return e.validValueChanges=!1})},Object.defineProperty(e.prototype,"required",{get:function(){return this.requiredValidator&&this.requiredValidator.required},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"valid",{get:function(){return this.formControlNameDirective&&(!this.formControlNameDirective.groupSubmitted&&this.formControlNameDirective.pristine||this.formControlNameDirective.valid)},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"errors",{get:function(){return this.formControlNameDirective&&this.formControlNameDirective.errors},enumerable:!0,configurable:!0}),e.decorators=[{type:r.Component,args:[{selector:"hf-form-control",template:'\n    <div class="hf-field"\n         [class.hf-field--required]="required" \n         [class.hf-field--invalid]="!valid" \n         [class.hf-field--valid-value-changes]="validValueChanges">\n      <label class="hf-field__label">{{label}}</label>\n      <span class="hf-field__control"><ng-content></ng-content></span>\n      <label *ngIf="!valid" class="hf-field__errors">{{errors|json}}</label>\n    </div>'}]}],e.ctorParameters=function(){return[]},e.propDecorators={label:[{type:r.Input}],requiredValidator:[{type:r.ContentChild,args:[o.RequiredValidator]}],formControlNameDirective:[{type:r.ContentChild,args:[f]}]},e}(),d=function(){function e(){}return Object.defineProperty(e.prototype,"group",{get:function(){return this.formGroupNameDirective.formGroup},enumerable:!0,configurable:!0}),e.decorators=[{type:r.Component,args:[{selector:"hf-form-group",template:"<ng-content></ng-content>"}]}],e.ctorParameters=function(){return[]},e.propDecorators={formGroupNameDirective:[{type:r.ContentChild,args:[c]}]},e}(),h=function(){function e(){this.validSubmit=new r.EventEmitter,this.group=new o.FormGroup({})}return e.prototype.onSubmit=function(e){this.group.valid&&this.validSubmit.emit(e)},e.decorators=[{type:r.Component,args:[{selector:"hf-form",template:'\n    <form [formGroup]="group" (submit)="onSubmit($event)" class="hf-form" novalidate>\n      <div class="hf-form__content">\n        <ng-content></ng-content>\n      </div>\n      <div class="hf-form__buttons">\n      </div>\n    </form>\n  '}]}],e.ctorParameters=function(){return[]},e.propDecorators={buttons:[{type:r.Input}],validSubmit:[{type:r.Output}]},e}(),g=function(){function e(){}return e.decorators=[{type:r.NgModule,args:[{imports:[t.CommonModule,o.ReactiveFormsModule],declarations:[h,f,p,m,d,c],exports:[h,f,p,m,d,c]}]}],e.ctorParameters=function(){return[]},e}();e.HybridFormsModule=g,e.ɵe=m,e.ɵf=d,e.ɵa=h,e.ɵb=f,e.ɵc=c,e.ɵd=p,Object.defineProperty(e,"__esModule",{value:!0})});
 //# sourceMappingURL=angular-hybrid-forms.umd.min.js.map

package.json

 {
   "name": "angular-hybrid-forms",
-  "version": "0.0.20",
+  "version": "0.0.21",
   "description": "An Angular form library offering a middleground between a template-driven, reactive forms and more",
@@ -5,0 +5,0 @@ "main": "./bundles/quickstart-lib.umd.js",

src/directive/form-control-name.directive.d.ts

@@ -1,2 +0,2 @@
-import { EventEmitter, OnInit } from '@angular/core';
+import { ChangeDetectorRef, EventEmitter, OnInit } from '@angular/core';
 import { FormGroupDirective } from '@angular/forms';
@@ -8,2 +8,3 @@ import { FormGroupNameDirective } from './form-group-name.directive';
     private formGroupNameDirective;
+    private cd;
     formControlName: any;
@@ -15,3 +16,3 @@ validValueChangeDebounce: number;
     private formControl;
-    constructor(formGroupDirective: FormGroupDirective, formGroupNameDirective: FormGroupNameDirective);
+    constructor(formGroupDirective: FormGroupDirective, formGroupNameDirective: FormGroupNameDirective, cd: ChangeDetectorRef);
     formControlValue: any;
@@ -18,0 +19,0 @@ readonly valid: boolean;

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

176107

increased by0.96%

Lines of code

1211

increased by1.09%

No dependency changes