@skyux/text-editor 5.0.3 → 5.5.0

package/esm2015/lib/modules/text-editor/services/text-editor.service.js

@@ -0,0 +1,61 @@
+import { Injectable } from '@angular/core';
+import * as i0 from "@angular/core";
+/**
+ * @internal
+ */
+export class SkyTextEditorService {
+    constructor() {
+        /**
+         * A dictionary representing all active text editors and their settings.
+         */
+        this.editors = {};
+    }
+    /**
+     * Returns the blur observable from the editor with the corresponding id.
+     */
+    blurListener(id) {
+        return this.editors[id].blurObservable;
+    }
+    /**
+     * Returns the click observable from the editor with the corresponding id.
+     */
+    clickListener(id) {
+        return this.editors[id].clickObservable;
+    }
+    /**
+     * Returns the command change observable from the editor with the corresponding id.
+     */
+    commandChangeListener(id) {
+        return this.editors[id].commandChangeObservable;
+    }
+    /**
+     * Returns the input change observable from the editor with the corresponding id.
+     */
+    inputListener(id) {
+        return this.editors[id].inputObservable;
+    }
+    /**
+     * Removes editor from the `editors` index by id.
+     */
+    removeEditor(id) {
+        /* istanbul ignore else */
+        if (id in this.editors) {
+            delete this.editors[id];
+        }
+    }
+    /**
+     * Returns the selection change observable from the editor with the corresponding id.
+     */
+    selectionChangeListener(id) {
+        return this.editors[id].selectionChangeObservable;
+    }
+}
+SkyTextEditorService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyTextEditorService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+SkyTextEditorService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyTextEditorService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyTextEditorService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }] });
+//# sourceMappingURL=text-editor.service.js.map

package/esm2015/lib/modules/text-editor/services/text-editor.service.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"text-editor.service.js","sourceRoot":"","sources":["../../../../../../../../../libs/components/text-editor/src/lib/modules/text-editor/services/text-editor.service.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;;AAM3C;;GAEG;AAIH,MAAM,OAAO,oBAAoB;IAHjC;QAIE;;WAEG;QACI,YAAO,GAAqC,EAAE,CAAC;KA8CvD;IA5CC;;OAEG;IACI,YAAY,CAAC,EAAU;QAC5B,OAAO,IAAI,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC,cAAc,CAAC;IACzC,CAAC;IAED;;OAEG;IACI,aAAa,CAAC,EAAU;QAC7B,OAAO,IAAI,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC,eAAe,CAAC;IAC1C,CAAC;IAED;;OAEG;IACI,qBAAqB,CAAC,EAAU;QACrC,OAAO,IAAI,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC,uBAAuB,CAAC;IAClD,CAAC;IAED;;OAEG;IACI,aAAa,CAAC,EAAU;QAC7B,OAAO,IAAI,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC,eAAe,CAAC;IAC1C,CAAC;IAED;;OAEG;IACI,YAAY,CAAC,EAAU;QAC5B,0BAA0B;QAC1B,IAAI,EAAE,IAAI,IAAI,CAAC,OAAO,EAAE;YACtB,OAAO,IAAI,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC;SACzB;IACH,CAAC;IAED;;OAEG;IACI,uBAAuB,CAAC,EAAU;QACvC,OAAO,IAAI,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC,yBAAyB,CAAC;IACpD,CAAC;;kHAjDU,oBAAoB;sHAApB,oBAAoB,cAFnB,MAAM;4FAEP,oBAAoB;kBAHhC,UAAU;mBAAC;oBACV,UAAU,EAAE,MAAM;iBACnB","sourcesContent":["import { Injectable } from '@angular/core';\n\nimport { Observable } from 'rxjs';\n\nimport { EditorSetting } from '../types/editor-setting';\n\n/**\n * @internal\n */\n@Injectable({\n  providedIn: 'root',\n})\nexport class SkyTextEditorService {\n  /**\n   * A dictionary representing all active text editors and their settings.\n   */\n  public editors: { [key: string]: EditorSetting } = {};\n\n  /**\n   * Returns the blur observable from the editor with the corresponding id.\n   */\n  public blurListener(id: string): Observable<unknown> {\n    return this.editors[id].blurObservable;\n  }\n\n  /**\n   * Returns the click observable from the editor with the corresponding id.\n   */\n  public clickListener(id: string): Observable<unknown> {\n    return this.editors[id].clickObservable;\n  }\n\n  /**\n   * Returns the command change observable from the editor with the corresponding id.\n   */\n  public commandChangeListener(id: string): Observable<unknown> {\n    return this.editors[id].commandChangeObservable;\n  }\n\n  /**\n   * Returns the input change observable from the editor with the corresponding id.\n   */\n  public inputListener(id: string): Observable<unknown> {\n    return this.editors[id].inputObservable;\n  }\n\n  /**\n   * Removes editor from the `editors` index by id.\n   */\n  public removeEditor(id: string): void {\n    /* istanbul ignore else */\n    if (id in this.editors) {\n      delete this.editors[id];\n    }\n  }\n\n  /**\n   * Returns the selection change observable from the editor with the corresponding id.\n   */\n  public selectionChangeListener(id: string): Observable<unknown> {\n    return this.editors[id].selectionChangeObservable;\n  }\n}\n"]}

package/esm2015/lib/modules/text-editor/services/text-sanitization.service.js

@@ -0,0 +1,38 @@
+import { Injectable } from '@angular/core';
+import createDOMPurify from 'dompurify';
+import * as i0 from "@angular/core";
+const domPurify = createDOMPurify(window);
+domPurify.addHook('afterSanitizeAttributes', (node) => {
+    // Set all elements owning target to target=_blank
+    // so we only allow the target attribute with that value.
+    if (!!node.getAttribute('target')) {
+        node.setAttribute('target', '_blank');
+        node.setAttribute('rel', 'noopener noreferrer');
+    }
+});
+/**
+ * The `SkyTextSanitizationService` user the `DOMPurify` library to sanitize strings for use
+ * in the DOM. `DOMPurify` allows more customization than Angular's internal `DomSanitizer` so we
+ * can preserve `<style>` tags and allow `target` attributes for new tab links.
+ * @internal
+ */
+export class SkyTextSanitizationService {
+    constructor() {
+        this.allowedAttributes = ['target'];
+    }
+    /**
+     * Returns a sanitized string, allowing target attribute for new tab links.
+     */
+    sanitize(htmlString) {
+        return domPurify.sanitize(htmlString, { ADD_ATTR: this.allowedAttributes });
+    }
+}
+SkyTextSanitizationService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyTextSanitizationService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+SkyTextSanitizationService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyTextSanitizationService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyTextSanitizationService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }] });
+//# sourceMappingURL=text-sanitization.service.js.map

package/esm2015/lib/modules/text-editor/services/text-sanitization.service.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"text-sanitization.service.js","sourceRoot":"","sources":["../../../../../../../../../libs/components/text-editor/src/lib/modules/text-editor/services/text-sanitization.service.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAE3C,OAAO,eAAe,MAAM,WAAW,CAAC;;AACxC,MAAM,SAAS,GAAG,eAAe,CAAC,MAAM,CAAC,CAAC;AAE1C,SAAS,CAAC,OAAO,CAAC,yBAAyB,EAAE,CAAC,IAAa,EAAE,EAAE;IAC7D,kDAAkD;IAClD,yDAAyD;IACzD,IAAI,CAAC,CAAC,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,EAAE;QACjC,IAAI,CAAC,YAAY,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;QACtC,IAAI,CAAC,YAAY,CAAC,KAAK,EAAE,qBAAqB,CAAC,CAAC;KACjD;AACH,CAAC,CAAC,CAAC;AAEH;;;;;GAKG;AAIH,MAAM,OAAO,0BAA0B;IAHvC;QAIU,sBAAiB,GAAa,CAAC,QAAQ,CAAC,CAAC;KAQlD;IANC;;OAEG;IACI,QAAQ,CAAC,UAAkB;QAChC,OAAO,SAAS,CAAC,QAAQ,CAAC,UAAU,EAAE,EAAE,QAAQ,EAAE,IAAI,CAAC,iBAAiB,EAAE,CAAC,CAAC;IAC9E,CAAC;;wHARU,0BAA0B;4HAA1B,0BAA0B,cAFzB,MAAM;4FAEP,0BAA0B;kBAHtC,UAAU;mBAAC;oBACV,UAAU,EAAE,MAAM;iBACnB","sourcesContent":["import { Injectable } from '@angular/core';\n\nimport createDOMPurify from 'dompurify';\nconst domPurify = createDOMPurify(window);\n\ndomPurify.addHook('afterSanitizeAttributes', (node: Element) => {\n  // Set all elements owning target to target=_blank\n  // so we only allow the target attribute with that value.\n  if (!!node.getAttribute('target')) {\n    node.setAttribute('target', '_blank');\n    node.setAttribute('rel', 'noopener noreferrer');\n  }\n});\n\n/**\n * The `SkyTextSanitizationService` user the `DOMPurify` library to sanitize strings for use\n * in the DOM. `DOMPurify` allows more customization than Angular's internal `DomSanitizer` so we\n * can preserve `<style>` tags and allow `target` attributes for new tab links.\n * @internal\n */\n@Injectable({\n  providedIn: 'root',\n})\nexport class SkyTextSanitizationService {\n  private allowedAttributes: string[] = ['target'];\n\n  /**\n   * Returns a sanitized string, allowing target attribute for new tab links.\n   */\n  public sanitize(htmlString: string): string {\n    return domPurify.sanitize(htmlString, { ADD_ATTR: this.allowedAttributes });\n  }\n}\n"]}

package/esm2015/lib/modules/text-editor/text-editor.component.js

@@ -0,0 +1,322 @@
+import { ChangeDetectorRef, ChangeDetectionStrategy, Component, ElementRef, Input, NgZone, ViewChild, ViewEncapsulation, } from '@angular/core';
+import { NgControl } from '@angular/forms';
+import { takeUntil } from 'rxjs/operators';
+import { Subject } from 'rxjs';
+import { SkyCoreAdapterService } from '@skyux/core';
+import { MENU_DEFAULTS } from './defaults/menu-defaults';
+import { STYLE_STATE_DEFAULTS } from './defaults/style-state-defaults';
+import { TOOLBAR_ACTION_DEFAULTS } from './defaults/toolbar-action-defaults';
+import { SkyTextEditorAdapterService } from './services/text-editor-adapter.service';
+import { SkyTextEditorService } from './services/text-editor.service';
+import { SkyTextSanitizationService } from './services/text-sanitization.service';
+import { FONT_LIST_DEFAULTS } from './defaults/font-list-defaults';
+import { FONT_SIZE_LIST_DEFAULTS } from './defaults/font-size-list-defaults';
+import { SkyFormsUtility } from '../shared/forms-utility';
+import * as i0 from "@angular/core";
+import * as i1 from "@skyux/core";
+import * as i2 from "./services/text-editor-adapter.service";
+import * as i3 from "./services/text-editor.service";
+import * as i4 from "./services/text-sanitization.service";
+import * as i5 from "@angular/forms";
+import * as i6 from "@skyux/layout";
+import * as i7 from "./menubar/text-editor-menubar.component";
+import * as i8 from "./toolbar/text-editor-toolbar.component";
+import * as i9 from "@angular/common";
+/**
+ * Auto-incrementing integer used to generate unique ids for radio components.
+ */
+let nextUniqueId = 0;
+/**
+ * The text editor component lets users format and manipulate text.
+ */
+export class SkyTextEditorComponent {
+    constructor(changeDetector, coreAdapterService, adapterService, editorService, sanitizationService, ngControl, zone) {
+        this.changeDetector = changeDetector;
+        this.coreAdapterService = coreAdapterService;
+        this.adapterService = adapterService;
+        this.editorService = editorService;
+        this.sanitizationService = sanitizationService;
+        this.ngControl = ngControl;
+        this.zone = zone;
+        /**
+         * Indicates whether to put focus on the editor after it renders.
+         */
+        this.autofocus = false;
+        this.editorFocusStream = new Subject();
+        /**
+         * Specifies the fonts to include in the font picker.
+         * @default [{name: 'Blackbaud Sans', value: '"Blackbaud Sans", Arial, sans-serif'}, {name: 'Arial', value: 'Arial'}, {name: 'Arial Black', value: '"Arial Black"'}, {name: 'Courier New', value: '"Courier New"'}, {name: 'Georgia', value: 'Georgia, serif'}, {name: 'Tahoma', value: 'Tahoma, Geneva, sans-serif'}, {name: 'Times New Roman', value: '"Times New Roman"'}, {name: 'Trebuchet MS', value: '"Trebuchet MS", sans-serif'}, {name: 'Verdana', value: 'Verdana, Geneva, sans-serif'}]
+         */
+        this.fontList = FONT_LIST_DEFAULTS;
+        /**
+         * Specifies the font sizes to include in the font size picker.
+         * @default [6, 8, 9, 10, 11, 12, 13, 14, 15, 16, 18, 20, 22, 24, 26, 28, 36, 48]
+         */
+        this.fontSizeList = FONT_SIZE_LIST_DEFAULTS;
+        /**
+         * Specifies a unique ID attribute for the text editor.
+         * By default, the component generates a random ID.
+         */
+        this.id = `sky-text-editor-${++nextUniqueId}`;
+        /**
+         * Specifies the menus to include in the menu bar.
+         * @default [ 'edit', 'format' ]
+         */
+        this.menus = MENU_DEFAULTS;
+        /**
+         * Specifies the merge fields to include in the merge field menu.
+         */
+        this.mergeFields = [];
+        /**
+         * Specifies the actions to include in the toolbar and determines their order.
+         * @default [ 'font-family', 'font-size', 'font-style', 'color', 'list', 'link ]
+         */
+        this.toolbarActions = TOOLBAR_ACTION_DEFAULTS;
+        this.focusInitialized = false;
+        this.initialized = false;
+        this.ngUnsubscribe = new Subject();
+        this._disabled = false;
+        this._initialStyleState = Object.assign({}, STYLE_STATE_DEFAULTS);
+        this._placeholder = '';
+        this._value = '<p></p>';
+        /* istanbul ignore next */
+        this._onTouched = () => { };
+        /* istanbul ignore next */
+        this._onChange = () => { };
+        this.ngControl.valueAccessor = this;
+    }
+    /**
+     * Indicates whether to disable the text editor.
+     * @default false
+     */
+    set disabled(value) {
+        const coercedValue = SkyFormsUtility.coerceBooleanProperty(value);
+        if (coercedValue !== this.disabled) {
+            this._disabled = coercedValue;
+            // Update focusableChildren inside the iframe.
+            let focusableChildren;
+            /* istanbul ignore else */
+            if (this.iframeRef) {
+                focusableChildren = this.coreAdapterService.getFocusableChildren(this.iframeRef.nativeElement.contentDocument.body, {
+                    ignoreVisibility: true,
+                    ignoreTabIndex: true,
+                });
+            }
+            if (this._disabled) {
+                this.adapterService.disableEditor(this.id, focusableChildren, this.iframeRef.nativeElement);
+            }
+            else {
+                this.adapterService.enableEditor(this.id, focusableChildren, this.iframeRef.nativeElement);
+            }
+            this.changeDetector.markForCheck();
+        }
+    }
+    get disabled() {
+        return this._disabled;
+    }
+    /**
+     * Specifies the initial styles for all content, including background color, font size, and link state.
+     */
+    set initialStyleState(state) {
+        // Do not update the state after initialization has taken place
+        /* istanbul ignore else */
+        if (!this.initialized) {
+            this._initialStyleState = Object.assign(Object.assign({}, STYLE_STATE_DEFAULTS), state);
+        }
+    }
+    get initialStyleState() {
+        return this._initialStyleState;
+    }
+    /**
+     * Specifies placeholder text to display when the text entry area is empty.
+     */
+    set placeholder(value) {
+        /* istanbul ignore else */
+        if (value !== this._placeholder) {
+            this._placeholder = value;
+            if (this.initialized) {
+                this.adapterService.setPlaceholder(this.id, value);
+            }
+        }
+    }
+    get placeholder() {
+        return this._placeholder;
+    }
+    /**
+     * The internal value of the control.
+     */
+    set value(value) {
+        // Normalize value and set any empty state to an empty string.
+        let normalizedValue = value;
+        if (!value ||
+            value.trim() === '<p></p>' ||
+            value.trim() === '<br>' ||
+            value.trim() === '<p><br></p>') {
+            normalizedValue = '';
+        }
+        normalizedValue = this.sanitizationService.sanitize(normalizedValue).trim();
+        if (this._value !== normalizedValue) {
+            this._value = normalizedValue;
+            // Update angular form control if model has been normalized.
+            /* istanbul ignore else */
+            if (this.ngControl && this.ngControl.control) {
+                /* istanbul ignore else */
+                if (normalizedValue !== this.ngControl.control.value) {
+                    this.ngControl.control.setValue(normalizedValue, {
+                        emitModelToViewChange: false,
+                    });
+                }
+            }
+            // Autofocus isn't testable in Firefox and IE.
+            /* istanbul ignore next */
+            if (this.autofocus && !this.focusInitialized) {
+                this.adapterService.focusEditor(this.id);
+                this.focusInitialized = true;
+            }
+        }
+    }
+    get value() {
+        return this._value;
+    }
+    ngAfterViewInit() {
+        this.initIframe();
+    }
+    ngOnDestroy() {
+        this.adapterService.removeObservers(this.editorService.editors[this.id]);
+        this.editorService.removeEditor(this.id);
+        this.ngUnsubscribe.next();
+        this.ngUnsubscribe.complete();
+    }
+    onIframeLoad() {
+        // Remove editor if it already exists to cover situations where the text editor might have been moved in the DOM.
+        /* istanbul ignore else */
+        if (this.editorService.editors[this.id]) {
+            this.editorService.removeEditor(this.id);
+            this.initIframe();
+        }
+    }
+    /**
+     * Implemented as part of ControlValueAccessor.
+     */
+    writeValue(value) {
+        this.value = value;
+        // Update HTML if necessary.
+        const editorValue = this.adapterService.getEditorInnerHtml(this.id);
+        if (this.initialized && editorValue !== this._value) {
+            this.adapterService.setEditorInnerHtml(this.id, this._value);
+        }
+    }
+    /**
+     * Implemented as part of ControlValueAccessor.
+     */
+    registerOnChange(fn) {
+        this._onChange = fn;
+    }
+    /**
+     * Implemented as part of ControlValueAccessor.
+     */
+    registerOnTouched(fn) {
+        this._onTouched = fn;
+    }
+    /**
+     * Implemented as part of ControlValueAccessor.
+     */
+    setDisabledState(isDisabled) {
+        this.disabled = isDisabled;
+    }
+    updateStyle() {
+        this._initialStyleState = Object.assign(Object.assign({}, this._initialStyleState), this.adapterService.getStyleState(this.id));
+    }
+    initIframe() {
+        this.adapterService.addEditor(this.id, this.iframeRef.nativeElement, this.initialStyleState, this.placeholder);
+        this.editorService
+            .inputListener(this.id)
+            .pipe(takeUntil(this.ngUnsubscribe))
+            .subscribe(() => {
+            // Angular doesn't run change detection for changes originating inside an iframe,
+            // so we have to call the onChange() event inside NgZone to force change propigation to consuming components.
+            this.zone.run(() => {
+                this.ViewToModelUpdate();
+            });
+        });
+        this.editorService
+            .selectionChangeListener(this.id)
+            .pipe(takeUntil(this.ngUnsubscribe))
+            .subscribe(() => {
+            this.updateStyle();
+            this.editorFocusStream.next();
+        });
+        this.editorService
+            .clickListener(this.id)
+            .pipe(takeUntil(this.ngUnsubscribe))
+            .subscribe(() => {
+            this.editorFocusStream.next();
+        });
+        this.editorService
+            .blurListener(this.id)
+            .pipe(takeUntil(this.ngUnsubscribe))
+            .subscribe(() => {
+            // Angular doesn't run change detection for changes originating inside an iframe,
+            // so we have to run markForCheck() inside the NgZone to force change propigation to consuming components.
+            this.zone.run(() => {
+                this._onTouched();
+            });
+        });
+        this.editorService
+            .commandChangeListener(this.id)
+            .pipe(takeUntil(this.ngUnsubscribe))
+            .subscribe(() => {
+            this.updateStyle();
+            this.ViewToModelUpdate();
+        });
+        this.adapterService.setEditorInnerHtml(this.id, this._value);
+        /* istanbul ignore next */
+        if (this.autofocus) {
+            this.adapterService.focusEditor(this.id);
+        }
+        this.initialized = true;
+    }
+    ViewToModelUpdate(emitChange = true) {
+        this.value = this.adapterService.getEditorInnerHtml(this.id);
+        /* istanbul ignore else */
+        if (emitChange) {
+            this._onChange(this._value);
+        }
+    }
+}
+SkyTextEditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyTextEditorComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.SkyCoreAdapterService }, { token: i2.SkyTextEditorAdapterService }, { token: i3.SkyTextEditorService }, { token: i4.SkyTextSanitizationService }, { token: i5.NgControl }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+SkyTextEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: SkyTextEditorComponent, selector: "sky-text-editor", inputs: { autofocus: "autofocus", disabled: "disabled", fontList: "fontList", fontSizeList: "fontSizeList", id: "id", initialStyleState: "initialStyleState", menus: "menus", mergeFields: "mergeFields", placeholder: "placeholder", toolbarActions: "toolbarActions" }, viewQueries: [{ propertyName: "iframeRef", first: true, predicate: ["iframe"], descendants: true }], ngImport: i0, template: "<div class=\"sky-text-editor\">\n  <sky-toolbar class=\"sky-text-editor-toolbar\">\n    <sky-toolbar-section\n      aria-label=\"Text formatting\"\n      class=\"menubar\"\n      role=\"toolbar\"\n    >\n      <sky-text-editor-menubar\n        [disabled]=\"disabled\"\n        [editorFocusStream]=\"editorFocusStream\"\n        [editorId]=\"id\"\n        [menus]=\"menus\"\n        [mergeFields]=\"mergeFields\"\n      >\n      </sky-text-editor-menubar>\n    </sky-toolbar-section>\n    <sky-toolbar-section\n      aria-label=\"Text formatting\"\n      class=\"toolbar\"\n      role=\"toolbar\"\n    >\n      <sky-text-editor-toolbar\n        [disabled]=\"disabled\"\n        [editorFocusStream]=\"editorFocusStream\"\n        [editorId]=\"id\"\n        [fontList]=\"fontList\"\n        [fontSizeList]=\"fontSizeList\"\n        [toolbarActions]=\"toolbarActions\"\n        [styleState]=\"initialStyleState\"\n      >\n      </sky-text-editor-toolbar>\n    </sky-toolbar-section>\n  </sky-toolbar>\n  <iframe\n    class=\"sky-text-editor-wrapper\"\n    src=\"about:blank\"\n    title=\"Text Editor\"\n    [ngClass]=\"{\n      'sky-text-editor-wrapper-disabled': disabled\n    }\"\n    (load)=\"onIframeLoad()\"\n    #iframe\n  >\n  </iframe>\n</div>\n", styles: [".sky-text-editor .sky-text-editor-wrapper{display:flex;flex-wrap:wrap;background-color:#fff;width:100%;height:300px;padding:1rem;font-size:1.2rem;border:1px solid #c0c0c0;overflow-y:auto;outline:none}.sky-text-editor .sky-text-editor-wrapper.sky-text-editor-wrapper-disabled{background-color:#ededee}.sky-text-editor .sky-text-editor-toolbar .sky-toolbar-section{padding:10px 10px 0}.sky-text-editor .sky-text-editor-toolbar .sky-toolbar-sectioned{border-left:1px solid #cdcfd2!important;border-right:1px solid #cdcfd2!important}.sky-text-editor .sky-text-editor-toolbar .sky-toolbar-item{margin:0 20px 10px 0}.sky-text-editor .sky-text-editor-toolbar .sky-dropdown-button{border:none}.sky-text-editor .sky-text-editor-toolbar sky-text-editor-menubar,.sky-text-editor .sky-text-editor-toolbar sky-text-editor-toolbar{display:flex;flex-wrap:wrap}.sky-theme-modern .sky-text-editor .sky-text-editor-wrapper{border:1px solid #d2d2d2}.sky-theme-modern .sky-text-editor .sky-text-editor-wrapper.sky-text-editor-wrapper-disabled{background-color:#ececed}.sky-theme-modern .sky-text-editor .sky-text-editor-toolbar .sky-toolbar{padding:10px 10px 0}.sky-theme-modern .sky-text-editor .sky-text-editor-toolbar .sky-toolbar-section{padding:10px!important}.sky-theme-modern .sky-text-editor .sky-text-editor-toolbar .sky-toolbar-sectioned{border-top:1px solid #d2d2d2!important;border-left:1px solid #d2d2d2!important;border-right:1px solid #d2d2d2!important}.sky-theme-modern .sky-text-editor .sky-text-editor-toolbar .sky-toolbar-item{margin:0 20px 0 0!important}\n"], components: [{ type: i6.λ37, selector: "sky-toolbar" }, { type: i6.λ38, selector: "sky-toolbar-section" }, { type: i7.SkyTextEditorMenubarComponent, selector: "sky-text-editor-menubar", inputs: ["editorFocusStream", "editorId", "menus", "mergeFields", "disabled"] }, { type: i8.SkyTextEditorToolbarComponent, selector: "sky-text-editor-toolbar", inputs: ["editorFocusStream", "editorId", "fontList", "fontSizeList", "toolbarActions", "styleState", "disabled"] }], directives: [{ type: i9.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyTextEditorComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'sky-text-editor',
+                    templateUrl: './text-editor.component.html',
+                    styleUrls: ['./text-editor.component.scss'],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    encapsulation: ViewEncapsulation.None,
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i1.SkyCoreAdapterService }, { type: i2.SkyTextEditorAdapterService }, { type: i3.SkyTextEditorService }, { type: i4.SkyTextSanitizationService }, { type: i5.NgControl }, { type: i0.NgZone }]; }, propDecorators: { autofocus: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], fontList: [{
+                type: Input
+            }], fontSizeList: [{
+                type: Input
+            }], id: [{
+                type: Input
+            }], initialStyleState: [{
+                type: Input
+            }], menus: [{
+                type: Input
+            }], mergeFields: [{
+                type: Input
+            }], placeholder: [{
+                type: Input
+            }], toolbarActions: [{
+                type: Input
+            }], iframeRef: [{
+                type: ViewChild,
+                args: ['iframe']
+            }] } });
+//# sourceMappingURL=text-editor.component.js.map

package/esm2015/lib/modules/text-editor/text-editor.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"text-editor.component.js","sourceRoot":"","sources":["../../../../../../../../libs/components/text-editor/src/lib/modules/text-editor/text-editor.component.ts","../../../../../../../../libs/components/text-editor/src/lib/modules/text-editor/text-editor.component.html"],"names":[],"mappings":"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","sourcesContent":["import {\n  AfterViewInit,\n  ChangeDetectorRef,\n  ChangeDetectionStrategy,\n  Component,\n  ElementRef,\n  Input,\n  NgZone,\n  OnDestroy,\n  ViewChild,\n  ViewEncapsulation,\n} from '@angular/core';\n\nimport { NgControl } from '@angular/forms';\n\nimport { takeUntil } from 'rxjs/operators';\n\nimport { Subject } from 'rxjs';\n\nimport { SkyCoreAdapterService } from '@skyux/core';\n\nimport { MENU_DEFAULTS } from './defaults/menu-defaults';\n\nimport { STYLE_STATE_DEFAULTS } from './defaults/style-state-defaults';\n\nimport { TOOLBAR_ACTION_DEFAULTS } from './defaults/toolbar-action-defaults';\n\nimport { SkyTextEditorAdapterService } from './services/text-editor-adapter.service';\n\nimport { SkyTextEditorService } from './services/text-editor.service';\n\nimport { SkyTextSanitizationService } from './services/text-sanitization.service';\n\nimport { FONT_LIST_DEFAULTS } from './defaults/font-list-defaults';\n\nimport { FONT_SIZE_LIST_DEFAULTS } from './defaults/font-size-list-defaults';\n\nimport { SkyTextEditorFont } from './types/font-state';\n\nimport { SkyTextEditorMenuType } from './types/menu-type';\n\nimport { SkyTextEditorStyleState } from './types/style-state';\n\nimport { SkyTextEditorMergeField } from './types/text-editor-merge-field';\n\nimport { SkyTextEditorToolbarActionType } from './types/toolbar-action-type';\n\nimport { SkyFormsUtility } from '../shared/forms-utility';\n\n/**\n * Auto-incrementing integer used to generate unique ids for radio components.\n */\nlet nextUniqueId = 0;\n\n/**\n * The text editor component lets users format and manipulate text.\n */\n@Component({\n  selector: 'sky-text-editor',\n  templateUrl: './text-editor.component.html',\n  styleUrls: ['./text-editor.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None,\n})\nexport class SkyTextEditorComponent implements AfterViewInit, OnDestroy {\n  /**\n   * Indicates whether to put focus on the editor after it renders.\n   */\n  @Input()\n  public autofocus: boolean = false;\n\n  /**\n   * Indicates whether to disable the text editor.\n   * @default false\n   */\n  @Input()\n  public set disabled(value: boolean) {\n    const coercedValue = SkyFormsUtility.coerceBooleanProperty(value);\n    if (coercedValue !== this.disabled) {\n      this._disabled = coercedValue;\n\n      // Update focusableChildren inside the iframe.\n      let focusableChildren: HTMLElement[];\n      /* istanbul ignore else */\n      if (this.iframeRef) {\n        focusableChildren = this.coreAdapterService.getFocusableChildren(\n          this.iframeRef.nativeElement.contentDocument.body,\n          {\n            ignoreVisibility: true,\n            ignoreTabIndex: true,\n          }\n        );\n      }\n\n      if (this._disabled) {\n        this.adapterService.disableEditor(\n          this.id,\n          focusableChildren,\n          this.iframeRef.nativeElement\n        );\n      } else {\n        this.adapterService.enableEditor(\n          this.id,\n          focusableChildren,\n          this.iframeRef.nativeElement\n        );\n      }\n      this.changeDetector.markForCheck();\n    }\n  }\n\n  public get disabled() {\n    return this._disabled;\n  }\n\n  public editorFocusStream = new Subject();\n\n  /**\n   * Specifies the fonts to include in the font picker.\n   * @default [{name: 'Blackbaud Sans', value: '\"Blackbaud Sans\", Arial, sans-serif'}, {name: 'Arial', value: 'Arial'}, {name: 'Arial Black', value: '\"Arial Black\"'}, {name: 'Courier New', value: '\"Courier New\"'}, {name: 'Georgia', value: 'Georgia, serif'}, {name: 'Tahoma', value: 'Tahoma, Geneva, sans-serif'}, {name: 'Times New Roman', value: '\"Times New Roman\"'}, {name: 'Trebuchet MS', value: '\"Trebuchet MS\", sans-serif'}, {name: 'Verdana', value: 'Verdana, Geneva, sans-serif'}]\n   */\n  @Input()\n  public fontList: SkyTextEditorFont[] = FONT_LIST_DEFAULTS;\n\n  /**\n   * Specifies the font sizes to include in the font size picker.\n   * @default [6, 8, 9, 10, 11, 12, 13, 14, 15, 16, 18, 20, 22, 24, 26, 28, 36, 48]\n   */\n  @Input()\n  public fontSizeList: number[] = FONT_SIZE_LIST_DEFAULTS;\n\n  /**\n   * Specifies a unique ID attribute for the text editor.\n   * By default, the component generates a random ID.\n   */\n  @Input()\n  public id = `sky-text-editor-${++nextUniqueId}`;\n\n  /**\n   * Specifies the initial styles for all content, including background color, font size, and link state.\n   */\n  @Input()\n  public set initialStyleState(state: SkyTextEditorStyleState) {\n    // Do not update the state after initialization has taken place\n    /* istanbul ignore else */\n    if (!this.initialized) {\n      this._initialStyleState = {\n        ...STYLE_STATE_DEFAULTS,\n        ...state,\n      };\n    }\n  }\n\n  public get initialStyleState(): SkyTextEditorStyleState {\n    return this._initialStyleState;\n  }\n\n  /**\n   * Specifies the menus to include in the menu bar.\n   * @default [ 'edit', 'format' ]\n   */\n  @Input()\n  public menus: SkyTextEditorMenuType[] = MENU_DEFAULTS;\n\n  /**\n   * Specifies the merge fields to include in the merge field menu.\n   */\n  @Input()\n  public mergeFields: SkyTextEditorMergeField[] = [];\n\n  /**\n   * Specifies placeholder text to display when the text entry area is empty.\n   */\n  @Input()\n  public set placeholder(value: string) {\n    /* istanbul ignore else */\n    if (value !== this._placeholder) {\n      this._placeholder = value;\n      if (this.initialized) {\n        this.adapterService.setPlaceholder(this.id, value);\n      }\n    }\n  }\n\n  public get placeholder(): string {\n    return this._placeholder;\n  }\n\n  /**\n   * Specifies the actions to include in the toolbar and determines their order.\n   * @default [ 'font-family', 'font-size', 'font-style', 'color', 'list', 'link ]\n   */\n  @Input()\n  public toolbarActions: SkyTextEditorToolbarActionType[] = TOOLBAR_ACTION_DEFAULTS;\n\n  /**\n   * The internal value of the control.\n   */\n  public set value(value: string) {\n    // Normalize value and set any empty state to an empty string.\n    let normalizedValue: string = value;\n    if (\n      !value ||\n      value.trim() === '<p></p>' ||\n      value.trim() === '<br>' ||\n      value.trim() === '<p><br></p>'\n    ) {\n      normalizedValue = '';\n    }\n    normalizedValue = this.sanitizationService.sanitize(normalizedValue).trim();\n\n    if (this._value !== normalizedValue) {\n      this._value = normalizedValue;\n\n      // Update angular form control if model has been normalized.\n      /* istanbul ignore else */\n      if (this.ngControl && this.ngControl.control) {\n        /* istanbul ignore else */\n        if (normalizedValue !== this.ngControl.control.value) {\n          this.ngControl.control.setValue(normalizedValue, {\n            emitModelToViewChange: false,\n          });\n        }\n      }\n\n      // Autofocus isn't testable in Firefox and IE.\n      /* istanbul ignore next */\n      if (this.autofocus && !this.focusInitialized) {\n        this.adapterService.focusEditor(this.id);\n        this.focusInitialized = true;\n      }\n    }\n  }\n\n  public get value(): string {\n    return this._value;\n  }\n\n  private focusInitialized: boolean = false;\n\n  @ViewChild('iframe')\n  private iframeRef: ElementRef;\n\n  private initialized: boolean = false;\n\n  private ngUnsubscribe = new Subject<void>();\n\n  private _disabled: boolean = false;\n\n  private _initialStyleState = Object.assign({}, STYLE_STATE_DEFAULTS);\n\n  private _placeholder = '';\n\n  private _value: string = '<p></p>';\n\n  constructor(\n    private changeDetector: ChangeDetectorRef,\n    private coreAdapterService: SkyCoreAdapterService,\n    private adapterService: SkyTextEditorAdapterService,\n    private editorService: SkyTextEditorService,\n    private sanitizationService: SkyTextSanitizationService,\n    private ngControl: NgControl,\n    private zone: NgZone\n  ) {\n    this.ngControl.valueAccessor = this;\n  }\n\n  public ngAfterViewInit(): void {\n    this.initIframe();\n  }\n\n  public ngOnDestroy(): void {\n    this.adapterService.removeObservers(this.editorService.editors[this.id]);\n    this.editorService.removeEditor(this.id);\n    this.ngUnsubscribe.next();\n    this.ngUnsubscribe.complete();\n  }\n\n  public onIframeLoad(): void {\n    // Remove editor if it already exists to cover situations where the text editor might have been moved in the DOM.\n    /* istanbul ignore else */\n    if (this.editorService.editors[this.id]) {\n      this.editorService.removeEditor(this.id);\n      this.initIframe();\n    }\n  }\n\n  /**\n   * Implemented as part of ControlValueAccessor.\n   */\n  public writeValue(value: string): void {\n    this.value = value;\n\n    // Update HTML if necessary.\n    const editorValue = this.adapterService.getEditorInnerHtml(this.id);\n    if (this.initialized && editorValue !== this._value) {\n      this.adapterService.setEditorInnerHtml(this.id, this._value);\n    }\n  }\n\n  /**\n   * Implemented as part of ControlValueAccessor.\n   */\n  public registerOnChange(fn: (value: any) => void): void {\n    this._onChange = fn;\n  }\n\n  /**\n   * Implemented as part of ControlValueAccessor.\n   */\n  public registerOnTouched(fn: () => void): void {\n    this._onTouched = fn;\n  }\n\n  /**\n   * Implemented as part of ControlValueAccessor.\n   */\n  public setDisabledState(isDisabled: boolean): void {\n    this.disabled = isDisabled;\n  }\n\n  private updateStyle(): void {\n    this._initialStyleState = {\n      ...this._initialStyleState,\n      ...(this.adapterService.getStyleState(this.id) as any),\n    };\n  }\n\n  private initIframe(): void {\n    this.adapterService.addEditor(\n      this.id,\n      this.iframeRef.nativeElement,\n      this.initialStyleState,\n      this.placeholder\n    );\n\n    this.editorService\n      .inputListener(this.id)\n      .pipe(takeUntil(this.ngUnsubscribe))\n      .subscribe(() => {\n        // Angular doesn't run change detection for changes originating inside an iframe,\n        // so we have to call the onChange() event inside NgZone to force change propigation to consuming components.\n        this.zone.run(() => {\n          this.ViewToModelUpdate();\n        });\n      });\n\n    this.editorService\n      .selectionChangeListener(this.id)\n      .pipe(takeUntil(this.ngUnsubscribe))\n      .subscribe(() => {\n        this.updateStyle();\n        this.editorFocusStream.next();\n      });\n\n    this.editorService\n      .clickListener(this.id)\n      .pipe(takeUntil(this.ngUnsubscribe))\n      .subscribe(() => {\n        this.editorFocusStream.next();\n      });\n\n    this.editorService\n      .blurListener(this.id)\n      .pipe(takeUntil(this.ngUnsubscribe))\n      .subscribe(() => {\n        // Angular doesn't run change detection for changes originating inside an iframe,\n        // so we have to run markForCheck() inside the NgZone to force change propigation to consuming components.\n        this.zone.run(() => {\n          this._onTouched();\n        });\n      });\n\n    this.editorService\n      .commandChangeListener(this.id)\n      .pipe(takeUntil(this.ngUnsubscribe))\n      .subscribe(() => {\n        this.updateStyle();\n        this.ViewToModelUpdate();\n      });\n\n    this.adapterService.setEditorInnerHtml(this.id, this._value);\n\n    /* istanbul ignore next */\n    if (this.autofocus) {\n      this.adapterService.focusEditor(this.id);\n    }\n\n    this.initialized = true;\n  }\n\n  private ViewToModelUpdate(emitChange: boolean = true): void {\n    this.value = this.adapterService.getEditorInnerHtml(this.id);\n    /* istanbul ignore else */\n    if (emitChange) {\n      this._onChange(this._value);\n    }\n  }\n\n  /* istanbul ignore next */\n  private _onTouched = () => {};\n\n  /* istanbul ignore next */\n  private _onChange: (value: any) => void = () => {};\n}\n","<div class=\"sky-text-editor\">\n  <sky-toolbar class=\"sky-text-editor-toolbar\">\n    <sky-toolbar-section\n      aria-label=\"Text formatting\"\n      class=\"menubar\"\n      role=\"toolbar\"\n    >\n      <sky-text-editor-menubar\n        [disabled]=\"disabled\"\n        [editorFocusStream]=\"editorFocusStream\"\n        [editorId]=\"id\"\n        [menus]=\"menus\"\n        [mergeFields]=\"mergeFields\"\n      >\n      </sky-text-editor-menubar>\n    </sky-toolbar-section>\n    <sky-toolbar-section\n      aria-label=\"Text formatting\"\n      class=\"toolbar\"\n      role=\"toolbar\"\n    >\n      <sky-text-editor-toolbar\n        [disabled]=\"disabled\"\n        [editorFocusStream]=\"editorFocusStream\"\n        [editorId]=\"id\"\n        [fontList]=\"fontList\"\n        [fontSizeList]=\"fontSizeList\"\n        [toolbarActions]=\"toolbarActions\"\n        [styleState]=\"initialStyleState\"\n      >\n      </sky-text-editor-toolbar>\n    </sky-toolbar-section>\n  </sky-toolbar>\n  <iframe\n    class=\"sky-text-editor-wrapper\"\n    src=\"about:blank\"\n    title=\"Text Editor\"\n    [ngClass]=\"{\n      'sky-text-editor-wrapper-disabled': disabled\n    }\"\n    (load)=\"onIframeLoad()\"\n    #iframe\n  >\n  </iframe>\n</div>\n"]}

package/esm2015/lib/modules/text-editor/text-editor.module.js

@@ -0,0 +1,99 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { SkyColorpickerModule } from '@skyux/colorpicker';
+import { SkyCoreAdapterModule, SkyIdModule } from '@skyux/core';
+import { SkyCheckboxModule, SkyInputBoxModule } from '@skyux/forms';
+import { SkyModalModule } from '@skyux/modals';
+import { SkyI18nModule } from '@skyux/i18n';
+import { SkyIconModule } from '@skyux/indicators';
+import { SkyToolbarModule } from '@skyux/layout';
+import { SkyDropdownModule } from '@skyux/popovers';
+import { SkyTabsModule } from '@skyux/tabs';
+import { SkyThemeModule } from '@skyux/theme';
+import { SkyTextEditorResourcesModule } from '../../modules/shared/sky-text-editor-resources.module';
+import { SkyTextEditorMenubarComponent } from './menubar/text-editor-menubar.component';
+import { SkyTextEditorToolbarComponent } from './toolbar/text-editor-toolbar.component';
+import { SkyTextEditorUrlModalComponent } from './url-modal/text-editor-url-modal.component';
+import { SkyTextEditorComponent } from './text-editor.component';
+import * as i0 from "@angular/core";
+export class SkyTextEditorModule {
+}
+SkyTextEditorModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyTextEditorModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+SkyTextEditorModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyTextEditorModule, declarations: [SkyTextEditorComponent,
+        SkyTextEditorUrlModalComponent,
+        SkyTextEditorToolbarComponent,
+        SkyTextEditorMenubarComponent], imports: [CommonModule,
+        FormsModule,
+        ReactiveFormsModule,
+        SkyCoreAdapterModule,
+        SkyTextEditorResourcesModule,
+        SkyI18nModule,
+        SkyIconModule,
+        SkyIdModule,
+        SkyInputBoxModule,
+        SkyColorpickerModule,
+        SkyCheckboxModule,
+        SkyDropdownModule,
+        SkyModalModule,
+        SkyTabsModule,
+        SkyThemeModule,
+        SkyToolbarModule], exports: [SkyTextEditorComponent,
+        SkyTextEditorUrlModalComponent,
+        SkyTextEditorToolbarComponent,
+        SkyTextEditorMenubarComponent] });
+SkyTextEditorModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyTextEditorModule, imports: [[
+            CommonModule,
+            FormsModule,
+            ReactiveFormsModule,
+            SkyCoreAdapterModule,
+            SkyTextEditorResourcesModule,
+            SkyI18nModule,
+            SkyIconModule,
+            SkyIdModule,
+            SkyInputBoxModule,
+            SkyColorpickerModule,
+            SkyCheckboxModule,
+            SkyDropdownModule,
+            SkyModalModule,
+            SkyTabsModule,
+            SkyThemeModule,
+            SkyToolbarModule,
+        ]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyTextEditorModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [
+                        CommonModule,
+                        FormsModule,
+                        ReactiveFormsModule,
+                        SkyCoreAdapterModule,
+                        SkyTextEditorResourcesModule,
+                        SkyI18nModule,
+                        SkyIconModule,
+                        SkyIdModule,
+                        SkyInputBoxModule,
+                        SkyColorpickerModule,
+                        SkyCheckboxModule,
+                        SkyDropdownModule,
+                        SkyModalModule,
+                        SkyTabsModule,
+                        SkyThemeModule,
+                        SkyToolbarModule,
+                    ],
+                    exports: [
+                        SkyTextEditorComponent,
+                        SkyTextEditorUrlModalComponent,
+                        SkyTextEditorToolbarComponent,
+                        SkyTextEditorMenubarComponent,
+                    ],
+                    declarations: [
+                        SkyTextEditorComponent,
+                        SkyTextEditorUrlModalComponent,
+                        SkyTextEditorToolbarComponent,
+                        SkyTextEditorMenubarComponent,
+                    ],
+                    entryComponents: [SkyTextEditorUrlModalComponent],
+                }]
+        }] });
+//# sourceMappingURL=text-editor.module.js.map

package/esm2015/lib/modules/text-editor/text-editor.module.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"text-editor.module.js","sourceRoot":"","sources":["../../../../../../../../libs/components/text-editor/src/lib/modules/text-editor/text-editor.module.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAEzC,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAE/C,OAAO,EAAE,WAAW,EAAE,mBAAmB,EAAE,MAAM,gBAAgB,CAAC;AAElE,OAAO,EAAE,oBAAoB,EAAE,MAAM,oBAAoB,CAAC;AAE1D,OAAO,EAAE,oBAAoB,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAEhE,OAAO,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;AAEpE,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAE/C,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAE5C,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAElD,OAAO,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AAEjD,OAAO,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AAEpD,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAE5C,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAE9C,OAAO,EAAE,4BAA4B,EAAE,MAAM,uDAAuD,CAAC;AAErG,OAAO,EAAE,6BAA6B,EAAE,MAAM,yCAAyC,CAAC;AAExF,OAAO,EAAE,6BAA6B,EAAE,MAAM,yCAAyC,CAAC;AAExF,OAAO,EAAE,8BAA8B,EAAE,MAAM,6CAA6C,CAAC;AAE7F,OAAO,EAAE,sBAAsB,EAAE,MAAM,yBAAyB,CAAC;;AAmCjE,MAAM,OAAO,mBAAmB;;iHAAnB,mBAAmB;kHAAnB,mBAAmB,iBAP5B,sBAAsB;QACtB,8BAA8B;QAC9B,6BAA6B;QAC7B,6BAA6B,aA3B7B,YAAY;QACZ,WAAW;QACX,mBAAmB;QACnB,oBAAoB;QACpB,4BAA4B;QAC5B,aAAa;QACb,aAAa;QACb,WAAW;QACX,iBAAiB;QACjB,oBAAoB;QACpB,iBAAiB;QACjB,iBAAiB;QACjB,cAAc;QACd,aAAa;QACb,cAAc;QACd,gBAAgB,aAGhB,sBAAsB;QACtB,8BAA8B;QAC9B,6BAA6B;QAC7B,6BAA6B;kHAUpB,mBAAmB,YAhCrB;YACP,YAAY;YACZ,WAAW;YACX,mBAAmB;YACnB,oBAAoB;YACpB,4BAA4B;YAC5B,aAAa;YACb,aAAa;YACb,WAAW;YACX,iBAAiB;YACjB,oBAAoB;YACpB,iBAAiB;YACjB,iBAAiB;YACjB,cAAc;YACd,aAAa;YACb,cAAc;YACd,gBAAgB;SACjB;4FAeU,mBAAmB;kBAjC/B,QAAQ;mBAAC;oBACR,OAAO,EAAE;wBACP,YAAY;wBACZ,WAAW;wBACX,mBAAmB;wBACnB,oBAAoB;wBACpB,4BAA4B;wBAC5B,aAAa;wBACb,aAAa;wBACb,WAAW;wBACX,iBAAiB;wBACjB,oBAAoB;wBACpB,iBAAiB;wBACjB,iBAAiB;wBACjB,cAAc;wBACd,aAAa;wBACb,cAAc;wBACd,gBAAgB;qBACjB;oBACD,OAAO,EAAE;wBACP,sBAAsB;wBACtB,8BAA8B;wBAC9B,6BAA6B;wBAC7B,6BAA6B;qBAC9B;oBACD,YAAY,EAAE;wBACZ,sBAAsB;wBACtB,8BAA8B;wBAC9B,6BAA6B;wBAC7B,6BAA6B;qBAC9B;oBACD,eAAe,EAAE,CAAC,8BAA8B,CAAC;iBAClD","sourcesContent":["import { NgModule } from '@angular/core';\n\nimport { CommonModule } from '@angular/common';\n\nimport { FormsModule, ReactiveFormsModule } from '@angular/forms';\n\nimport { SkyColorpickerModule } from '@skyux/colorpicker';\n\nimport { SkyCoreAdapterModule, SkyIdModule } from '@skyux/core';\n\nimport { SkyCheckboxModule, SkyInputBoxModule } from '@skyux/forms';\n\nimport { SkyModalModule } from '@skyux/modals';\n\nimport { SkyI18nModule } from '@skyux/i18n';\n\nimport { SkyIconModule } from '@skyux/indicators';\n\nimport { SkyToolbarModule } from '@skyux/layout';\n\nimport { SkyDropdownModule } from '@skyux/popovers';\n\nimport { SkyTabsModule } from '@skyux/tabs';\n\nimport { SkyThemeModule } from '@skyux/theme';\n\nimport { SkyTextEditorResourcesModule } from '../../modules/shared/sky-text-editor-resources.module';\n\nimport { SkyTextEditorMenubarComponent } from './menubar/text-editor-menubar.component';\n\nimport { SkyTextEditorToolbarComponent } from './toolbar/text-editor-toolbar.component';\n\nimport { SkyTextEditorUrlModalComponent } from './url-modal/text-editor-url-modal.component';\n\nimport { SkyTextEditorComponent } from './text-editor.component';\n\n@NgModule({\n  imports: [\n    CommonModule,\n    FormsModule,\n    ReactiveFormsModule,\n    SkyCoreAdapterModule,\n    SkyTextEditorResourcesModule,\n    SkyI18nModule,\n    SkyIconModule,\n    SkyIdModule,\n    SkyInputBoxModule,\n    SkyColorpickerModule,\n    SkyCheckboxModule,\n    SkyDropdownModule,\n    SkyModalModule,\n    SkyTabsModule,\n    SkyThemeModule,\n    SkyToolbarModule,\n  ],\n  exports: [\n    SkyTextEditorComponent,\n    SkyTextEditorUrlModalComponent,\n    SkyTextEditorToolbarComponent,\n    SkyTextEditorMenubarComponent,\n  ],\n  declarations: [\n    SkyTextEditorComponent,\n    SkyTextEditorUrlModalComponent,\n    SkyTextEditorToolbarComponent,\n    SkyTextEditorMenubarComponent,\n  ],\n  entryComponents: [SkyTextEditorUrlModalComponent],\n})\nexport class SkyTextEditorModule {}\n"]}