mat-contenteditable
Version:
Angular contenteditable directive for Angular forms and Material Design
2 lines • 10.2 kB
JavaScript
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("@angular/material/form-field"),require("@angular/forms"),require("@angular/material/core"),require("@angular/cdk/coercion"),require("rxjs"),require("@angular/material")):"function"==typeof define&&define.amd?define("mat-contenteditable",["exports","@angular/core","@angular/material/form-field","@angular/forms","@angular/material/core","@angular/cdk/coercion","rxjs","@angular/material"],t):t(e["mat-contenteditable"]={},e.ng.core,e.ng.material["form-field"],e.ng.forms,e.ng.material.core,e.ng.cdk.coercion,e.rxjs,e.ng.material)}(this,function(e,n,r,t,o,i,u,l){"use strict";var a=function(e,t){return(a=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var n in t)t.hasOwnProperty(n)&&(e[n]=t[n])})(e,t)};function c(e,t){function n(){this.constructor=e}a(e,t),e.prototype=null===t?Object.create(t):(n.prototype=t.prototype,new n)}var s=function v(e,t,n,r){this._defaultErrorStateMatcher=e,this._parentForm=t,this._parentFormGroup=n,this.ngControl=r},p=o.mixinErrorState(s),d=function(s){function l(e,t,n,r,o,i){var a=s.call(this,i,r,o,n)||this;return a.elementRef=e,a.renderer=t,a.ngControl=n,a.stateChanges=new u.Subject,a.id="mat-input-"+l.nextId++,a.focused=!1,a.contentEmpty=["<br>","<div><br></div>"],a._required=!1,a._disabled=!1,a.controlType="mat-input",a.describedBy="",a.propValueAccessor="innerHTML",null!=a.ngControl&&(a.ngControl.valueAccessor=a),a}return c(l,s),Object.defineProperty(l.prototype,"value",{get:function(){return this.elementRef.nativeElement[this.propValueAccessor]},set:function(e){e!==this.value&&(this.elementRef.nativeElement[this.propValueAccessor]=e,this.stateChanges.next())},enumerable:!0,configurable:!0}),Object.defineProperty(l.prototype,"placeholder",{get:function(){return this._placeholder},set:function(e){this._placeholder=e,this.stateChanges.next()},enumerable:!0,configurable:!0}),Object.defineProperty(l.prototype,"empty",{get:function(){return!this.value||this.contentEmpty.includes(this.value)},enumerable:!0,configurable:!0}),Object.defineProperty(l.prototype,"shouldLabelFloat",{get:function(){return this.focused||!this.empty},enumerable:!0,configurable:!0}),Object.defineProperty(l.prototype,"required",{get:function(){return this._required},set:function(e){this._required=i.coerceBooleanProperty(e),this.stateChanges.next()},enumerable:!0,configurable:!0}),Object.defineProperty(l.prototype,"disabled",{get:function(){return this._disabled},set:function(e){this._disabled=i.coerceBooleanProperty(e),this.stateChanges.next()},enumerable:!0,configurable:!0}),l.prototype.ngDoCheck=function(){this.ngControl&&this.updateErrorState()},l.prototype.callOnChange=function(){"function"==typeof this.onChange&&this.onChange(this.elementRef.nativeElement[this.propValueAccessor])},l.prototype.callOnFocused=function(){!0!==this.focused&&(this.focused=!0,this.stateChanges.next())},l.prototype.callOnTouched=function(){"function"==typeof this.onTouched&&this.onTouched(),!1!==this.focused&&(this.focused=!1,this.stateChanges.next())},l.prototype.setDescribedByIds=function(e){this.describedBy=e.join(" ")},l.prototype.onContainerClick=function(){this.elementRef.nativeElement.focus()},l.prototype.writeValue=function(e){var t=null==e?"":e;this.renderer.setProperty(this.elementRef.nativeElement,this.propValueAccessor,t)},l.prototype.registerOnChange=function(e){this.onChange=e},l.prototype.registerOnTouched=function(e){this.onTouched=e},l.prototype.setDisabledState=function(e){e?(this.renderer.setAttribute(this.elementRef.nativeElement,"disabled","true"),this.removeDisabledState=this.renderer.listen(this.elementRef.nativeElement,"keydown",this.listenerDisabledState)):this.removeDisabledState&&(this.renderer.removeAttribute(this.elementRef.nativeElement,"disabled"),this.removeDisabledState())},l.prototype.listenerDisabledState=function(e){e.preventDefault()},l.nextId=0,l.decorators=[{type:n.Directive,args:[{selector:"[contenteditable]",providers:[{provide:r.MatFormFieldControl,useExisting:l}]}]}],l.ctorParameters=function(){return[{type:n.ElementRef},{type:n.Renderer2},{type:t.NgControl,decorators:[{type:n.Optional},{type:n.Self}]},{type:t.NgForm,decorators:[{type:n.Optional}]},{type:t.FormGroupDirective,decorators:[{type:n.Optional}]},{type:o.ErrorStateMatcher}]},l.propDecorators={value:[{type:n.Input}],id:[{type:n.HostBinding}],placeholder:[{type:n.Input}],contentEmpty:[{type:n.Input}],required:[{type:n.Input}],disabled:[{type:n.Input}],errorState:[{type:n.HostBinding,args:["attr.aria-invalid"]}],errorStateMatcher:[{type:n.Input}],describedBy:[{type:n.HostBinding,args:["attr.aria-describedby"]}],propValueAccessor:[{type:n.Input}],callOnChange:[{type:n.HostListener,args:["input"]}],callOnFocused:[{type:n.HostListener,args:["focus"]}],callOnTouched:[{type:n.HostListener,args:["blur"]}]},l}(p),h=function(a){function s(e,t,n,r,o){var i=a.call(this,o,n,r,t)||this;return i.viewRef=e,i.ngControl=t,i.stateChanges=new u.Subject,i.id="mat-input-"+s.nextId++,i.placeholder="",i.contentEmpty=["<br>","<p> </p>"],i.focused=!1,i.required=!1,i.controlType="mat-input",i.describedBy="",i}return c(s,a),Object.defineProperty(s.prototype,"value",{get:function(){return!!this.editor.editorInstance&&this.editor.editorInstance.getData()},set:function(e){e!==this.value&&(this.editor.data=e,this.stateChanges.next())},enumerable:!0,configurable:!0}),Object.defineProperty(s.prototype,"empty",{get:function(){return!this.value||this.contentEmpty.includes(this.value)},enumerable:!0,configurable:!0}),Object.defineProperty(s.prototype,"shouldLabelFloat",{get:function(){return this.focused||!this.empty},enumerable:!0,configurable:!0}),Object.defineProperty(s.prototype,"disabled",{get:function(){return this.editor.disabled},set:function(e){this.editor.setDisabledState(e),this.stateChanges.next()},enumerable:!0,configurable:!0}),s.prototype.ngOnInit=function(){var e=this;this.editor=this.viewRef._data.componentView.component,this.editor.blur.subscribe(function(){e.focused=!1,e.stateChanges.next()}),this.editor.focus.subscribe(function(){e.focused=!0,e.stateChanges.next()})},s.prototype.ngDoCheck=function(){this.ngControl&&this.updateErrorState()},s.prototype.setDescribedByIds=function(e){this.describedBy=e.join(" ")},s.prototype.onContainerClick=function(){this.editor.editorInstance&&(this.editor.editorInstance.editing.view.focus(),this.stateChanges.next())},s.nextId=0,s.decorators=[{type:n.Directive,args:[{selector:"[matCkeditor]",providers:[{provide:l.MatFormFieldControl,useExisting:s}]}]}],s.ctorParameters=function(){return[{type:n.ViewContainerRef},{type:t.NgControl,decorators:[{type:n.Optional},{type:n.Self}]},{type:t.NgForm,decorators:[{type:n.Optional}]},{type:t.FormGroupDirective,decorators:[{type:n.Optional}]},{type:l.ErrorStateMatcher}]},s.propDecorators={value:[{type:n.Input}],id:[{type:n.HostBinding}],placeholder:[{type:n.Input}],contentEmpty:[{type:n.Input}],required:[{type:n.Input}],disabled:[{type:n.Input}],errorState:[{type:n.HostBinding,args:["attr.aria-invalid"]}],errorStateMatcher:[{type:n.Input}],describedBy:[{type:n.HostBinding,args:["attr.aria-describedby"]}]},s}(p),f=function(e){function t(){return null!==e&&e.apply(this,arguments)||this}return c(t,e),Object.defineProperty(t.prototype,"toolbar",{set:function(e){if(this.editor&&e!==this.toolbarOpen){var t=this.editor.editorInstance.plugins.get("BalloonToolbar");e?this.showToolbar(t):(t.hide(),this.toolbarOpen=!1)}},enumerable:!0,configurable:!0}),t.prototype.ngOnInit=function(){var t=this;e.prototype.ngOnInit.call(this),this.editor.ready.subscribe(function(e){var t=e.plugins.get("BalloonToolbar");t.stopListening(e.model.document.selection,"change:range"),t.stopListening(t,"_selectionChangeDebounced")}),this.editor.focus.subscribe(function(){if(t.toolbarOpen){var e=t.editor.editorInstance.plugins.get("BalloonToolbar");t.showToolbar(e)}})},t.prototype.showToolbar=function(e){e._balloon.hasView(e.toolbarView)||(e.listenTo(this.editor.editorInstance.ui,"update",function(){e._balloon.updatePosition(e._getBalloonPositionData())}),e._balloon.add({view:e.toolbarView,position:e._getBalloonPositionData(),balloonClassName:"ck-toolbar-container"}),this.toolbarOpen=!0)},t.decorators=[{type:n.Directive,args:[{selector:"[matCkeditorBalloon]",providers:[{provide:r.MatFormFieldControl,useExisting:t}]}]}],t.propDecorators={toolbar:[{type:n.Input}]},t}(h),g=function(){function e(e,t){this.renderer=e,this.elementRef=t}return e.prototype.ngAfterContentInit=function(){this.updateSize()},e.prototype.updateSize=function(){var n=this,r=this.getElement("mat-form-field-infix");this.renderer.removeStyle(r,"min-height"),setTimeout(function(){var e=n.getElement("mat-form-field-wrapper"),t=n.elementRef.nativeElement.offsetHeight-e.offsetHeight-parseFloat(getComputedStyle(e).marginTop)-parseFloat(getComputedStyle(e).marginBottom)+parseFloat(getComputedStyle(r).height);n.renderer.setStyle(r,"min-height",t+"px")})},e.prototype.getElement=function(e){return this.elementRef.nativeElement.getElementsByClassName(e).item(0)},e.decorators=[{type:n.Directive,args:[{selector:"[formFieldSizer]"}]}],e.ctorParameters=function(){return[{type:n.Renderer2},{type:n.ElementRef}]},e}(),y=function(){function e(){}return e.decorators=[{type:n.NgModule,args:[{imports:[],declarations:[d,h,f,g],exports:[d,h,f,g]}]}],e}();function m(e){if(e){var t=document.createElement("span");return t.innerHTML=e,t.textContent.replace(/\s/g,"")}return""}var b=function(){function e(){}return e.required=function(e){return m(e.value)?null:{required:!0}},e.minLength=function(n){return function(e){var t=m(e.value);return t&&t.length<n?{minlength:{requiredLength:n,actualLength:t.length}}:null}},e.maxLength=function(n){return function(e){var t=m(e.value);return t.length>n?{maxlength:{requiredLength:n,actualLength:t.length}}:null}},e}();e._MatInputMixinBase=p,e.MatContenteditableDirective=d,e.MatCkeditorDirective=h,e.MatCkeditorBalloonDirective=f,e.FormFieldSizerDirective=g,e.MatContenteditableModule=y,e.HtmlValidators=b,Object.defineProperty(e,"__esModule",{value:!0})});
//# sourceMappingURL=mat-contenteditable.umd.min.js.map