ngx-input-autosize - npm Package Compare versions

Comparing version 1.0.1 to 1.1.0

bundles/inputautosize.umd.js

@@ -30,7 +30,7 @@ (function (global, factory) {
 var AutosizeDirective = (function () {
-    function AutosizeDirective(resolver, element, vc, ngModel) {
+    function AutosizeDirective(resolver, element, vc, ngControl) {
         this.resolver = resolver;
         this.element = element;
         this.vc = vc;
-        this.ngModel = ngModel;
+        this.ngControl = ngControl;
         this.supportedInputTypes = ['text', 'search', 'tel', 'url', 'email', 'password', 'number'];
@@ -68,4 +68,4 @@ this.cssProps = [
         }
-        if (this.ngModel.valueChanges) {
-            this.ngModel.valueChanges.subscribe(function (response) {
+        if (this.ngControl.valueChanges) {
+            this.ngControl.valueChanges.subscribe(function (response) {
                 _this.autosizeComponent.autosizeValue = response;
@@ -80,3 +80,4 @@ _this.placeholderAutoSizeComponent.autosizeValue = _this.placeholder;
     AutosizeDirective.prototype.adjust = function () {
-        if (this.placeholderAutoSizeComponent.el.nativeElement.offsetWidth >= this.autosizeComponent.el.nativeElement.offsetWidth) {
+        if (this.placeholderAutoSizeComponent.el.nativeElement.offsetWidth >= this.autosizeComponent.el.nativeElement.offsetWidth
+            && !this.ngControl.value) {
             this.element.nativeElement.style.width = this.placeholderAutoSizeComponent.el.nativeElement.offsetWidth + 'px';
@@ -100,3 +101,3 @@ }
     { type: core.ViewContainerRef, },
-    { type: forms.NgModel, },
+    { type: forms.NgControl, },
 ]; };
@@ -103,0 +104,0 @@ AutosizeDirective.propDecorators = {

bundles/inputautosize.umd.min.js

@@ -1,1 +0,1 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("@angular/forms"),require("@angular/common")):"function"==typeof define&&define.amd?define(["exports","@angular/core","@angular/forms","@angular/common"],t):t((e.ng=e.ng||{},e.ng.inputautosize={}),e.ng.core,e.ng.forms,e.ng.common)}(this,function(e,t,n,o){"use strict";var i=function(){return function(e){this.el=e}}();i.decorators=[{type:t.Component,args:[{selector:"div[autosize]",template:'<span style="white-space:pre;" #shadowElement>{{autosizeValue}}</span>',styles:[":host { display:block;position: fixed; visibility:hidden; top: -9999px; left: 0px;}"]}]}],i.ctorParameters=function(){return[{type:t.ElementRef}]},i.propDecorators={autosizeValue:[{type:t.Input,args:["autosizeValue"]}],shadowElement:[{type:t.ViewChild,args:["shadowElement"]}]};var s=function(){function e(e,t,n,o){this.resolver=e,this.element=t,this.vc=n,this.ngModel=o,this.supportedInputTypes=["text","search","tel","url","email","password","number"],this.cssProps=["fontSize","fontFamily","fontWeight","fontStyle","letterSpacing","textTransform","wordSpacing","textIndent","boxSizing","borderLeftWidth","borderRightWidth","borderLeftStyle","borderRightStyle","paddingLeft","paddingRight","marginLeft","marginRight"],this.placeholder=""}return e.prototype.onInput=function(e){this.adjust()},e.prototype.ngOnInit=function(){var e=this,t=this.resolver.resolveComponentFactory(i);this.autosizeComponent=this.vc.createComponent(t).instance,this.placeholderAutoSizeComponent=this.vc.createComponent(t).instance;for(var n=0,o=this.cssProps;n<o.length;n++){var s=o[n];this.element.nativeElement.currentStyle?(this.autosizeComponent.shadowElement.nativeElement.style[s]=this.element.nativeElement.currentStyle[s],this.placeholderAutoSizeComponent.shadowElement.nativeElement.style[s]=this.element.nativeElement.currentStyle[s]):window.getComputedStyle&&(this.autosizeComponent.shadowElement.nativeElement.style[s]=getComputedStyle(this.element.nativeElement)[s],this.placeholderAutoSizeComponent.shadowElement.nativeElement.style[s]=getComputedStyle(this.element.nativeElement)[s])}this.element.nativeElement.placeholder&&(this.placeholder=this.element.nativeElement.placeholder),this.ngModel.valueChanges&&this.ngModel.valueChanges.subscribe(function(t){e.autosizeComponent.autosizeValue=t,e.placeholderAutoSizeComponent.autosizeValue=e.placeholder})},e.prototype.ngAfterContentChecked=function(){this.adjust()},e.prototype.adjust=function(){this.placeholderAutoSizeComponent.el.nativeElement.offsetWidth>=this.autosizeComponent.el.nativeElement.offsetWidth?this.element.nativeElement.style.width=this.placeholderAutoSizeComponent.el.nativeElement.offsetWidth+"px":this.element.nativeElement.style.width=this.autosizeComponent.el.nativeElement.offsetWidth+"px"},e}();s.decorators=[{type:t.Directive,args:[{selector:"input[autosize]"}]}],s.ctorParameters=function(){return[{type:t.ComponentFactoryResolver},{type:t.ElementRef},{type:t.ViewContainerRef},{type:n.NgModel}]},s.propDecorators={onInput:[{type:t.HostListener,args:["input",["$event.target"]]}]};var r=function(){return function(){}}();r.decorators=[{type:t.NgModule,args:[{declarations:[s,i],imports:[o.CommonModule,n.FormsModule],exports:[s,i],entryComponents:[i]}]}],r.ctorParameters=function(){return[]},e.AutosizeComponent=i,e.AutosizeDirective=s,e.AutosizeInputModule=r,Object.defineProperty(e,"__esModule",{value:!0})});
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("@angular/forms"),require("@angular/common")):"function"==typeof define&&define.amd?define(["exports","@angular/core","@angular/forms","@angular/common"],t):t((e.ng=e.ng||{},e.ng.inputautosize={}),e.ng.core,e.ng.forms,e.ng.common)}(this,function(e,t,n,o){"use strict";var i=function(){return function(e){this.el=e}}();i.decorators=[{type:t.Component,args:[{selector:"div[autosize]",template:'<span style="white-space:pre;" #shadowElement>{{autosizeValue}}</span>',styles:[":host { display:block;position: fixed; visibility:hidden; top: -9999px; left: 0px;}"]}]}],i.ctorParameters=function(){return[{type:t.ElementRef}]},i.propDecorators={autosizeValue:[{type:t.Input,args:["autosizeValue"]}],shadowElement:[{type:t.ViewChild,args:["shadowElement"]}]};var r=function(){function e(e,t,n,o){this.resolver=e,this.element=t,this.vc=n,this.ngControl=o,this.supportedInputTypes=["text","search","tel","url","email","password","number"],this.cssProps=["fontSize","fontFamily","fontWeight","fontStyle","letterSpacing","textTransform","wordSpacing","textIndent","boxSizing","borderLeftWidth","borderRightWidth","borderLeftStyle","borderRightStyle","paddingLeft","paddingRight","marginLeft","marginRight"],this.placeholder=""}return e.prototype.onInput=function(e){this.adjust()},e.prototype.ngOnInit=function(){var e=this,t=this.resolver.resolveComponentFactory(i);this.autosizeComponent=this.vc.createComponent(t).instance,this.placeholderAutoSizeComponent=this.vc.createComponent(t).instance;for(var n=0,o=this.cssProps;n<o.length;n++){var r=o[n];this.element.nativeElement.currentStyle?(this.autosizeComponent.shadowElement.nativeElement.style[r]=this.element.nativeElement.currentStyle[r],this.placeholderAutoSizeComponent.shadowElement.nativeElement.style[r]=this.element.nativeElement.currentStyle[r]):window.getComputedStyle&&(this.autosizeComponent.shadowElement.nativeElement.style[r]=getComputedStyle(this.element.nativeElement)[r],this.placeholderAutoSizeComponent.shadowElement.nativeElement.style[r]=getComputedStyle(this.element.nativeElement)[r])}this.element.nativeElement.placeholder&&(this.placeholder=this.element.nativeElement.placeholder),this.ngControl.valueChanges&&this.ngControl.valueChanges.subscribe(function(t){e.autosizeComponent.autosizeValue=t,e.placeholderAutoSizeComponent.autosizeValue=e.placeholder})},e.prototype.ngAfterContentChecked=function(){this.adjust()},e.prototype.adjust=function(){this.placeholderAutoSizeComponent.el.nativeElement.offsetWidth>=this.autosizeComponent.el.nativeElement.offsetWidth&&!this.ngControl.value?this.element.nativeElement.style.width=this.placeholderAutoSizeComponent.el.nativeElement.offsetWidth+"px":this.element.nativeElement.style.width=this.autosizeComponent.el.nativeElement.offsetWidth+"px"},e}();r.decorators=[{type:t.Directive,args:[{selector:"input[autosize]"}]}],r.ctorParameters=function(){return[{type:t.ComponentFactoryResolver},{type:t.ElementRef},{type:t.ViewContainerRef},{type:n.NgControl}]},r.propDecorators={onInput:[{type:t.HostListener,args:["input",["$event.target"]]}]};var s=function(){return function(){}}();s.decorators=[{type:t.NgModule,args:[{declarations:[r,i],imports:[o.CommonModule,n.FormsModule],exports:[r,i],entryComponents:[i]}]}],s.ctorParameters=function(){return[]},e.AutosizeComponent=i,e.AutosizeDirective=r,e.AutosizeInputModule=s,Object.defineProperty(e,"__esModule",{value:!0})});

package.json

     {
     "name": "ngx-input-autosize",
-    "version": "1.0.1",
+    "version": "1.1.0",
     "description": "A text input for Angular that resizes itself to the current content.",
@@ -5,0 +5,0 @@ "main": "bundles/ngxinputautosize.umd.js",

src/autosizeInput.directive.d.ts

@@ -1,2 +0,2 @@
-import { NgModel } from '@angular/forms';
+import { NgControl } from '@angular/forms';
 import { AutosizeComponent } from './autosizeInput.component';
@@ -8,3 +8,3 @@ import { ElementRef, AfterContentChecked, OnInit, ViewContainerRef, ComponentFactoryResolver } from '@angular/core';
     private vc;
-    private ngModel;
+    private ngControl;
     base: number;
@@ -17,3 +17,3 @@ supportedInputTypes: string[];
     onInput(textArea: HTMLInputElement): void;
-    constructor(resolver: ComponentFactoryResolver, element: ElementRef, vc: ViewContainerRef, ngModel: NgModel);
+    constructor(resolver: ComponentFactoryResolver, element: ElementRef, vc: ViewContainerRef, ngControl: NgControl);
     ngOnInit(): void;
@@ -20,0 +20,0 @@ ngAfterContentChecked(): void;

src/autosizeInput.directive.js

@@ -1,10 +0,10 @@
-import { NgModel } from '@angular/forms';
+import { NgControl } from '@angular/forms';
 import { AutosizeComponent } from './autosizeInput.component';
 import { ElementRef, HostListener, Directive, ViewContainerRef, ComponentFactoryResolver } from '@angular/core';
 var AutosizeDirective = (function () {
-    function AutosizeDirective(resolver, element, vc, ngModel) {
+    function AutosizeDirective(resolver, element, vc, ngControl) {
         this.resolver = resolver;
         this.element = element;
         this.vc = vc;
-        this.ngModel = ngModel;
+        this.ngControl = ngControl;
         this.supportedInputTypes = ['text', 'search', 'tel', 'url', 'email', 'password', 'number'];
@@ -42,4 +42,4 @@ this.cssProps = [
         }
-        if (this.ngModel.valueChanges) {
-            this.ngModel.valueChanges.subscribe(function (response) {
+        if (this.ngControl.valueChanges) {
+            this.ngControl.valueChanges.subscribe(function (response) {
                 _this.autosizeComponent.autosizeValue = response;
@@ -54,3 +54,4 @@ _this.placeholderAutoSizeComponent.autosizeValue = _this.placeholder;
     AutosizeDirective.prototype.adjust = function () {
-        if (this.placeholderAutoSizeComponent.el.nativeElement.offsetWidth >= this.autosizeComponent.el.nativeElement.offsetWidth) {
+        if (this.placeholderAutoSizeComponent.el.nativeElement.offsetWidth >= this.autosizeComponent.el.nativeElement.offsetWidth
+            && !this.ngControl.value) {
             this.element.nativeElement.style.width = this.placeholderAutoSizeComponent.el.nativeElement.offsetWidth + 'px';
@@ -75,3 +76,3 @@ }
     { type: ViewContainerRef, },
-    { type: NgModel, },
+    { type: NgControl, },
 ]; };
@@ -78,0 +79,0 @@ AutosizeDirective.propDecorators = {

src/autosizeInput.directive.metadata.json

@@ -1,1 +0,1 @@
-[{"__symbolic":"module","version":3,"metadata":{"AutosizeDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive"},"arguments":[{"selector":"input[autosize]"}]}],"members":{"onInput":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener"},"arguments":["input",["$event.target"]]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ComponentFactoryResolver"},{"__symbolic":"reference","module":"@angular/core","name":"ElementRef"},{"__symbolic":"reference","module":"@angular/core","name":"ViewContainerRef"},{"__symbolic":"reference","module":"@angular/forms","name":"NgModel"}]}],"ngOnInit":[{"__symbolic":"method"}],"ngAfterContentChecked":[{"__symbolic":"method"}],"adjust":[{"__symbolic":"method"}]}}}},{"__symbolic":"module","version":1,"metadata":{"AutosizeDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive"},"arguments":[{"selector":"input[autosize]"}]}],"members":{"onInput":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener"},"arguments":["input",["$event.target"]]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ComponentFactoryResolver"},{"__symbolic":"reference","module":"@angular/core","name":"ElementRef"},{"__symbolic":"reference","module":"@angular/core","name":"ViewContainerRef"},{"__symbolic":"reference","module":"@angular/forms","name":"NgModel"}]}],"ngOnInit":[{"__symbolic":"method"}],"ngAfterContentChecked":[{"__symbolic":"method"}],"adjust":[{"__symbolic":"method"}]}}}}]
+[{"__symbolic":"module","version":3,"metadata":{"AutosizeDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive"},"arguments":[{"selector":"input[autosize]"}]}],"members":{"onInput":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener"},"arguments":["input",["$event.target"]]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ComponentFactoryResolver"},{"__symbolic":"reference","module":"@angular/core","name":"ElementRef"},{"__symbolic":"reference","module":"@angular/core","name":"ViewContainerRef"},{"__symbolic":"reference","module":"@angular/forms","name":"NgControl"}]}],"ngOnInit":[{"__symbolic":"method"}],"ngAfterContentChecked":[{"__symbolic":"method"}],"adjust":[{"__symbolic":"method"}]}}}},{"__symbolic":"module","version":1,"metadata":{"AutosizeDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive"},"arguments":[{"selector":"input[autosize]"}]}],"members":{"onInput":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener"},"arguments":["input",["$event.target"]]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ComponentFactoryResolver"},{"__symbolic":"reference","module":"@angular/core","name":"ElementRef"},{"__symbolic":"reference","module":"@angular/core","name":"ViewContainerRef"},{"__symbolic":"reference","module":"@angular/forms","name":"NgControl"}]}],"ngOnInit":[{"__symbolic":"method"}],"ngAfterContentChecked":[{"__symbolic":"method"}],"adjust":[{"__symbolic":"method"}]}}}}]

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

Lines of code

295

increased by0.68%

Worsened metrics

Total package byte prevSize

34198

decreased by-0.47%

No dependency changes