UNPKG

mat-contenteditable

Version:

Angular contenteditable directive for Angular forms and Material Design

16 lines (14 loc) 13.5 kB
!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("@ckeditor/ckeditor5-angular")):"function"==typeof define&&define.amd?define("mat-contenteditable",["exports","@angular/core","@angular/material/form-field","@angular/forms","@angular/material/core","@angular/cdk/coercion","rxjs","@ckeditor/ckeditor5-angular"],t):t((e=e||self)["mat-contenteditable"]={},e.ng.core,e.ng.material["form-field"],e.ng.forms,e.ng.material.core,e.ng.cdk.coercion,e.rxjs,e.ckeditor5Angular)}(this,(function(e,t,n,o,r,i,a,s){"use strict"; /*! ***************************************************************************** Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0 THIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE, MERCHANTABLITY OR NON-INFRINGEMENT. See the Apache Version 2.0 License for specific language governing permissions and limitations under the License. ***************************************************************************** */var p=function(e,t){return(p=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 l(e,t){function n(){this.constructor=e}p(e,t),e.prototype=null===t?Object.create(t):(n.prototype=t.prototype,new n)}function u(e,t,n,o){var r,i=arguments.length,a=i<3?t:null===o?o=Object.getOwnPropertyDescriptor(t,n):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,n,o);else for(var s=e.length-1;s>=0;s--)(r=e[s])&&(a=(i<3?r(a):i>3?r(t,n,a):r(t,n))||a);return i>3&&a&&Object.defineProperty(t,n,a),a}function c(e,t){return function(n,o){t(n,o,e)}}function d(e,t){if("object"==typeof Reflect&&"function"==typeof Reflect.metadata)return Reflect.metadata(e,t)}var f=function(e,t,n,o){this._defaultErrorStateMatcher=e,this._parentForm=t,this._parentFormGroup=n,this.ngControl=o},y=r.mixinErrorState(f),g=function(e){function s(t,n,o,r,i,s){var l=e.call(this,s,r,i,o)||this;return l.elementRef=t,l.renderer=n,l.ngControl=o,l.stateChanges=new a.Subject,l.id="mat-input-"+p.nextId++,l.focused=!1,l.contentEmpty=["<br>","<div><br></div>"],l._required=!1,l._disabled=!1,l.controlType="mat-input",l.describedBy="",l.propValueAccessor="innerHTML",null!=l.ngControl&&(l.ngControl.valueAccessor=l),l}var p;return l(s,e),p=s,Object.defineProperty(s.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(s.prototype,"placeholder",{get:function(){return this._placeholder},set:function(e){this._placeholder=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,"required",{get:function(){return this._required},set:function(e){this._required=i.coerceBooleanProperty(e),this.stateChanges.next()},enumerable:!0,configurable:!0}),Object.defineProperty(s.prototype,"disabled",{get:function(){return this._disabled},set:function(e){this._disabled=i.coerceBooleanProperty(e),this.stateChanges.next()},enumerable:!0,configurable:!0}),s.prototype.ngDoCheck=function(){this.ngControl&&this.updateErrorState()},s.prototype.callOnChange=function(){"function"==typeof this.onChange&&this.onChange(this.elementRef.nativeElement[this.propValueAccessor])},s.prototype.callOnFocused=function(){!0!==this.focused&&(this.focused=!0,this.stateChanges.next())},s.prototype.callOnTouched=function(){"function"==typeof this.onTouched&&this.onTouched(),!1!==this.focused&&(this.focused=!1,this.stateChanges.next())},s.prototype.setDescribedByIds=function(e){this.describedBy=e.join(" ")},s.prototype.onContainerClick=function(){this.elementRef.nativeElement.focus()},s.prototype.writeValue=function(e){var t=null==e?"":e;this.renderer.setProperty(this.elementRef.nativeElement,this.propValueAccessor,t)},s.prototype.registerOnChange=function(e){this.onChange=e},s.prototype.registerOnTouched=function(e){this.onTouched=e},s.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())},s.prototype.listenerDisabledState=function(e){e.preventDefault()},s.nextId=0,s.ctorParameters=function(){return[{type:t.ElementRef},{type:t.Renderer2},{type:o.NgControl,decorators:[{type:t.Optional},{type:t.Self}]},{type:o.NgForm,decorators:[{type:t.Optional}]},{type:o.FormGroupDirective,decorators:[{type:t.Optional}]},{type:r.ErrorStateMatcher}]},u([t.Input(),d("design:type",String),d("design:paramtypes",[String])],s.prototype,"value",null),u([t.HostBinding(),d("design:type",Object)],s.prototype,"id",void 0),u([t.Input(),d("design:type",Object),d("design:paramtypes",[Object])],s.prototype,"placeholder",null),u([t.Input(),d("design:type",Array)],s.prototype,"contentEmpty",void 0),u([t.Input(),d("design:type",Object),d("design:paramtypes",[Object])],s.prototype,"required",null),u([t.Input(),d("design:type",Object),d("design:paramtypes",[Object])],s.prototype,"disabled",null),u([t.HostBinding("attr.aria-invalid"),d("design:type",Boolean)],s.prototype,"errorState",void 0),u([t.Input(),d("design:type",r.ErrorStateMatcher)],s.prototype,"errorStateMatcher",void 0),u([t.HostBinding("attr.aria-describedby"),d("design:type",Object)],s.prototype,"describedBy",void 0),u([t.Input(),d("design:type",Object)],s.prototype,"propValueAccessor",void 0),u([t.HostListener("input"),d("design:type",Function),d("design:paramtypes",[]),d("design:returntype",void 0)],s.prototype,"callOnChange",null),u([t.HostListener("focus"),d("design:type",Function),d("design:paramtypes",[]),d("design:returntype",void 0)],s.prototype,"callOnFocused",null),u([t.HostListener("blur"),d("design:type",Function),d("design:paramtypes",[]),d("design:returntype",void 0)],s.prototype,"callOnTouched",null),s=p=u([t.Directive({selector:"[contenteditable]",providers:[{provide:n.MatFormFieldControl,useExisting:p}]}),c(2,t.Optional()),c(2,t.Self()),c(3,t.Optional()),c(4,t.Optional()),d("design:paramtypes",[t.ElementRef,t.Renderer2,o.NgControl,o.NgForm,o.FormGroupDirective,r.ErrorStateMatcher])],s)}(y),h=function(e){function i(t,n,o,r,i,s){var l=e.call(this,s,r,i,o)||this;return l.editor=t,l.viewRef=n,l.ngControl=o,l.stateChanges=new a.Subject,l.id="mat-input-"+p.nextId++,l.placeholder="",l.contentEmpty=["<br>","<p>&nbsp;</p>"],l.focused=!1,l.required=!1,l.controlType="mat-input",l.describedBy="",l}var p;return l(i,e),p=i,Object.defineProperty(i.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(i.prototype,"empty",{get:function(){return!this.value||this.contentEmpty.includes(this.value)},enumerable:!0,configurable:!0}),Object.defineProperty(i.prototype,"shouldLabelFloat",{get:function(){return this.focused||!this.empty},enumerable:!0,configurable:!0}),Object.defineProperty(i.prototype,"disabled",{get:function(){return this.editor.disabled},set:function(e){this.editor.setDisabledState(e),this.stateChanges.next()},enumerable:!0,configurable:!0}),i.prototype.ngOnInit=function(){var e=this;this.editor.blur.subscribe((function(){e.focused=!1,e.stateChanges.next()})),this.editor.focus.subscribe((function(){e.focused=!0,e.stateChanges.next()}))},i.prototype.ngDoCheck=function(){this.ngControl&&this.updateErrorState()},i.prototype.setDescribedByIds=function(e){this.describedBy=e.join(" ")},i.prototype.onContainerClick=function(){this.editor.editorInstance&&(this.editor.editorInstance.editing.view.focus(),this.stateChanges.next())},i.nextId=0,i.ctorParameters=function(){return[{type:s.CKEditorComponent,decorators:[{type:t.Host},{type:t.Self},{type:t.Optional}]},{type:t.ViewContainerRef},{type:o.NgControl,decorators:[{type:t.Optional},{type:t.Self}]},{type:o.NgForm,decorators:[{type:t.Optional}]},{type:o.FormGroupDirective,decorators:[{type:t.Optional}]},{type:r.ErrorStateMatcher}]},u([t.Input(),d("design:type",String),d("design:paramtypes",[String])],i.prototype,"value",null),u([t.HostBinding(),d("design:type",Object)],i.prototype,"id",void 0),u([t.Input(),d("design:type",Object)],i.prototype,"placeholder",void 0),u([t.Input(),d("design:type",Array)],i.prototype,"contentEmpty",void 0),u([t.Input(),d("design:type",Object)],i.prototype,"required",void 0),u([t.Input(),d("design:type",Boolean),d("design:paramtypes",[Boolean])],i.prototype,"disabled",null),u([t.HostBinding("attr.aria-invalid"),d("design:type",Boolean)],i.prototype,"errorState",void 0),u([t.Input(),d("design:type",r.ErrorStateMatcher)],i.prototype,"errorStateMatcher",void 0),u([t.HostBinding("attr.aria-describedby"),d("design:type",Object)],i.prototype,"describedBy",void 0),i=p=u([t.Directive({selector:"[matCkeditor]",providers:[{provide:n.MatFormFieldControl,useExisting:p}]}),c(0,t.Host()),c(0,t.Self()),c(0,t.Optional()),c(2,t.Optional()),c(2,t.Self()),c(3,t.Optional()),c(4,t.Optional()),d("design:paramtypes",[s.CKEditorComponent,t.ViewContainerRef,o.NgControl,o.NgForm,o.FormGroupDirective,r.ErrorStateMatcher])],i)}(y),m=function(e){function o(){return null!==e&&e.apply(this,arguments)||this}var r;return l(o,e),r=o,Object.defineProperty(o.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}),o.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)}}))},o.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)},u([t.Input(),d("design:type",Boolean),d("design:paramtypes",[Boolean])],o.prototype,"toolbar",null),o=r=u([t.Directive({selector:"[matCkeditorBalloon]",providers:[{provide:n.MatFormFieldControl,useExisting:r}]})],o)}(h),b=function(){function e(e,t){this.renderer=e,this.elementRef=t}return e.prototype.ngAfterContentInit=function(){this.updateSize()},e.prototype.updateSize=function(){var e=this,t=this.getElement("mat-form-field-infix");this.renderer.removeStyle(t,"min-height"),setTimeout((function(){var n=e.getElement("mat-form-field-wrapper"),o=e.elementRef.nativeElement.offsetHeight-n.offsetHeight-parseFloat(getComputedStyle(n).marginTop)-parseFloat(getComputedStyle(n).marginBottom)+parseFloat(getComputedStyle(t).height);e.renderer.setStyle(t,"min-height",o+"px")}))},e.prototype.getElement=function(e){return this.elementRef.nativeElement.getElementsByClassName(e).item(0)},e.ctorParameters=function(){return[{type:t.Renderer2},{type:t.ElementRef}]},e=u([t.Directive({selector:"[formFieldSizer]"}),d("design:paramtypes",[t.Renderer2,t.ElementRef])],e)}(),v=function(){function e(){}return e=u([t.NgModule({imports:[],declarations:[g,b],exports:[g,b]})],e)}(),O=function(){function e(){}return e=u([t.NgModule({imports:[],declarations:[h,m],exports:[h,m]})],e)}();function C(e){if(e){var t=document.createElement("span");return t.innerHTML=e,t.textContent.replace(/\s/g,"")}return""}var S=function(){function e(){}return e.required=function(e){return C(e.value)?null:{required:!0}},e.minLength=function(e){return function(t){var n=C(t.value);return n&&n.length<e?{minlength:{requiredLength:e,actualLength:n.length}}:null}},e.maxLength=function(e){return function(t){var n=C(t.value);return n.length>e?{maxlength:{requiredLength:e,actualLength:n.length}}:null}},e}();e.FormFieldSizerDirective=b,e.HtmlValidators=S,e.MatCkeditorBalloonDirective=m,e.MatCkeditorDirective=h,e.MatCkeditorModule=O,e.MatContenteditableDirective=g,e.MatContenteditableModule=v,e._MatInputMixinBase=y,Object.defineProperty(e,"__esModule",{value:!0})})); //# sourceMappingURL=mat-contenteditable.umd.min.js.map