@cleavelandprice/ngx-lib 3.1.30 → 3.1.32

package/fesm2020/cleavelandprice-ngx-lib-quill-editor.mjs

@@ -0,0 +1,418 @@
+import * as i0 from '@angular/core';
+import { EventEmitter, Component, Optional, Inject, ViewChild, Input, Output, NgModule, SkipSelf } from '@angular/core';
+import * as i1 from '@angular/material/dialog';
+import { MAT_DIALOG_DATA, MatDialogModule } from '@angular/material/dialog';
+import * as i7 from 'ngx-quill';
+import { QuillEditorComponent, QuillModule } from 'ngx-quill';
+import 'quill-mention';
+import Quill from 'quill';
+import ImageResize from 'quill-image-resize-module';
+import { ImageDrop } from 'quill-image-drop-module';
+import * as i2 from '@cleavelandprice/ngx-lib/active-directory';
+import * as i3 from '@angular/common';
+import { CommonModule } from '@angular/common';
+import * as i4 from '@angular/forms';
+import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+import * as i5 from '@angular/material/icon';
+import { MatIconModule } from '@angular/material/icon';
+import * as i6 from '@angular/material/tooltip';
+import { MatTooltipModule } from '@angular/material/tooltip';
+import { MatButtonModule } from '@angular/material/button';
+
+class Buttons {
+    constructor() {
+        //#region Font Style
+        this.bold = true;
+        this.italic = true;
+        this.strike = true;
+        this.underline = true;
+        //#endregion
+        //#region Media
+        this.link = true;
+        this.image = true;
+        this.video = true;
+        //#endregion
+        //#region Block Style
+        this.blockquote = true;
+        this.codeblock = true;
+        //#endregion
+        //#region Heading Style
+        this.h1 = true;
+        this.h2 = true;
+        //#endregion
+        //#region Color
+        this.color = true;
+        //#endregion
+        //#region List Style
+        this.bulleted = true;
+        this.ordered = true;
+        //#endregion
+        //#region Script Style
+        this.subScript = true;
+        this.superScript = true;
+        //#endregion
+        //#region Indent Style
+        this.increaseIndent = true;
+        this.decreaseIndent = true;
+        //#endregion
+        //#region DropDowns
+        this.align = true;
+        this.font = true;
+        this.fontSize = true;
+        this.headingStyle = true;
+        //#endregion
+        //#region Single Buttons
+        this.clean = true;
+        this.formula = true;
+        this.rtl = true;
+        this.editorSize = true;
+        //#endregion
+    }
+}
+
+class Icons {
+    constructor() {
+        this.maximize = 'open_in_full';
+        this.minimize = 'close_fullscreen';
+        this.popout = 'open_in_full';
+        this.popin = 'done';
+    }
+}
+
+class Tooltips {
+    constructor() {
+        //#region Font Style
+        this.bold = 'Bole';
+        this.italic = 'Italic';
+        this.strike = 'Strikethrough';
+        this.underline = 'Underline';
+        //#endregion
+        //#region Media
+        this.link = 'Link';
+        this.image = 'Insert Image';
+        this.video = 'Insert Video';
+        //#endregion
+        //#region Block Style
+        this.blockquote = 'Blockquote';
+        this.codeblock = 'Code Block';
+        //#endregion
+        //#region Heading Style
+        this.h1 = 'Heading 1';
+        this.h2 = 'Heading 2';
+        //#endregion
+        //#region Color
+        this.color = 'Font / Background Color';
+        //#endregion
+        //#region List Style
+        this.bulleted = 'Bulleted List';
+        this.ordered = 'Ordered List';
+        //#endregion
+        //#region Script Style
+        this.subScript = 'Subscript';
+        this.superScript = 'Superscript';
+        //#endregion
+        //#region Indent Style
+        this.increaseIndent = 'Increase Indent';
+        this.decreaseIndent = 'Decrease Indent';
+        //#endregion
+        //#region DropDowns
+        this.align = 'Align';
+        this.font = 'Font';
+        this.fontSize = 'Font Size';
+        this.headingStyle = 'Heading';
+        //#endregion
+        //#region Single Buttons
+        this.clean = 'Clean';
+        this.formula = 'Formula';
+        this.rtl = 'Right-To-Left';
+        this.maximize = 'Maximize';
+        this.minimize = 'Minimize';
+        this.popout = 'Popout';
+        this.popin = 'Done';
+        //#endregion
+    }
+}
+
+class Config {
+    constructor() {
+        this.buttons = new Buttons();
+        this.tooltips = new Tooltips();
+        this.icons = new Icons();
+        //#region These can be overriden via @Input()
+        this.format = 'html';
+        this.height = '50vh';
+        this.width = '100vw';
+        this.maxHeight = '85vh';
+        this.maxWidth = '100vw';
+        this.enableTooltips = true;
+        this.fullscreen = false;
+        this.fullscreenMode = 'popout';
+        this.readonly = false;
+        //#endregion
+        //#region Groups
+        this.showBlockStyle = () => this.buttons.blockquote || this.buttons.codeblock;
+        this.showFontStyle = () => this.buttons.bold || this.buttons.italic || this.buttons.strike || this.buttons.underline;
+        this.showQuickHeadingStyle = () => this.buttons.h1 || this.buttons.h2;
+        this.showIndentStyle = () => this.buttons.decreaseIndent || this.buttons.increaseIndent;
+        this.showListStyle = () => this.buttons.bulleted || this.buttons.ordered;
+        this.showMedia = () => this.buttons.link || this.buttons.image || this.buttons.video;
+        this.showScriptStyle = () => this.buttons.subScript || this.buttons.superScript;
+        //#endregion
+    }
+}
+
+Quill.register('modules/imageDrop', ImageDrop);
+Quill.register('modules/imageResize', ImageResize);
+class EditorComponent {
+    //#endregion
+    constructor(data, dialogRef, activeDirectoryService, dialog) {
+        this.dialogRef = dialogRef;
+        this.activeDirectoryService = activeDirectoryService;
+        this.dialog = dialog;
+        this.config = new Config();
+        //#region These can be passed in as @Input(), or use values from config
+        this.format = this.config.format;
+        this.height = this.config.height;
+        this.width = this.config.width;
+        this.maxHeight = this.config.maxHeight;
+        this.maxWidth = this.config.maxWidth;
+        this.enableTooltips = this.config.enableTooltips;
+        this.fullscreen = this.config.fullscreen;
+        this.fullscreenMode = this.config.fullscreenMode;
+        this.readonly = this.config.readonly;
+        //#endregion
+        this.fullscreenChanged = new EventEmitter();
+        //#region Passthrough events
+        this.onBlur = new EventEmitter();
+        this.onContentChanged = new EventEmitter();
+        this.onEditorChanged = new EventEmitter();
+        this.onEditorCreated = new EventEmitter();
+        this.onFocus = new EventEmitter();
+        this.onSelectionChanged = new EventEmitter();
+        if (data) {
+            this.formGroup = data.formGroup;
+            this.controlName = data.controlName;
+            this.ngModelValue = data.value;
+            this.config = data.config;
+            this.placeholder = data.placeholder;
+            this.format = data.format;
+            this.height = data.height;
+            this.width = data.width;
+            this.maxHeight = data.maxHeight;
+            this.maxWidth = data.maxWidth;
+            this.enableTooltips = data.enableTooltips;
+            this.fullscreen = data.fullscreen;
+            this.fullscreenMode = data.fullscreenMode;
+            this.readonly = data.readonly;
+            this.users = data.users;
+        }
+    }
+    ngOnInit() {
+        if (!this.users) {
+            this.activeDirectoryService.getUsers().subscribe(users => this.users = users);
+        }
+    }
+    toggleFullscreen() {
+        this.fullscreen = !this.fullscreen;
+        this.fullscreenChanged.emit(this.fullscreen);
+        if (this.fullscreenMode === 'popout') {
+            if (this.dialogRef) {
+                this.dialogRef.close(this.formGroup ?
+                    this.formGroup.get(this.controlName)?.value :
+                    this.ngModelValue);
+            }
+            else {
+                const data = {
+                    formGroup: this.formGroup,
+                    controlName: this.controlName,
+                    value: this.ngModelValue,
+                    config: this.config,
+                    placeholder: this.placeholder,
+                    format: this.format,
+                    height: this.maxHeight,
+                    width: '100%',
+                    maxHeight: this.maxHeight,
+                    maxWidth: '100%',
+                    enableTooltips: this.enableTooltips,
+                    fullscreen: this.fullscreen,
+                    fullscreenMode: this.fullscreenMode,
+                    readonly: this.readonly,
+                    users: this.users
+                };
+                this.dialog.open(EditorComponent, {
+                    disableClose: true,
+                    width: this.maxWidth,
+                    height: '90vh',
+                    data
+                })
+                    .afterClosed()
+                    .subscribe(value => {
+                    this.fullscreen = false;
+                    if (this.formGroup) {
+                        this.formGroup.get(this.controlName)?.setValue(value);
+                    }
+                    else {
+                        this.ngModelValue = value;
+                    }
+                });
+            }
+        }
+    }
+    tooltip(val) {
+        return this.enableTooltips ? val : '';
+    }
+    get modules() {
+        return this.users ?
+            {
+                imageResize: {},
+                imageDrop: true,
+                syntax: true,
+                mention: {
+                    allowedChars: /^[A-Za-z\sÅÄÖåäö]*$/,
+                    onSelect: (item, insertItem) => {
+                        const editor = this.editor.quillEditor;
+                        insertItem(item);
+                        // necessary because quill-mention triggers changes as 'api' instead of 'user'
+                        editor.insertText(editor.getLength() - 1, '', 'user');
+                    },
+                    source: (searchTerm, renderList) => {
+                        if (searchTerm.length === 0) {
+                            renderList(this.users?.map(u => ({ value: `${u.displayName} (${u.sAMAccountName.toLowerCase()})` })), searchTerm);
+                        }
+                        else {
+                            const matches = [];
+                            this.users.forEach((entry) => {
+                                if (entry.displayName.toLowerCase().indexOf(searchTerm.toLowerCase()) !== -1 ||
+                                    entry.sAMAccountName.toLowerCase().indexOf(searchTerm.toLowerCase()) !== -1) {
+                                    matches.push({ value: `${entry.displayName} (${entry.sAMAccountName.toLowerCase()})` });
+                                }
+                            });
+                            renderList(matches, searchTerm);
+                        }
+                    }
+                }
+            } :
+            undefined;
+    }
+}
+EditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.1", ngImport: i0, type: EditorComponent, deps: [{ token: MAT_DIALOG_DATA, optional: true }, { token: i1.MatDialogRef, optional: true }, { token: i2.ActiveDirectoryService }, { token: i1.MatDialog }], target: i0.ɵɵFactoryTarget.Component });
+EditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.1", type: EditorComponent, selector: "cpquill-editor", inputs: { formGroup: "formGroup", controlName: "controlName", ngModelValue: "ngModelValue", config: "config", placeholder: "placeholder", users: "users", format: "format", height: "height", width: "width", maxHeight: "maxHeight", maxWidth: "maxWidth", enableTooltips: "enableTooltips", fullscreen: "fullscreen", fullscreenMode: "fullscreenMode", readonly: "readonly" }, outputs: { fullscreenChanged: "fullscreenChanged", onBlur: "onBlur", onContentChanged: "onContentChanged", onEditorChanged: "onEditorChanged", onEditorCreated: "onEditorCreated", onFocus: "onFocus", onSelectionChanged: "onSelectionChanged" }, viewQueries: [{ propertyName: "editor", first: true, predicate: QuillEditorComponent, descendants: true }], ngImport: i0, template: "<ng-container *ngIf=\"users\">\n    <!-- Reactive forms -->\n    <form *ngIf=\"formGroup\" [formGroup]=\"formGroup\">\n        <quill-editor\n            [formControlName]=\"controlName\"\n            [placeholder]=\"placeholder\"\n            [format]=\"format\"\n            [style.height]=\"fullscreen ? maxHeight : height\"\n            [style.width]=\"fullscreen ? maxWidth : width\"\n            [readOnly]=\"readonly\"\n            [class.readonly]=\"readonly\"\n            [modules]=\"modules\"\n    \n            (onBlur)=\"onBlur.emit($event)\"\n            (onContentChanged)=\"onContentChanged.emit($event)\"\n            (onEditorChanged)=\"onEditorChanged.emit($event)\"\n            (onEditorCreated)=\"onEditorCreated.emit()\"\n            (onFocus)=\"onFocus.emit($event)\"\n            (onSelectionChanged)=\"onSelectionChanged.emit($event)\">\n    \n            <div quill-editor-toolbar>\n                <ng-container [ngTemplateOutlet]=\"toolbar\"></ng-container>\n                <ng-container [ngTemplateOutlet]=\"editorSize\"></ng-container>\n            </div>\n        </quill-editor>\n    </form>\n    \n    <!-- NgModel forms -->\n    <form *ngIf=\"!formGroup\">\n        <quill-editor name=\"editor\"\n            [(ngModel)]=\"ngModelValue\"\n            [placeholder]=\"placeholder\"\n            [format]=\"format\"\n            [style.height]=\"fullscreen ? maxHeight : height\"\n            [style.width]=\"fullscreen ? maxWidth : width\"\n            [readOnly]=\"readonly\"\n            [class.readonly]=\"readonly\"\n            [modules]=\"modules\"\n    \n            (onBlur)=\"onBlur.emit($event)\"\n            (onContentChanged)=\"onContentChanged.emit($event)\"\n            (onEditorChanged)=\"onEditorChanged.emit($event)\"\n            (onEditorCreated)=\"onEditorCreated.emit()\"\n            (onFocus)=\"onFocus.emit($event)\"\n            (onSelectionChanged)=\"onSelectionChanged.emit($event)\">\n    \n            <div quill-editor-toolbar>\n                <ng-container [ngTemplateOutlet]=\"toolbar\"></ng-container>\n                <ng-container [ngTemplateOutlet]=\"editorSize\"></ng-container>\n            </div>\n        </quill-editor>\n    </form>\n</ng-container>\n\n<ng-template #toolbar>\n    <div>\n        <ng-container [ngTemplateOutlet]=\"fontStyle\"></ng-container>\n        <ng-container [ngTemplateOutlet]=\"blockStyle\"></ng-container>\n        <ng-container [ngTemplateOutlet]=\"headingStyle\"></ng-container>\n        <ng-container [ngTemplateOutlet]=\"listStyle\"></ng-container>\n        <ng-container [ngTemplateOutlet]=\"scriptStyle\"></ng-container>\n        <ng-container [ngTemplateOutlet]=\"indentStyle\"></ng-container>\n        <ng-container [ngTemplateOutlet]=\"rtl\"></ng-container>\n        <ng-container [ngTemplateOutlet]=\"fontSize\"></ng-container>\n        <ng-container [ngTemplateOutlet]=\"heading\"></ng-container>\n        <ng-container [ngTemplateOutlet]=\"color\"></ng-container>\n        <ng-container [ngTemplateOutlet]=\"font\"></ng-container>\n        <ng-container [ngTemplateOutlet]=\"align\"></ng-container>\n        <ng-container [ngTemplateOutlet]=\"clean\"></ng-container>\n        <nt-container [ngTemplateOutlet]=\"formula\"></nt-container>\n        <ng-container [ngTemplateOutlet]=\"media\"></ng-container>\n    </div>\n</ng-template>\n\n<ng-template #fontStyle>\n    <span class=\"ql-formats\" *ngIf=\"config.showFontStyle\">\n        <button class=\"ql-bold\"      *ngIf=\"config.buttons.bold\"      [matTooltip]=\"tooltip(config.tooltips.bold)\"></button>\n        <button class=\"ql-italic\"    *ngIf=\"config.buttons.italic\"    [matTooltip]=\"tooltip(config.tooltips.italic)\"></button>\n        <button class=\"ql-underline\" *ngIf=\"config.buttons.underline\" [matTooltip]=\"tooltip(config.tooltips.underline)\"></button>\n        <button class=\"ql-strike\"    *ngIf=\"config.buttons.strike\"    [matTooltip]=\"tooltip(config.tooltips.strike)\"></button>\n    </span>\n</ng-template>\n\n<ng-template #blockStyle>\n    <span class=\"ql-formats\" *ngIf=\"config.showBlockStyle\">\n        <button class=\"ql-blockquote\" *ngIf=\"config.buttons.blockquote\" [matTooltip]=\"tooltip(config.tooltips.blockquote)\"></button>\n        <button class=\"ql-code-block\" *ngIf=\"config.buttons.codeblock\"  [matTooltip]=\"tooltip(config.tooltips.codeblock)\"></button>\n    </span>\n</ng-template>\n\n<ng-template #headingStyle>\n    <span class=\"ql-formats\" *ngIf=\"config.showQuickHeadingStyle\">\n        <button class=\"ql-header\" value=\"1\" *ngIf=\"config.buttons.h1\" [matTooltip]=\"tooltip(config.tooltips.h1)\"></button>\n        <button class=\"ql-header\" value=\"2\" *ngIf=\"config.buttons.h2\" [matTooltip]=\"tooltip(config.tooltips.h2)\"></button>\n    </span>\n</ng-template>\n\n<ng-template #listStyle>\n    <span class=\"ql-formats\" *ngIf=\"config.showListStyle\">\n        <button class=\"ql-list\" value=\"ordered\" *ngIf=\"config.buttons.ordered\"  [matTooltip]=\"tooltip(config.tooltips.ordered)\"></button>\n        <button class=\"ql-list\" value=\"bullet\"  *ngIf=\"config.buttons.bulleted\" [matTooltip]=\"tooltip(config.tooltips.bulleted)\"></button>\n    </span>\n</ng-template>\n\n<ng-template #scriptStyle>\n    <span class=\"ql-formats\" *ngIf=\"config.showScriptStyle\">\n        <button class=\"ql-script\" value=\"sub\"   *ngIf=\"config.buttons.subScript\" [matTooltip]=\"tooltip(config.tooltips.subScript)\"></button>\n        <button class=\"ql-script\" value=\"super\" *ngIf=\"config.buttons.superScript\" [matTooltip]=\"tooltip(config.tooltips.superScript)\"></button>\n    </span>\n</ng-template>\n    \n<ng-template #indentStyle>\n    <span class=\"ql-formats\" *ngIf=\"config.showIndentStyle\">\n        <button class=\"ql-indent\" value=\"-1\" *ngIf=\"config.buttons.decreaseIndent\" [matTooltip]=\"tooltip(config.tooltips.decreaseIndent)\"></button>\n        <button class=\"ql-indent\" value=\"+1\" *ngIf=\"config.buttons.increaseIndent\" [matTooltip]=\"tooltip(config.tooltips.increaseIndent)\"></button>\n    </span>\n</ng-template>\n\n<ng-template #rtl>\n    <span class=\"ql-formats\" *ngIf=\"config.buttons.rtl\">\n        <button class=\"ql-direction\" value=\"rtl\" [matTooltip]=\"tooltip(config.tooltips.rtl)\"></button>\n    </span>\n</ng-template>\n\n<ng-template #fontSize>\n    <span class=\"ql-formats\" *ngIf=\"config.buttons.fontSize\" [matTooltip]=\"tooltip(config.tooltips.fontSize)\">\n        <select class=\"ql-size\">\n            <option value=\"small\"></option>\n            <option selected></option>\n            <option value=\"large\"></option>\n            <option value=\"huge\"></option>\n        </select>\n    </span>\n</ng-template>\n\n<ng-template #heading>\n    <span class=\"ql-formats\" *ngIf=\"config.buttons.headingStyle\" [matTooltip]=\"tooltip(config.tooltips.headingStyle)\">\n        <select class=\"ql-header\">\n            <option value=\"1\"></option>\n            <option value=\"2\"></option>\n            <option value=\"3\"></option>\n            <option value=\"4\"></option>\n            <option value=\"5\"></option>\n            <option value=\"6\"></option>\n            <option selected=\"selected\"></option>\n        </select>\n    </span>\n</ng-template>\n\n<ng-template #color>\n    <span class=\"ql-formats\" *ngIf=\"config.buttons.color\" [matTooltip]=\"tooltip(config.tooltips.color)\">\n        <select class=\"ql-color\"></select>\n        <select class=\"ql-background\"></select>\n    </span>\n</ng-template>\n\n<ng-template #font>\n    <span class=\"ql-formats\" *ngIf=\"config.buttons.font\" [matTooltip]=\"tooltip(config.tooltips.font)\">\n        <select class=\"ql-font\">\n            <option selected></option>\n            <option value=\"serif\"></option>\n            <option value=\"monospace\"></option>\n        </select>\n    </span>\n</ng-template>\n\n<ng-template #align>\n    <span class=\"ql-formats\" *ngIf=\"config.buttons.align\" [matTooltip]=\"tooltip(config.tooltips.align)\">\n        <select class=\"ql-align\">\n            <option selected></option>\n            <option value=\"center\"></option>\n            <option value=\"right\"></option>\n            <option value=\"justify\"></option>\n        </select>\n    </span>\n</ng-template>\n\n<ng-template #clean>\n    <span class=\"ql-formats\" *ngIf=\"config.buttons.clean\" [matTooltip]=\"tooltip(config.tooltips.clean)\">\n        <button class=\"ql-clean\"></button>\n    </span>\n</ng-template>\n\n<ng-template #media>\n    <span class=\"ql-formats\" *ngIf=\"config.showMedia\">\n        <button class=\"ql-link\"  *ngIf=\"config.buttons.link\" [matTooltip]=\"tooltip(config.tooltips.link)\"></button>\n        <button class=\"ql-image\" *ngIf=\"config.buttons.image\" [matTooltip]=\"tooltip(config.tooltips.image)\"></button>\n        <button class=\"ql-video\" *ngIf=\"config.buttons.video\" [matTooltip]=\"tooltip(config.tooltips.video)\"></button>\n    </span>\n</ng-template>\n\n<ng-template #editorSize>\n    <span class=\"ql-formats\" *ngIf=\"config.buttons.editorSize\">\n        <button id=\"fullscreen\"\n            [matTooltip]=\"tooltip(fullscreen ?\n                (fullscreenMode === 'expand' ? config.tooltips.minimize : config.tooltips.popin) :\n                (fullscreenMode === 'expand' ? config.tooltips.maximize : config.tooltips.popout))\">\n\n            <mat-icon (click)=\"toggleFullscreen()\">\n                {{ fullscreen ?\n                    (fullscreenMode === 'expand' ? config.icons.minimize : config.icons.popin) :\n                    (fullscreenMode === 'expand' ? config.icons.maximize : config.icons.popout)\n                }}\n            </mat-icon>\n        </button>\n    </span>\n</ng-template>\n\n<ng-template #formula>\n    <span class=\"ql-formats\" *ngIf=\"config.buttons.formula\" [matTooltip]=\"tooltip(config.tooltips.formula)\">\n        <button class=\"ql-formula\"></button>\n    </span>\n</ng-template>", styles: [".ql-toolbar{display:grid;grid-template-columns:1fr auto}mat-icon{color:#ff4500}quill-editor.readonly .ql-toolbar{opacity:.5}::ng-deep quill-editor.readonly .ql-container{background-color:#f5f5f5!important}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i4.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i4.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i6.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: i7.QuillEditorComponent, selector: "quill-editor" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.1", ngImport: i0, type: EditorComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'cpquill-editor', template: "<ng-container *ngIf=\"users\">\n    <!-- Reactive forms -->\n    <form *ngIf=\"formGroup\" [formGroup]=\"formGroup\">\n        <quill-editor\n            [formControlName]=\"controlName\"\n            [placeholder]=\"placeholder\"\n            [format]=\"format\"\n            [style.height]=\"fullscreen ? maxHeight : height\"\n            [style.width]=\"fullscreen ? maxWidth : width\"\n            [readOnly]=\"readonly\"\n            [class.readonly]=\"readonly\"\n            [modules]=\"modules\"\n    \n            (onBlur)=\"onBlur.emit($event)\"\n            (onContentChanged)=\"onContentChanged.emit($event)\"\n            (onEditorChanged)=\"onEditorChanged.emit($event)\"\n            (onEditorCreated)=\"onEditorCreated.emit()\"\n            (onFocus)=\"onFocus.emit($event)\"\n            (onSelectionChanged)=\"onSelectionChanged.emit($event)\">\n    \n            <div quill-editor-toolbar>\n                <ng-container [ngTemplateOutlet]=\"toolbar\"></ng-container>\n                <ng-container [ngTemplateOutlet]=\"editorSize\"></ng-container>\n            </div>\n        </quill-editor>\n    </form>\n    \n    <!-- NgModel forms -->\n    <form *ngIf=\"!formGroup\">\n        <quill-editor name=\"editor\"\n            [(ngModel)]=\"ngModelValue\"\n            [placeholder]=\"placeholder\"\n            [format]=\"format\"\n            [style.height]=\"fullscreen ? maxHeight : height\"\n            [style.width]=\"fullscreen ? maxWidth : width\"\n            [readOnly]=\"readonly\"\n            [class.readonly]=\"readonly\"\n            [modules]=\"modules\"\n    \n            (onBlur)=\"onBlur.emit($event)\"\n            (onContentChanged)=\"onContentChanged.emit($event)\"\n            (onEditorChanged)=\"onEditorChanged.emit($event)\"\n            (onEditorCreated)=\"onEditorCreated.emit()\"\n            (onFocus)=\"onFocus.emit($event)\"\n            (onSelectionChanged)=\"onSelectionChanged.emit($event)\">\n    \n            <div quill-editor-toolbar>\n                <ng-container [ngTemplateOutlet]=\"toolbar\"></ng-container>\n                <ng-container [ngTemplateOutlet]=\"editorSize\"></ng-container>\n            </div>\n        </quill-editor>\n    </form>\n</ng-container>\n\n<ng-template #toolbar>\n    <div>\n        <ng-container [ngTemplateOutlet]=\"fontStyle\"></ng-container>\n        <ng-container [ngTemplateOutlet]=\"blockStyle\"></ng-container>\n        <ng-container [ngTemplateOutlet]=\"headingStyle\"></ng-container>\n        <ng-container [ngTemplateOutlet]=\"listStyle\"></ng-container>\n        <ng-container [ngTemplateOutlet]=\"scriptStyle\"></ng-container>\n        <ng-container [ngTemplateOutlet]=\"indentStyle\"></ng-container>\n        <ng-container [ngTemplateOutlet]=\"rtl\"></ng-container>\n        <ng-container [ngTemplateOutlet]=\"fontSize\"></ng-container>\n        <ng-container [ngTemplateOutlet]=\"heading\"></ng-container>\n        <ng-container [ngTemplateOutlet]=\"color\"></ng-container>\n        <ng-container [ngTemplateOutlet]=\"font\"></ng-container>\n        <ng-container [ngTemplateOutlet]=\"align\"></ng-container>\n        <ng-container [ngTemplateOutlet]=\"clean\"></ng-container>\n        <nt-container [ngTemplateOutlet]=\"formula\"></nt-container>\n        <ng-container [ngTemplateOutlet]=\"media\"></ng-container>\n    </div>\n</ng-template>\n\n<ng-template #fontStyle>\n    <span class=\"ql-formats\" *ngIf=\"config.showFontStyle\">\n        <button class=\"ql-bold\"      *ngIf=\"config.buttons.bold\"      [matTooltip]=\"tooltip(config.tooltips.bold)\"></button>\n        <button class=\"ql-italic\"    *ngIf=\"config.buttons.italic\"    [matTooltip]=\"tooltip(config.tooltips.italic)\"></button>\n        <button class=\"ql-underline\" *ngIf=\"config.buttons.underline\" [matTooltip]=\"tooltip(config.tooltips.underline)\"></button>\n        <button class=\"ql-strike\"    *ngIf=\"config.buttons.strike\"    [matTooltip]=\"tooltip(config.tooltips.strike)\"></button>\n    </span>\n</ng-template>\n\n<ng-template #blockStyle>\n    <span class=\"ql-formats\" *ngIf=\"config.showBlockStyle\">\n        <button class=\"ql-blockquote\" *ngIf=\"config.buttons.blockquote\" [matTooltip]=\"tooltip(config.tooltips.blockquote)\"></button>\n        <button class=\"ql-code-block\" *ngIf=\"config.buttons.codeblock\"  [matTooltip]=\"tooltip(config.tooltips.codeblock)\"></button>\n    </span>\n</ng-template>\n\n<ng-template #headingStyle>\n    <span class=\"ql-formats\" *ngIf=\"config.showQuickHeadingStyle\">\n        <button class=\"ql-header\" value=\"1\" *ngIf=\"config.buttons.h1\" [matTooltip]=\"tooltip(config.tooltips.h1)\"></button>\n        <button class=\"ql-header\" value=\"2\" *ngIf=\"config.buttons.h2\" [matTooltip]=\"tooltip(config.tooltips.h2)\"></button>\n    </span>\n</ng-template>\n\n<ng-template #listStyle>\n    <span class=\"ql-formats\" *ngIf=\"config.showListStyle\">\n        <button class=\"ql-list\" value=\"ordered\" *ngIf=\"config.buttons.ordered\"  [matTooltip]=\"tooltip(config.tooltips.ordered)\"></button>\n        <button class=\"ql-list\" value=\"bullet\"  *ngIf=\"config.buttons.bulleted\" [matTooltip]=\"tooltip(config.tooltips.bulleted)\"></button>\n    </span>\n</ng-template>\n\n<ng-template #scriptStyle>\n    <span class=\"ql-formats\" *ngIf=\"config.showScriptStyle\">\n        <button class=\"ql-script\" value=\"sub\"   *ngIf=\"config.buttons.subScript\" [matTooltip]=\"tooltip(config.tooltips.subScript)\"></button>\n        <button class=\"ql-script\" value=\"super\" *ngIf=\"config.buttons.superScript\" [matTooltip]=\"tooltip(config.tooltips.superScript)\"></button>\n    </span>\n</ng-template>\n    \n<ng-template #indentStyle>\n    <span class=\"ql-formats\" *ngIf=\"config.showIndentStyle\">\n        <button class=\"ql-indent\" value=\"-1\" *ngIf=\"config.buttons.decreaseIndent\" [matTooltip]=\"tooltip(config.tooltips.decreaseIndent)\"></button>\n        <button class=\"ql-indent\" value=\"+1\" *ngIf=\"config.buttons.increaseIndent\" [matTooltip]=\"tooltip(config.tooltips.increaseIndent)\"></button>\n    </span>\n</ng-template>\n\n<ng-template #rtl>\n    <span class=\"ql-formats\" *ngIf=\"config.buttons.rtl\">\n        <button class=\"ql-direction\" value=\"rtl\" [matTooltip]=\"tooltip(config.tooltips.rtl)\"></button>\n    </span>\n</ng-template>\n\n<ng-template #fontSize>\n    <span class=\"ql-formats\" *ngIf=\"config.buttons.fontSize\" [matTooltip]=\"tooltip(config.tooltips.fontSize)\">\n        <select class=\"ql-size\">\n            <option value=\"small\"></option>\n            <option selected></option>\n            <option value=\"large\"></option>\n            <option value=\"huge\"></option>\n        </select>\n    </span>\n</ng-template>\n\n<ng-template #heading>\n    <span class=\"ql-formats\" *ngIf=\"config.buttons.headingStyle\" [matTooltip]=\"tooltip(config.tooltips.headingStyle)\">\n        <select class=\"ql-header\">\n            <option value=\"1\"></option>\n            <option value=\"2\"></option>\n            <option value=\"3\"></option>\n            <option value=\"4\"></option>\n            <option value=\"5\"></option>\n            <option value=\"6\"></option>\n            <option selected=\"selected\"></option>\n        </select>\n    </span>\n</ng-template>\n\n<ng-template #color>\n    <span class=\"ql-formats\" *ngIf=\"config.buttons.color\" [matTooltip]=\"tooltip(config.tooltips.color)\">\n        <select class=\"ql-color\"></select>\n        <select class=\"ql-background\"></select>\n    </span>\n</ng-template>\n\n<ng-template #font>\n    <span class=\"ql-formats\" *ngIf=\"config.buttons.font\" [matTooltip]=\"tooltip(config.tooltips.font)\">\n        <select class=\"ql-font\">\n            <option selected></option>\n            <option value=\"serif\"></option>\n            <option value=\"monospace\"></option>\n        </select>\n    </span>\n</ng-template>\n\n<ng-template #align>\n    <span class=\"ql-formats\" *ngIf=\"config.buttons.align\" [matTooltip]=\"tooltip(config.tooltips.align)\">\n        <select class=\"ql-align\">\n            <option selected></option>\n            <option value=\"center\"></option>\n            <option value=\"right\"></option>\n            <option value=\"justify\"></option>\n        </select>\n    </span>\n</ng-template>\n\n<ng-template #clean>\n    <span class=\"ql-formats\" *ngIf=\"config.buttons.clean\" [matTooltip]=\"tooltip(config.tooltips.clean)\">\n        <button class=\"ql-clean\"></button>\n    </span>\n</ng-template>\n\n<ng-template #media>\n    <span class=\"ql-formats\" *ngIf=\"config.showMedia\">\n        <button class=\"ql-link\"  *ngIf=\"config.buttons.link\" [matTooltip]=\"tooltip(config.tooltips.link)\"></button>\n        <button class=\"ql-image\" *ngIf=\"config.buttons.image\" [matTooltip]=\"tooltip(config.tooltips.image)\"></button>\n        <button class=\"ql-video\" *ngIf=\"config.buttons.video\" [matTooltip]=\"tooltip(config.tooltips.video)\"></button>\n    </span>\n</ng-template>\n\n<ng-template #editorSize>\n    <span class=\"ql-formats\" *ngIf=\"config.buttons.editorSize\">\n        <button id=\"fullscreen\"\n            [matTooltip]=\"tooltip(fullscreen ?\n                (fullscreenMode === 'expand' ? config.tooltips.minimize : config.tooltips.popin) :\n                (fullscreenMode === 'expand' ? config.tooltips.maximize : config.tooltips.popout))\">\n\n            <mat-icon (click)=\"toggleFullscreen()\">\n                {{ fullscreen ?\n                    (fullscreenMode === 'expand' ? config.icons.minimize : config.icons.popin) :\n                    (fullscreenMode === 'expand' ? config.icons.maximize : config.icons.popout)\n                }}\n            </mat-icon>\n        </button>\n    </span>\n</ng-template>\n\n<ng-template #formula>\n    <span class=\"ql-formats\" *ngIf=\"config.buttons.formula\" [matTooltip]=\"tooltip(config.tooltips.formula)\">\n        <button class=\"ql-formula\"></button>\n    </span>\n</ng-template>", styles: [".ql-toolbar{display:grid;grid-template-columns:1fr auto}mat-icon{color:#ff4500}quill-editor.readonly .ql-toolbar{opacity:.5}::ng-deep quill-editor.readonly .ql-container{background-color:#f5f5f5!important}\n"] }]
+        }], ctorParameters: function () { return [{ type: undefined, decorators: [{
+                    type: Optional
+                }, {
+                    type: Inject,
+                    args: [MAT_DIALOG_DATA]
+                }] }, { type: i1.MatDialogRef, decorators: [{
+                    type: Optional
+                }] }, { type: i2.ActiveDirectoryService }, { type: i1.MatDialog }]; }, propDecorators: { editor: [{
+                type: ViewChild,
+                args: [QuillEditorComponent, { static: false }]
+            }], formGroup: [{
+                type: Input
+            }], controlName: [{
+                type: Input
+            }], ngModelValue: [{
+                type: Input
+            }], config: [{
+                type: Input
+            }], placeholder: [{
+                type: Input
+            }], users: [{
+                type: Input
+            }], format: [{
+                type: Input
+            }], height: [{
+                type: Input
+            }], width: [{
+                type: Input
+            }], maxHeight: [{
+                type: Input
+            }], maxWidth: [{
+                type: Input
+            }], enableTooltips: [{
+                type: Input
+            }], fullscreen: [{
+                type: Input
+            }], fullscreenMode: [{
+                type: Input
+            }], readonly: [{
+                type: Input
+            }], fullscreenChanged: [{
+                type: Output
+            }], onBlur: [{
+                type: Output
+            }], onContentChanged: [{
+                type: Output
+            }], onEditorChanged: [{
+                type: Output
+            }], onEditorCreated: [{
+                type: Output
+            }], onFocus: [{
+                type: Output
+            }], onSelectionChanged: [{
+                type: Output
+            }] } });
+
+class QuillEditorModule {
+    constructor(parentModule) {
+        if (parentModule) {
+            throw new Error('QuillEditorModule is already loaded. Import it in the AppModule only');
+        }
+    }
+    static forRoot() {
+        return {
+            ngModule: QuillEditorModule
+        };
+    }
+}
+QuillEditorModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.1", ngImport: i0, type: QuillEditorModule, deps: [{ token: QuillEditorModule, optional: true, skipSelf: true }], target: i0.ɵɵFactoryTarget.NgModule });
+QuillEditorModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.1", ngImport: i0, type: QuillEditorModule, declarations: [EditorComponent], imports: [CommonModule,
+        FormsModule,
+        ReactiveFormsModule,
+        MatButtonModule,
+        MatDialogModule,
+        MatIconModule,
+        MatTooltipModule, i7.QuillModule], exports: [EditorComponent] });
+QuillEditorModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.1", ngImport: i0, type: QuillEditorModule, imports: [CommonModule,
+        FormsModule,
+        ReactiveFormsModule,
+        MatButtonModule,
+        MatDialogModule,
+        MatIconModule,
+        MatTooltipModule,
+        QuillModule.forRoot()] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.1", ngImport: i0, type: QuillEditorModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [
+                        EditorComponent
+                    ],
+                    imports: [
+                        CommonModule,
+                        FormsModule,
+                        ReactiveFormsModule,
+                        MatButtonModule,
+                        MatDialogModule,
+                        MatIconModule,
+                        MatTooltipModule,
+                        QuillModule.forRoot()
+                    ],
+                    exports: [
+                        EditorComponent
+                    ]
+                }]
+        }], ctorParameters: function () { return [{ type: QuillEditorModule, decorators: [{
+                    type: Optional
+                }, {
+                    type: SkipSelf
+                }] }]; } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { Buttons, Config, EditorComponent, Icons, QuillEditorModule, Tooltips };
+//# sourceMappingURL=cleavelandprice-ngx-lib-quill-editor.mjs.map

package/fesm2020/cleavelandprice-ngx-lib-quill-editor.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"cleavelandprice-ngx-lib-quill-editor.mjs","sources":["../../../../projects/cleavelandprice/ngx-lib/quill-editor/src/model/buttons.ts","../../../../projects/cleavelandprice/ngx-lib/quill-editor/src/model/icons.ts","../../../../projects/cleavelandprice/ngx-lib/quill-editor/src/model/tooltips.ts","../../../../projects/cleavelandprice/ngx-lib/quill-editor/src/model/config.ts","../../../../projects/cleavelandprice/ngx-lib/quill-editor/src/components/editor/editor.component.ts","../../../../projects/cleavelandprice/ngx-lib/quill-editor/src/components/editor/editor.component.html","../../../../projects/cleavelandprice/ngx-lib/quill-editor/src/quill-editor.module.ts","../../../../projects/cleavelandprice/ngx-lib/quill-editor/src/cleavelandprice-ngx-lib-quill-editor.ts"],"sourcesContent":["export class Buttons {\r\n    //#region Font Style\r\n    bold = true;\r\n    italic = true;\r\n    strike = true;\r\n    underline = true;\r\n    //#endregion\r\n\r\n    //#region Media\r\n    link = true;\r\n    image = true;\r\n    video = true;\r\n    //#endregion\r\n\r\n    //#region Block Style\r\n    blockquote = true;\r\n    codeblock = true;\r\n    //#endregion\r\n\r\n    //#region Heading Style\r\n    h1 = true;\r\n    h2 = true;\r\n    //#endregion\r\n\r\n    //#region Color\r\n    color = true;\r\n    //#endregion\r\n\r\n    //#region List Style\r\n    bulleted = true;\r\n    ordered = true;\r\n    //#endregion\r\n\r\n    //#region Script Style\r\n    subScript = true;\r\n    superScript = true;\r\n    //#endregion\r\n\r\n    //#region Indent Style\r\n    increaseIndent = true;\r\n    decreaseIndent = true;\r\n    //#endregion\r\n\r\n    //#region DropDowns\r\n    align = true;\r\n    font = true;\r\n    fontSize = true;\r\n    headingStyle = true;\r\n    //#endregion\r\n\r\n    //#region Single Buttons\r\n    clean = true;\r\n    formula = true;\r\n    rtl = true;\r\n    editorSize = true;\r\n    //#endregion\r\n}","export class Icons {\r\n    maximize = 'open_in_full';\r\n    minimize = 'close_fullscreen';\r\n    popout = 'open_in_full';\r\n    popin = 'done';\r\n}","export class Tooltips {\r\n    //#region Font Style\r\n    bold = 'Bole';\r\n    italic = 'Italic';\r\n    strike = 'Strikethrough';\r\n    underline = 'Underline';\r\n    //#endregion\r\n\r\n    //#region Media\r\n    link = 'Link';\r\n    image = 'Insert Image';\r\n    video = 'Insert Video';\r\n    //#endregion\r\n\r\n    //#region Block Style\r\n    blockquote = 'Blockquote';\r\n    codeblock = 'Code Block';\r\n    //#endregion\r\n\r\n    //#region Heading Style\r\n    h1 = 'Heading 1';\r\n    h2 = 'Heading 2';\r\n    //#endregion\r\n\r\n    //#region Color\r\n    color = 'Font / Background Color';\r\n    //#endregion\r\n\r\n    //#region List Style\r\n    bulleted = 'Bulleted List';\r\n    ordered = 'Ordered List';\r\n    //#endregion\r\n\r\n    //#region Script Style\r\n    subScript = 'Subscript';\r\n    superScript = 'Superscript';\r\n    //#endregion\r\n\r\n    //#region Indent Style\r\n    increaseIndent = 'Increase Indent';\r\n    decreaseIndent = 'Decrease Indent';\r\n    //#endregion\r\n\r\n    //#region DropDowns\r\n    align = 'Align';\r\n    font = 'Font';\r\n    fontSize = 'Font Size';\r\n    headingStyle = 'Heading';\r\n    //#endregion\r\n\r\n    //#region Single Buttons\r\n    clean = 'Clean';\r\n    formula = 'Formula';\r\n    rtl = 'Right-To-Left';\r\n    maximize = 'Maximize';\r\n    minimize = 'Minimize';\r\n    popout = 'Popout';\r\n    popin = 'Done';\r\n    //#endregion\r\n}","import { Buttons } from \"./buttons\";\r\nimport { Icons } from \"./icons\";\r\nimport { Tooltips } from \"./tooltips\";\r\n\r\nexport class Config {\r\n    buttons = new Buttons();\r\n    tooltips = new Tooltips();\r\n    icons = new Icons();\r\n\r\n    //#region These can be overriden via @Input()\r\n    format: 'object' | 'html' | 'text' | 'json' = 'html';\r\n    height = '50vh';\r\n    width = '100vw';\r\n    maxHeight = '85vh';\r\n    maxWidth = '100vw';\r\n    enableTooltips = true;\r\n    fullscreen = false;\r\n    fullscreenMode: 'expand' | 'popout' = 'popout';\r\n    readonly = false;\r\n    //#endregion\r\n\r\n    //#region Groups\r\n    showBlockStyle = () => this.buttons.blockquote || this.buttons.codeblock;\r\n    showFontStyle = () => this.buttons.bold || this.buttons.italic || this.buttons.strike || this.buttons.underline;\r\n    showQuickHeadingStyle = () => this.buttons.h1 || this.buttons.h2;\r\n    showIndentStyle = () => this.buttons.decreaseIndent || this.buttons.increaseIndent;\r\n    showListStyle = () => this.buttons.bulleted || this.buttons.ordered;\r\n    showMedia = () => this.buttons.link || this.buttons.image || this.buttons.video;\r\n    showScriptStyle = () => this.buttons.subScript || this.buttons.superScript;\r\n    //#endregion\r\n}","import { Component, EventEmitter, Inject, Input, OnInit, Output, ViewChild, Optional } from '@angular/core';\nimport { FormGroup } from '@angular/forms';\nimport { MatDialog, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';\nimport { ActiveDirectoryService, User } from '@cleavelandprice/ngx-lib/active-directory';\n\nimport { ContentChange, Blur, Focus, EditorChangeContent, EditorChangeSelection, SelectionChange, QuillEditorComponent } from 'ngx-quill';\nimport 'quill-mention';\nimport Quill from 'quill';\nimport ImageResize from 'quill-image-resize-module';\nimport { ImageDrop } from 'quill-image-drop-module';\nQuill.register('modules/imageDrop', ImageDrop);\nQuill.register('modules/imageResize', ImageResize);\n\nimport { Config } from '../../model/config';\nimport { DialogData } from '../../model/dialog-data';\n\n@Component({\n  selector: 'cpquill-editor',\n  templateUrl: './editor.component.html',\n  styleUrls: ['./editor.component.css']\n})\nexport class EditorComponent implements OnInit {\n  @ViewChild(QuillEditorComponent, { static: false }) editor: QuillEditorComponent | undefined;\n\n  @Input() formGroup!: FormGroup;\n  @Input() controlName!: string;\n  @Input() ngModelValue: string | undefined;\n\n  @Input() config: Config = new Config();\n  @Input() placeholder: string | undefined;\n  @Input() users: User[] | undefined;\n\n  //#region These can be passed in as @Input(), or use values from config\n  @Input() format: 'object' | 'html' | 'text' | 'json' = this.config.format;\n  @Input() height = this.config.height;\n  @Input() width = this.config.width;\n  @Input() maxHeight = this.config.maxHeight;\n  @Input() maxWidth = this.config.maxWidth;\n  @Input() enableTooltips = this.config.enableTooltips;\n  @Input() fullscreen = this.config.fullscreen;\n  @Input() fullscreenMode: 'expand' | 'popout' = this.config.fullscreenMode;\n  @Input() readonly = this.config.readonly;\n  //#endregion\n\n  @Output() fullscreenChanged = new EventEmitter<boolean>();\n\n  //#region Passthrough events\n  @Output() onBlur = new EventEmitter<Blur>();\n  @Output() onContentChanged = new EventEmitter<ContentChange>();\n  @Output() onEditorChanged = new EventEmitter<EditorChangeContent | EditorChangeSelection>();\n  @Output() onEditorCreated = new EventEmitter();\n  @Output() onFocus = new EventEmitter<Focus>();\n  @Output() onSelectionChanged = new EventEmitter<SelectionChange>();\n  //#endregion\n  \n  constructor(@Optional() @Inject(MAT_DIALOG_DATA) data: DialogData,\n              @Optional() private dialogRef: MatDialogRef<EditorComponent>,\n              private activeDirectoryService: ActiveDirectoryService,\n              private dialog: MatDialog) {\n\n    if (data) {\n      this.formGroup = data.formGroup;\n      this.controlName = data.controlName;\n      this.ngModelValue = data.value;\n\n      this.config = data.config;\n      this.placeholder = data.placeholder;\n      this.format = data.format;\n      this.height = data.height;\n      this.width = data.width;\n      this.maxHeight = data.maxHeight;\n      this.maxWidth = data.maxWidth;\n      this.enableTooltips = data.enableTooltips;\n      this.fullscreen = data.fullscreen;\n      this.fullscreenMode = data.fullscreenMode;\n      this.readonly = data.readonly;\n      this.users = data.users;\n    }\n  }\n\n  ngOnInit(): void {\n    if (!this.users) {\n      this.activeDirectoryService.getUsers().subscribe(users =>\n        this.users = users\n      );\n    }\n  }\n\n  toggleFullscreen(): void {\n    this.fullscreen = !this.fullscreen;\n    this.fullscreenChanged.emit(this.fullscreen);\n\n    if (this.fullscreenMode === 'popout') {\n      if (this.dialogRef) {\n        this.dialogRef.close(this.formGroup ?\n          this.formGroup.get(this.controlName)?.value :\n          this.ngModelValue);\n      } else {\n        \n        const data: DialogData = {\n          formGroup: this.formGroup,\n          controlName: this.controlName,\n          value: this.ngModelValue,\n\n          config: this.config,\n          placeholder: this.placeholder,\n          format: this.format,\n          height: this.maxHeight,\n          width: '100%',\n          maxHeight: this.maxHeight,\n          maxWidth: '100%',\n          enableTooltips: this.enableTooltips,\n          fullscreen: this.fullscreen,\n          fullscreenMode: this.fullscreenMode,\n          readonly: this.readonly,\n          users: this.users\n        };\n\n        this.dialog.open(EditorComponent, {\n          disableClose: true,\n          width: this.maxWidth,\n          height: '90vh',\n          data\n        })\n        .afterClosed()\n        .subscribe(value => {\n          this.fullscreen = false;\n\n          if (this.formGroup) {\n            this.formGroup.get(this.controlName)?.setValue(value);\n          } else {\n            this.ngModelValue = value;\n          }\n        });\n      }\n    }\n  }\n\n  tooltip(val: string): string {\n    return this.enableTooltips ? val : '';\n  }\n\n  get modules() {\n    return this.users ?\n      {\n        imageResize: {},\n        imageDrop: true,\n        syntax: true,\n        mention: {\n          allowedChars: /^[A-Za-z\\sÅÄÖåäö]*$/,\n\n          onSelect: (item: DOMStringMap, insertItem: any) => {\n            const editor = this.editor!.quillEditor\n            insertItem(item)\n            // necessary because quill-mention triggers changes as 'api' instead of 'user'\n            editor.insertText(editor.getLength() - 1, '', 'user')\n          },\n\n          source: (searchTerm: string, renderList: any) => {\n            if (searchTerm.length === 0) {\n              renderList(this.users?.map(u => ({ value: `${u.displayName} (${u.sAMAccountName.toLowerCase()})` })), searchTerm)\n            } else {\n              const matches: any[] = []\n\n              this.users!.forEach((entry) => {\n                if (\n                  entry.displayName.toLowerCase().indexOf(searchTerm.toLowerCase()) !== -1 ||\n                  entry.sAMAccountName.toLowerCase().indexOf(searchTerm.toLowerCase()) !== -1\n                  ) {\n                  matches.push({ value: `${entry.displayName} (${entry.sAMAccountName.toLowerCase()})` })\n                }\n              })\n\n              renderList(matches, searchTerm)\n            }\n          }\n        }\n      } :\n      undefined;\n  }\n}","<ng-container *ngIf=\"users\">\n    <!-- Reactive forms -->\n    <form *ngIf=\"formGroup\" [formGroup]=\"formGroup\">\n        <quill-editor\n            [formControlName]=\"controlName\"\n            [placeholder]=\"placeholder\"\n            [format]=\"format\"\n            [style.height]=\"fullscreen ? maxHeight : height\"\n            [style.width]=\"fullscreen ? maxWidth : width\"\n            [readOnly]=\"readonly\"\n            [class.readonly]=\"readonly\"\n            [modules]=\"modules\"\n    \n            (onBlur)=\"onBlur.emit($event)\"\n            (onContentChanged)=\"onContentChanged.emit($event)\"\n            (onEditorChanged)=\"onEditorChanged.emit($event)\"\n            (onEditorCreated)=\"onEditorCreated.emit()\"\n            (onFocus)=\"onFocus.emit($event)\"\n            (onSelectionChanged)=\"onSelectionChanged.emit($event)\">\n    \n            <div quill-editor-toolbar>\n                <ng-container [ngTemplateOutlet]=\"toolbar\"></ng-container>\n                <ng-container [ngTemplateOutlet]=\"editorSize\"></ng-container>\n            </div>\n        </quill-editor>\n    </form>\n    \n    <!-- NgModel forms -->\n    <form *ngIf=\"!formGroup\">\n        <quill-editor name=\"editor\"\n            [(ngModel)]=\"ngModelValue\"\n            [placeholder]=\"placeholder\"\n            [format]=\"format\"\n            [style.height]=\"fullscreen ? maxHeight : height\"\n            [style.width]=\"fullscreen ? maxWidth : width\"\n            [readOnly]=\"readonly\"\n            [class.readonly]=\"readonly\"\n            [modules]=\"modules\"\n    \n            (onBlur)=\"onBlur.emit($event)\"\n            (onContentChanged)=\"onContentChanged.emit($event)\"\n            (onEditorChanged)=\"onEditorChanged.emit($event)\"\n            (onEditorCreated)=\"onEditorCreated.emit()\"\n            (onFocus)=\"onFocus.emit($event)\"\n            (onSelectionChanged)=\"onSelectionChanged.emit($event)\">\n    \n            <div quill-editor-toolbar>\n                <ng-container [ngTemplateOutlet]=\"toolbar\"></ng-container>\n                <ng-container [ngTemplateOutlet]=\"editorSize\"></ng-container>\n            </div>\n        </quill-editor>\n    </form>\n</ng-container>\n\n<ng-template #toolbar>\n    <div>\n        <ng-container [ngTemplateOutlet]=\"fontStyle\"></ng-container>\n        <ng-container [ngTemplateOutlet]=\"blockStyle\"></ng-container>\n        <ng-container [ngTemplateOutlet]=\"headingStyle\"></ng-container>\n        <ng-container [ngTemplateOutlet]=\"listStyle\"></ng-container>\n        <ng-container [ngTemplateOutlet]=\"scriptStyle\"></ng-container>\n        <ng-container [ngTemplateOutlet]=\"indentStyle\"></ng-container>\n        <ng-container [ngTemplateOutlet]=\"rtl\"></ng-container>\n        <ng-container [ngTemplateOutlet]=\"fontSize\"></ng-container>\n        <ng-container [ngTemplateOutlet]=\"heading\"></ng-container>\n        <ng-container [ngTemplateOutlet]=\"color\"></ng-container>\n        <ng-container [ngTemplateOutlet]=\"font\"></ng-container>\n        <ng-container [ngTemplateOutlet]=\"align\"></ng-container>\n        <ng-container [ngTemplateOutlet]=\"clean\"></ng-container>\n        <nt-container [ngTemplateOutlet]=\"formula\"></nt-container>\n        <ng-container [ngTemplateOutlet]=\"media\"></ng-container>\n    </div>\n</ng-template>\n\n<ng-template #fontStyle>\n    <span class=\"ql-formats\" *ngIf=\"config.showFontStyle\">\n        <button class=\"ql-bold\"      *ngIf=\"config.buttons.bold\"      [matTooltip]=\"tooltip(config.tooltips.bold)\"></button>\n        <button class=\"ql-italic\"    *ngIf=\"config.buttons.italic\"    [matTooltip]=\"tooltip(config.tooltips.italic)\"></button>\n        <button class=\"ql-underline\" *ngIf=\"config.buttons.underline\" [matTooltip]=\"tooltip(config.tooltips.underline)\"></button>\n        <button class=\"ql-strike\"    *ngIf=\"config.buttons.strike\"    [matTooltip]=\"tooltip(config.tooltips.strike)\"></button>\n    </span>\n</ng-template>\n\n<ng-template #blockStyle>\n    <span class=\"ql-formats\" *ngIf=\"config.showBlockStyle\">\n        <button class=\"ql-blockquote\" *ngIf=\"config.buttons.blockquote\" [matTooltip]=\"tooltip(config.tooltips.blockquote)\"></button>\n        <button class=\"ql-code-block\" *ngIf=\"config.buttons.codeblock\"  [matTooltip]=\"tooltip(config.tooltips.codeblock)\"></button>\n    </span>\n</ng-template>\n\n<ng-template #headingStyle>\n    <span class=\"ql-formats\" *ngIf=\"config.showQuickHeadingStyle\">\n        <button class=\"ql-header\" value=\"1\" *ngIf=\"config.buttons.h1\" [matTooltip]=\"tooltip(config.tooltips.h1)\"></button>\n        <button class=\"ql-header\" value=\"2\" *ngIf=\"config.buttons.h2\" [matTooltip]=\"tooltip(config.tooltips.h2)\"></button>\n    </span>\n</ng-template>\n\n<ng-template #listStyle>\n    <span class=\"ql-formats\" *ngIf=\"config.showListStyle\">\n        <button class=\"ql-list\" value=\"ordered\" *ngIf=\"config.buttons.ordered\"  [matTooltip]=\"tooltip(config.tooltips.ordered)\"></button>\n        <button class=\"ql-list\" value=\"bullet\"  *ngIf=\"config.buttons.bulleted\" [matTooltip]=\"tooltip(config.tooltips.bulleted)\"></button>\n    </span>\n</ng-template>\n\n<ng-template #scriptStyle>\n    <span class=\"ql-formats\" *ngIf=\"config.showScriptStyle\">\n        <button class=\"ql-script\" value=\"sub\"   *ngIf=\"config.buttons.subScript\" [matTooltip]=\"tooltip(config.tooltips.subScript)\"></button>\n        <button class=\"ql-script\" value=\"super\" *ngIf=\"config.buttons.superScript\" [matTooltip]=\"tooltip(config.tooltips.superScript)\"></button>\n    </span>\n</ng-template>\n    \n<ng-template #indentStyle>\n    <span class=\"ql-formats\" *ngIf=\"config.showIndentStyle\">\n        <button class=\"ql-indent\" value=\"-1\" *ngIf=\"config.buttons.decreaseIndent\" [matTooltip]=\"tooltip(config.tooltips.decreaseIndent)\"></button>\n        <button class=\"ql-indent\" value=\"+1\" *ngIf=\"config.buttons.increaseIndent\" [matTooltip]=\"tooltip(config.tooltips.increaseIndent)\"></button>\n    </span>\n</ng-template>\n\n<ng-template #rtl>\n    <span class=\"ql-formats\" *ngIf=\"config.buttons.rtl\">\n        <button class=\"ql-direction\" value=\"rtl\" [matTooltip]=\"tooltip(config.tooltips.rtl)\"></button>\n    </span>\n</ng-template>\n\n<ng-template #fontSize>\n    <span class=\"ql-formats\" *ngIf=\"config.buttons.fontSize\" [matTooltip]=\"tooltip(config.tooltips.fontSize)\">\n        <select class=\"ql-size\">\n            <option value=\"small\"></option>\n            <option selected></option>\n            <option value=\"large\"></option>\n            <option value=\"huge\"></option>\n        </select>\n    </span>\n</ng-template>\n\n<ng-template #heading>\n    <span class=\"ql-formats\" *ngIf=\"config.buttons.headingStyle\" [matTooltip]=\"tooltip(config.tooltips.headingStyle)\">\n        <select class=\"ql-header\">\n            <option value=\"1\"></option>\n            <option value=\"2\"></option>\n            <option value=\"3\"></option>\n            <option value=\"4\"></option>\n            <option value=\"5\"></option>\n            <option value=\"6\"></option>\n            <option selected=\"selected\"></option>\n        </select>\n    </span>\n</ng-template>\n\n<ng-template #color>\n    <span class=\"ql-formats\" *ngIf=\"config.buttons.color\" [matTooltip]=\"tooltip(config.tooltips.color)\">\n        <select class=\"ql-color\"></select>\n        <select class=\"ql-background\"></select>\n    </span>\n</ng-template>\n\n<ng-template #font>\n    <span class=\"ql-formats\" *ngIf=\"config.buttons.font\" [matTooltip]=\"tooltip(config.tooltips.font)\">\n        <select class=\"ql-font\">\n            <option selected></option>\n            <option value=\"serif\"></option>\n            <option value=\"monospace\"></option>\n        </select>\n    </span>\n</ng-template>\n\n<ng-template #align>\n    <span class=\"ql-formats\" *ngIf=\"config.buttons.align\" [matTooltip]=\"tooltip(config.tooltips.align)\">\n        <select class=\"ql-align\">\n            <option selected></option>\n            <option value=\"center\"></option>\n            <option value=\"right\"></option>\n            <option value=\"justify\"></option>\n        </select>\n    </span>\n</ng-template>\n\n<ng-template #clean>\n    <span class=\"ql-formats\" *ngIf=\"config.buttons.clean\" [matTooltip]=\"tooltip(config.tooltips.clean)\">\n        <button class=\"ql-clean\"></button>\n    </span>\n</ng-template>\n\n<ng-template #media>\n    <span class=\"ql-formats\" *ngIf=\"config.showMedia\">\n        <button class=\"ql-link\"  *ngIf=\"config.buttons.link\" [matTooltip]=\"tooltip(config.tooltips.link)\"></button>\n        <button class=\"ql-image\" *ngIf=\"config.buttons.image\" [matTooltip]=\"tooltip(config.tooltips.image)\"></button>\n        <button class=\"ql-video\" *ngIf=\"config.buttons.video\" [matTooltip]=\"tooltip(config.tooltips.video)\"></button>\n    </span>\n</ng-template>\n\n<ng-template #editorSize>\n    <span class=\"ql-formats\" *ngIf=\"config.buttons.editorSize\">\n        <button id=\"fullscreen\"\n            [matTooltip]=\"tooltip(fullscreen ?\n                (fullscreenMode === 'expand' ? config.tooltips.minimize : config.tooltips.popin) :\n                (fullscreenMode === 'expand' ? config.tooltips.maximize : config.tooltips.popout))\">\n\n            <mat-icon (click)=\"toggleFullscreen()\">\n                {{ fullscreen ?\n                    (fullscreenMode === 'expand' ? config.icons.minimize : config.icons.popin) :\n                    (fullscreenMode === 'expand' ? config.icons.maximize : config.icons.popout)\n                }}\n            </mat-icon>\n        </button>\n    </span>\n</ng-template>\n\n<ng-template #formula>\n    <span class=\"ql-formats\" *ngIf=\"config.buttons.formula\" [matTooltip]=\"tooltip(config.tooltips.formula)\">\n        <button class=\"ql-formula\"></button>\n    </span>\n</ng-template>","import { ModuleWithProviders, NgModule, Optional, SkipSelf } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { FormsModule, ReactiveFormsModule } from '@angular/forms';\n\nimport { MatButtonModule } from '@angular/material/button';\nimport { MatDialogModule } from '@angular/material/dialog';\nimport { MatIconModule } from '@angular/material/icon';\nimport { MatTooltipModule } from '@angular/material/tooltip';\n\nimport { QuillModule } from 'ngx-quill';\n\nimport { EditorComponent } from './components/editor/editor.component';\n\n@NgModule({\n  declarations: [\n    EditorComponent\n  ],\n  imports: [\n    CommonModule,\n    FormsModule,\n    ReactiveFormsModule,\n\n    MatButtonModule,\n    MatDialogModule,\n    MatIconModule,\n    MatTooltipModule,\n\n    QuillModule.forRoot()\n  ],\n  exports: [\n    EditorComponent\n  ]\n})\nexport class QuillEditorModule {\n  static forRoot(): ModuleWithProviders<QuillEditorModule> {\n      return {\n        ngModule: QuillEditorModule\n      };\n    }\n\n    constructor(@Optional() @SkipSelf() parentModule: QuillEditorModule) {\n      if (parentModule) {\n        throw new Error(\n          'QuillEditorModule is already loaded. Import it in the AppModule only');\n      }\n    }\n}","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}

package/fesm2020/cleavelandprice-ngx-lib-sharepoint.mjs

@@ -4,7 +4,8 @@ import { Injectable, Optional, Pipe, Component, Input, NgModule, SkipSelf } from
 import { of, map } from 'rxjs';
 import moment from 'moment';
 import * as i2 from '@angular/common/http';
-import * as i1 from '@angular/common';
+import * as i1 from '@cleavelandprice/ngx-lib/active-directory';
+import * as i2$1 from '@angular/common';
 import { CommonModule } from '@angular/common';
 
 const defaultConfig = {
@@ -216,17 +217,31 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.1", ngImpor
         }], ctorParameters: function () { return [{ type: SharePointService }]; } });
 
 class EmployeePhotoComponent {
-    constructor() {
+    constructor(activeDirectoryService) {
+        this.activeDirectoryService = activeDirectoryService;
+        this.employee = null;
+        // Or...
+        this.accountName = null;
         this.size = "2em";
         this.notRound = false;
     }
+    ngOnInit() {
+        if (this.accountName && !this.employee) {
+            // Developer passed in an account name instead of a user object
+            // We need to do the work of getting the user object ourselves
+            this.activeDirectoryService.getUser(this.accountName)
+                .subscribe(user => this.employee = user);
+        }
+    }
 }
-EmployeePhotoComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.1", ngImport: i0, type: EmployeePhotoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-EmployeePhotoComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.1", type: EmployeePhotoComponent, selector: "employee-photo", inputs: { employee: "employee", employeePhotos: "employeePhotos", size: "size", notRound: "notRound" }, ngImport: i0, template: "<img *ngIf=\"(employee | employeePhotoUrl:employeePhotos | async)\"\n    [src]=\"employee | employeePhotoUrl:employeePhotos | async\"\n    [style.width]=\"size\"\n    [style.height]=\"size\"\n    [style.border-radius]=\"notRound ? 'default' : '100%'\">", styles: [""], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: EmployeePhotoUrlPipe, name: "employeePhotoUrl" }] });
+EmployeePhotoComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.1", ngImport: i0, type: EmployeePhotoComponent, deps: [{ token: i1.ActiveDirectoryService }], target: i0.ɵɵFactoryTarget.Component });
+EmployeePhotoComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.1", type: EmployeePhotoComponent, selector: "employee-photo", inputs: { employee: "employee", accountName: "accountName", employeePhotos: "employeePhotos", size: "size", notRound: "notRound" }, ngImport: i0, template: "<ng-container *ngIf=\"employee\">\n    <img *ngIf=\"(employee | employeePhotoUrl:employeePhotos | async)\"\n        [src]=\"employee | employeePhotoUrl:employeePhotos | async\"\n        [style.width]=\"size\"\n        [style.height]=\"size\"\n        [style.border-radius]=\"notRound ? 'default' : '100%'\">\n</ng-container>", styles: [""], dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i2$1.AsyncPipe, name: "async" }, { kind: "pipe", type: EmployeePhotoUrlPipe, name: "employeePhotoUrl" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.1", ngImport: i0, type: EmployeePhotoComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'employee-photo', template: "<img *ngIf=\"(employee | employeePhotoUrl:employeePhotos | async)\"\n    [src]=\"employee | employeePhotoUrl:employeePhotos | async\"\n    [style.width]=\"size\"\n    [style.height]=\"size\"\n    [style.border-radius]=\"notRound ? 'default' : '100%'\">" }]
-        }], propDecorators: { employee: [{
+            args: [{ selector: 'employee-photo', template: "<ng-container *ngIf=\"employee\">\n    <img *ngIf=\"(employee | employeePhotoUrl:employeePhotos | async)\"\n        [src]=\"employee | employeePhotoUrl:employeePhotos | async\"\n        [style.width]=\"size\"\n        [style.height]=\"size\"\n        [style.border-radius]=\"notRound ? 'default' : '100%'\">\n</ng-container>" }]
+        }], ctorParameters: function () { return [{ type: i1.ActiveDirectoryService }]; }, propDecorators: { employee: [{
+                type: Input
+            }], accountName: [{
                 type: Input
             }], employeePhotos: [{
                 type: Input