@datorama/core 22.0.4 → 22.0.6-rc.1

package/fesm2015/datorama-core.js

@@ -6633,6 +6633,108 @@ const defaultClientSearchStrategy = (searchIn, searchValue, labelKey) => {
     return false;
 };
 
+/**
+ * @license
+ * Copyright Datorama. All Rights Reserved.
+ *
+ * Use of this source code is governed by an Apache License 2.0 license that can be
+ * found in the LICENSE file at https://github.com/datorama/client-core/blob/master/LICENSE
+ */
+let DatoSortableComponent = class DatoSortableComponent {
+    constructor() {
+        this.list = [];
+        this.noop = noop;
+        /**
+         * Sortablejs options
+         */
+        this.datoOptions = {};
+        /**
+         * Fired once items order has changed
+         */
+        this.orderUpdated = new EventEmitter();
+        this.defaultOptions = {
+            handle: '.dato-sortable-handler',
+            ghostClass: 'dato-sortable-ghost',
+            chosenClass: 'dato-sortable-chosen',
+            dragClass: 'dato-sortable-drag'
+        };
+    }
+    set datoList(list) {
+        const isArr = Array.isArray(list);
+        const validInput = isArr || (list instanceof FormControl && Array.isArray(list.value));
+        if (!validInput) {
+            throw new Error(`DatoSortable - datoList expected array or form control but got ${typeof list}`);
+        }
+        if (!isArr) {
+            this.formControl = list;
+            this.list = [...this.formControl.value];
+        }
+        else {
+            this.list = list;
+        }
+    }
+    ngOnInit() {
+        const _a = this.datoOptions, { dynamicGhostHeight, hasStaticItems } = _a, sortableOptions = __rest(_a, ["dynamicGhostHeight", "hasStaticItems"]);
+        const mergedOptions = Object.assign(Object.assign(Object.assign({}, this.defaultOptions), sortableOptions), { onUpdate: event => (sortableOptions.onUpdate ? sortableOptions.onUpdate(event) : this.emitUpdate(event)) });
+        if (dynamicGhostHeight) {
+            mergedOptions.onStart = event => this.setGhostHeight(event);
+        }
+        if (hasStaticItems) {
+            mergedOptions.onMove = event => {
+                if (event.related.classList.contains('dato-sortable-static-item')) {
+                    return false;
+                }
+                return sortableOptions.onMove ? sortableOptions.onMove(event) : true;
+            };
+        }
+        this.mergedOptions = mergedOptions;
+    }
+    emitUpdate(event) {
+        if (this.formControl) {
+            this.formControl.setValue(this.list);
+        }
+        this.orderUpdated.emit(event);
+    }
+    setGhostHeight(event) {
+        const originalEl = event.from.children[event.oldIndex];
+        setStyle(originalEl, 'display', 'block');
+        const { height } = originalEl.getBoundingClientRect();
+        setStyle(originalEl, 'display', 'none');
+        const ghostEl = query('.dato-sortable-ghost');
+        setStyle(ghostEl, 'height', `${height}px`);
+    }
+};
+__decorate([
+    ContentChildren(DatoAccordionGroupComponent),
+    __metadata("design:type", QueryList)
+], DatoSortableComponent.prototype, "accordionGroups", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Object),
+    __metadata("design:paramtypes", [Object])
+], DatoSortableComponent.prototype, "datoList", null);
+__decorate([
+    Input(),
+    __metadata("design:type", Object)
+], DatoSortableComponent.prototype, "datoOptions", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", String)
+], DatoSortableComponent.prototype, "containerClass", void 0);
+__decorate([
+    Output(),
+    __metadata("design:type", Object)
+], DatoSortableComponent.prototype, "orderUpdated", void 0);
+DatoSortableComponent = __decorate([
+    Component({
+        selector: 'dato-sortable',
+        template: "<section [sortablejs]=\"list\" [sortablejsOptions]=\"mergedOptions\" [ngClass]=\"containerClass\"\n         (update.stop)=\"noop()\" (add.stop)=\"noop()\" (sort.stop)=\"noop()\" (remove.stop)=\"noop()\"\n         (filter.stop)=\"noop()\" (change.stop)=\"noop()\" (drag.stop)=\"noop()\">\n  <ng-content></ng-content>\n</section>",
+        changeDetection: ChangeDetectionStrategy.OnPush,
+        encapsulation: ViewEncapsulation.None,
+        styles: ["dato-sortable{display:inline-block}dato-sortable .dato-sortable-handler{cursor:move;cursor:-webkit-grabbing}.dato-sortable-ghost>*{display:none!important}.dato-sortable-drag{box-shadow:0 2px 14px 0 rgba(0,0,0,.2)}"]
+    })
+], DatoSortableComponent);
+
 /**
  * @license
  * Copyright Datorama. All Rights Reserved.
@@ -6674,6 +6776,9 @@ let DatoAccordionComponent = DatoAccordionComponent_1 = class DatoAccordionCompo
             }
         }
     }
+    get groups() {
+        return this.sortable && this.sortable.accordionGroups.length > 0 ? this.sortable.accordionGroups : this.childGroups;
+    }
     ngOnChanges(changes) {
         if (changes.expandAll && !changes.expandAll.firstChange) {
             this.setExpandAll();
@@ -6845,11 +6950,15 @@ DatoAccordionComponent.ctorParameters = () => [
 __decorate([
     ContentChildren(DatoAccordionGroupComponent),
     __metadata("design:type", QueryList)
-], DatoAccordionComponent.prototype, "groups", void 0);
+], DatoAccordionComponent.prototype, "childGroups", void 0);
 __decorate([
     ContentChildren(DatoAccordionComponent_1, { descendants: true }),
     __metadata("design:type", QueryList)
 ], DatoAccordionComponent.prototype, "childAccordion", void 0);
+__decorate([
+    ContentChild(DatoSortableComponent, { static: true }),
+    __metadata("design:type", DatoSortableComponent)
+], DatoAccordionComponent.prototype, "sortable", void 0);
 __decorate([
     Input(),
     __metadata("design:type", Object)
@@ -7495,9 +7604,8 @@ let DatoSelectComponent = class DatoSelectComponent extends BaseCustomControl {
     writeValue(activeOptions) {
         this._model = activeOptions ? coerceArray$1(activeOptions) : [];
         if (this.options) {
-            const overTheLimit = this.limitSelectedTo && this.isMulti && this._model.length >= this.limitSelectedTo;
             this.markAsActive(this._model, { deselectAll: true });
-            overTheLimit && this.updateDisabledState();
+            this.limitSelectedTo && this.updateDisabledState();
         }
         /** For later updates */
         this.cdr.markForCheck();
@@ -7533,7 +7641,7 @@ let DatoSelectComponent = class DatoSelectComponent extends BaseCustomControl {
          */
         if (this.hasValue && this._initialOpen) {
             this.markAsActive(this._model);
-            if (this.limitSelectedTo && this._model.length === this.limitSelectedTo) {
+            if (this.limitSelectedTo) {
                 this.updateDisabledState();
             }
             this._initialOpen = false;
@@ -7592,15 +7700,14 @@ let DatoSelectComponent = class DatoSelectComponent extends BaseCustomControl {
             }
         }
         this.onChange(this._model);
-        this.datoOverlay.scheduleUpdate();
         this.cdr.markForCheck();
+        this.asyncUpdateDropdownPosition();
     }
     reorderOptions(newOrder) {
         this._model = newOrder;
         this.onChange(this._model);
     }
     removeOption(option) {
-        const updateDisabled = this.limitSelectedTo && this._model.length === this.limitSelectedTo;
         this._model = this._model.filter(current => current[this.idKey] !== option[this.idKey]);
         const optionToRemove = this.options.find(datoOption => datoOption.option && datoOption.option[this.idKey] === option[this.idKey]);
         /**
@@ -7610,12 +7717,10 @@ let DatoSelectComponent = class DatoSelectComponent extends BaseCustomControl {
         if (optionToRemove) {
             optionToRemove.active = false;
         }
-        updateDisabled && this.updateDisabledState();
+        this.limitSelectedTo && this.updateDisabledState();
         this.onChange(this._model);
         this.cdr.markForCheck();
-        if (this.datoOverlay.attached) {
-            this.datoOverlay.scheduleUpdate();
-        }
+        this.asyncUpdateDropdownPosition();
     }
     preventBodyScroll(event) {
         if (isArrowUpDown(event)) {
@@ -7812,7 +7917,7 @@ let DatoSelectComponent = class DatoSelectComponent extends BaseCustomControl {
                     this.searchTerm = value;
                     this.keyManager.setActiveItem(-1);
                     this.cdr.markForCheck();
-                    this.datoOverlay && this.datoOverlay.scheduleUpdate();
+                    this.asyncUpdateDropdownPosition();
                 });
     }
     /**
@@ -7886,9 +7991,6 @@ let DatoSelectComponent = class DatoSelectComponent extends BaseCustomControl {
         if (!datoOption) {
             return;
         }
-        const modelLength = this._model.length;
-        const updateDisabled = this.limitSelectedTo &&
-            (modelLength === this.limitSelectedTo || (modelLength === this.limitSelectedTo - 1 && !datoOption.active));
         datoOption.active = !datoOption.active;
         const rawOption = datoOption.option;
         if (datoOption.active) {
@@ -7897,10 +7999,10 @@ let DatoSelectComponent = class DatoSelectComponent extends BaseCustomControl {
         else {
             this._model = this._model.filter(current => current[this.idKey] !== rawOption[this.idKey]);
         }
-        updateDisabled && this.updateDisabledState();
+        this.limitSelectedTo && this.updateDisabledState();
         this.onChange(this._model);
         this.cdr.markForCheck();
-        this.datoOverlay.scheduleUpdate();
+        this.asyncUpdateDropdownPosition();
     }
     activateInfiniteScroll() {
         this.infiniteSubscription = fromEvent(document.querySelector('.dato-select__dropdown'), 'scroll')
@@ -7941,6 +8043,13 @@ let DatoSelectComponent = class DatoSelectComponent extends BaseCustomControl {
             }
         }
     }
+    // Make sure the overlay will be update AFTER Change Detection was done
+    // So the items in the input (and its height) is update
+    asyncUpdateDropdownPosition() {
+        if (this.datoOverlay && this.datoOverlay.attached) {
+            setTimeout(() => this.datoOverlay.scheduleUpdate(), 0);
+        }
+    }
 };
 DatoSelectComponent.ctorParameters = () => [
     { type: ChangeDetectorRef },
@@ -8850,104 +8959,6 @@ DatoOptionsModule = __decorate([
     })
 ], DatoOptionsModule);
 
-/**
- * @license
- * Copyright Datorama. All Rights Reserved.
- *
- * Use of this source code is governed by an Apache License 2.0 license that can be
- * found in the LICENSE file at https://github.com/datorama/client-core/blob/master/LICENSE
- */
-let DatoSortableComponent = class DatoSortableComponent {
-    constructor() {
-        this.list = [];
-        this.noop = noop;
-        /**
-         * Sortablejs options
-         */
-        this.datoOptions = {};
-        /**
-         * Fired once items order has changed
-         */
-        this.orderUpdated = new EventEmitter();
-        this.defaultOptions = {
-            handle: '.dato-sortable-handler',
-            ghostClass: 'dato-sortable-ghost',
-            chosenClass: 'dato-sortable-chosen',
-            dragClass: 'dato-sortable-drag'
-        };
-    }
-    set datoList(list) {
-        const isArr = Array.isArray(list);
-        const validInput = isArr || (list instanceof FormControl && Array.isArray(list.value));
-        if (!validInput) {
-            throw new Error(`DatoSortable - datoList expected array or form control but got ${typeof list}`);
-        }
-        if (!isArr) {
-            this.formControl = list;
-            this.list = [...this.formControl.value];
-        }
-        else {
-            this.list = list;
-        }
-    }
-    ngOnInit() {
-        const _a = this.datoOptions, { dynamicGhostHeight, hasStaticItems } = _a, sortableOptions = __rest(_a, ["dynamicGhostHeight", "hasStaticItems"]);
-        const mergedOptions = Object.assign(Object.assign(Object.assign({}, this.defaultOptions), sortableOptions), { onUpdate: event => (sortableOptions.onUpdate ? sortableOptions.onUpdate(event) : this.emitUpdate(event)) });
-        if (dynamicGhostHeight) {
-            mergedOptions.onStart = event => this.setGhostHeight(event);
-        }
-        if (hasStaticItems) {
-            mergedOptions.onMove = event => {
-                if (event.related.classList.contains('dato-sortable-static-item')) {
-                    return false;
-                }
-                return sortableOptions.onMove ? sortableOptions.onMove(event) : true;
-            };
-        }
-        this.mergedOptions = mergedOptions;
-    }
-    emitUpdate(event) {
-        if (this.formControl) {
-            this.formControl.setValue(this.list);
-        }
-        this.orderUpdated.emit(event);
-    }
-    setGhostHeight(event) {
-        const originalEl = event.from.children[event.oldIndex];
-        setStyle(originalEl, 'display', 'block');
-        const { height } = originalEl.getBoundingClientRect();
-        setStyle(originalEl, 'display', 'none');
-        const ghostEl = query('.dato-sortable-ghost');
-        setStyle(ghostEl, 'height', `${height}px`);
-    }
-};
-__decorate([
-    Input(),
-    __metadata("design:type", Object),
-    __metadata("design:paramtypes", [Object])
-], DatoSortableComponent.prototype, "datoList", null);
-__decorate([
-    Input(),
-    __metadata("design:type", Object)
-], DatoSortableComponent.prototype, "datoOptions", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", String)
-], DatoSortableComponent.prototype, "containerClass", void 0);
-__decorate([
-    Output(),
-    __metadata("design:type", Object)
-], DatoSortableComponent.prototype, "orderUpdated", void 0);
-DatoSortableComponent = __decorate([
-    Component({
-        selector: 'dato-sortable',
-        template: "<section [sortablejs]=\"list\" [sortablejsOptions]=\"mergedOptions\" [ngClass]=\"containerClass\"\n         (update.stop)=\"noop()\" (add.stop)=\"noop()\" (sort.stop)=\"noop()\" (remove.stop)=\"noop()\"\n         (filter.stop)=\"noop()\" (change.stop)=\"noop()\" (drag.stop)=\"noop()\">\n  <ng-content></ng-content>\n</section>",
-        changeDetection: ChangeDetectionStrategy.OnPush,
-        encapsulation: ViewEncapsulation.None,
-        styles: ["dato-sortable{display:inline-block}dato-sortable .dato-sortable-handler{cursor:move;cursor:-webkit-grabbing}.dato-sortable-ghost>*{display:none!important}.dato-sortable-drag{box-shadow:0 2px 14px 0 rgba(0,0,0,.2)}"]
-    })
-], DatoSortableComponent);
-
 /**
  * @license
  * Copyright Datorama. All Rights Reserved.
@@ -10259,6 +10270,8 @@ var DatoFilterConditions;
     DatoFilterConditions["NOT_IN_LIST"] = "NOT_IN_LIST";
     DatoFilterConditions["IS_EMPTY"] = "IS_EMPTY";
     DatoFilterConditions["NOT_EMPTY"] = "NOT_EMPTY";
+    DatoFilterConditions["IS_NULL"] = "IS_NULL";
+    DatoFilterConditions["NOT_NULL"] = "NOT_NULL";
 })(DatoFilterConditions || (DatoFilterConditions = {}));
 const DatoGridDateFilterOptions = [
     DatoFilterConditions.IN_RANGE,
@@ -10339,8 +10352,10 @@ function validateNumberCondition(unparsedRowValue, { condition, value, rangeEnd
         case DatoFilterConditions.IN_RANGE:
             return rowValue >= filterValue && rowValue <= parseFloat(rangeEnd);
         case DatoFilterConditions.IS_EMPTY:
+        case DatoFilterConditions.IS_NULL:
             return isNil(rowValue);
         case DatoFilterConditions.NOT_EMPTY:
+        case DatoFilterConditions.NOT_NULL:
             return !isNil(rowValue);
     }
 }
@@ -10487,7 +10502,7 @@ function toolbarActionToContextAction(params) {
     return contextActions;
 }
 
-const DATO_GRID_STORAGE_API = new InjectionToken('DATO_GRID_STORAGE_API');
+const DATO_GRID_STORAGE_API = new InjectionToken('DATO_GRID_STORAGE_AP');
 
 const defaultEditableColumnRenderer = params => params && params.value ? `<div class="value-wrapper ellipsis">${params.value}</div>` : null;
 const editableCellRendererWithSearchHighlight = (params, searchTerm) => {
@@ -11216,10 +11231,11 @@ let DatoGridFilterComponent = class DatoGridFilterComponent {
     }
     ngOnInit() {
         const { gridService, gridQuery } = this.popover.data;
-        const { filter, filtersConfig = {}, pivotValueColumn, pivotKeys } = this.colDef;
+        const { filter, pivotValueColumn, pivotKeys } = this.colDef;
         const colDefs = gridQuery.api.columns.getAllColumns().map(column => column.getColDef());
         this.colField = getColField(this.colDef);
         const colDef = colDefs.find(colDef => colDef.field === this.colField);
+        const filtersConfig = colDef.filtersConfig || this.colDef.filtersConfig || {};
         const colFilter = filter || colDef.filter;
         const filterOptions = DatoGridFilterOptionsMap[colFilter];
         this.pivotColumn = gridQuery.api.columns.getSecondaryPivotColumn(pivotKeys, pivotValueColumn);
@@ -11241,7 +11257,11 @@ let DatoGridFilterComponent = class DatoGridFilterComponent {
         if (this.filterSections.Conditional) {
             let filterConditions = filterOptions || DatoGridStringFilterOptions;
             if (filtersConfig.showEmptyConditions) {
-                filterConditions = [...filterConditions, DatoFilterConditions.IS_EMPTY, DatoFilterConditions.NOT_EMPTY];
+                let emptyConditions = [DatoFilterConditions.IS_EMPTY, DatoFilterConditions.NOT_EMPTY];
+                if (this.filterType === DatoGridFilterTypes.Number) {
+                    emptyConditions = [DatoFilterConditions.IS_NULL, DatoFilterConditions.NOT_NULL];
+                }
+                filterConditions = [...filterConditions, ...emptyConditions];
             }
             this.conditionalFilterOptions = filterConditions.map((operand, id) => ({
                 id,
@@ -11604,7 +11624,10 @@ let DatoGridFilterComponent = class DatoGridFilterComponent {
         valueControl.updateValueAndValidity();
     }
     isEmptyOperand(operand) {
-        return operand === DatoFilterConditions.IS_EMPTY || operand === DatoFilterConditions.NOT_EMPTY;
+        return (operand === DatoFilterConditions.IS_EMPTY ||
+            operand === DatoFilterConditions.NOT_EMPTY ||
+            operand === DatoFilterConditions.IS_NULL ||
+            operand === DatoFilterConditions.NOT_NULL);
     }
     isStringArray(value) {
         return isString(value[0]);
@@ -12730,7 +12753,8 @@ let GridService = class GridService {
         this.updateSettings({ gridAlignment, columnsSizes: null });
     }
     saveSettingsToServer(settings) {
-        this.storageAPI.set(this.gridName, settings);
+        const isGlobal = this.gridQuery.getGridOptions().isGlobalSettings;
+        this.storageAPI.set(this.gridName, settings, isGlobal);
     }
     /**
      * @internal used to log grid events to the platform's logging service
@@ -13091,6 +13115,13 @@ let GridService = class GridService {
                         column
                     };
                 }
+                if (condition === DatoFilterConditions.IS_NULL || condition === DatoFilterConditions.NOT_NULL) {
+                    return {
+                        condition: DatoFilterConditions.IS_NULL,
+                        value: condition === DatoFilterConditions.IS_NULL ? 'true' : 'false',
+                        column
+                    };
+                }
                 return Object.assign(Object.assign({}, item), { column });
             })
         };
@@ -13632,13 +13663,21 @@ let DatoGridControllerComponent = class DatoGridControllerComponent {
             .pipe(switchMap(() => {
             this.gridOptions = this.normalizeOptions();
             agGrid.gridOptions = this.gridOptions;
-            const settingsLoader = this.gridOptions.saveSettings === false ? of(null) : this.storageAPI.get(this.gridOptions.gridName);
+            const isGlobal = this.gridOptions.isGlobalSettings;
+            const settingsLoader = this.gridOptions.saveSettings === false
+                ? of(null)
+                : this.storageAPI.get(this.gridOptions.gridName, isGlobal);
             return combineLatest([agGrid.gridReady, settingsLoader]);
         }), untilDestroyed(this))
             .subscribe(([{ api, columnApi }, savedSettings = {}]) => {
             if (!this.gridOptions.rowData) {
                 api.showLoadingOverlay();
             }
+            if (!this.gridOptions.statusBar) {
+                /** Fix ag-grid bug that doesn't add ag-hidden class to the status bar, which only get fixed in later versions */
+                const el = agGridEl.querySelector('.ag-status-bar');
+                addClass(el, 'ag-hidden');
+            }
             const gridApi = { grid: api, columns: columnApi };
             this.gridService._setApi(gridApi, agGrid);
             this.gridQuery._setApi(gridApi, agGrid);
@@ -14750,6 +14789,12 @@ let DatoGridV2ToolbarComponent = class DatoGridV2ToolbarComponent {
         this.registerGroupListeners();
         this.subscribeRowsSelectionData();
     }
+    getCellValueChangeEvent() {
+        return this.gridController.gridQuery.waitForGrid(() => this.gridQuery.gridRef.cellValueChanged.pipe(debounceTime(100), untilDestroyed(this)));
+    }
+    getRowDataUpdatedEvent() {
+        return this.gridController.gridQuery.waitForGrid(() => this.gridQuery.gridRef.rowDataUpdated.pipe(debounceTime(100), untilDestroyed(this)));
+    }
     onActionClick(action) {
         if (isFunction(action.onClick)) {
             const selectedRowsCount = this.gridController.gridQuery.getSelectedRowsCount();
@@ -18817,6 +18862,39 @@ DatoEditableHeaderModule = __decorate([
  * found in the LICENSE file at https://github.com/datorama/client-core/blob/master/LICENSE
  */
 
+let RichTextService = class RichTextService {
+    constructor(http, config) {
+        this.http = http;
+        this.config = config;
+    }
+    getLib(appendScriptFunc, appendStyleFunc) {
+        if (!this.richTextScript$) {
+            this.initLib(appendScriptFunc, appendStyleFunc);
+        }
+        return this.richTextScript$;
+    }
+    initLib(appendScriptFunc, appendStyleFunc) {
+        this.richTextScript$ = combineLatest([
+            this.http
+                .get(`${this.config.paths.richText}/index.js`, { responseType: 'text' })
+                .pipe(tap(lib => appendScriptFunc(lib, 'rich-text-editor'))),
+            this.http
+                .get(`${this.config.paths.richText}/plugins/autocomplete/plugin.css`, { responseType: 'text' })
+                .pipe(tap(style => appendStyleFunc(style, 'tinymce-autocomplete')))
+        ]).pipe(shareReplay(1));
+    }
+};
+RichTextService.ctorParameters = () => [
+    { type: HttpClient },
+    { type: undefined, decorators: [{ type: Inject, args: [DATO_CORE_CONFIG,] }] }
+];
+RichTextService.ɵprov = ɵɵdefineInjectable({ factory: function RichTextService_Factory() { return new RichTextService(ɵɵinject(HttpClient), ɵɵinject(DATO_CORE_CONFIG)); }, token: RichTextService, providedIn: "root" });
+RichTextService = __decorate([
+    Injectable({ providedIn: 'root' }),
+    __param(1, Inject(DATO_CORE_CONFIG)),
+    __metadata("design:paramtypes", [HttpClient, Object])
+], RichTextService);
+
 /**
  * @license
  * Copyright Datorama. All Rights Reserved.
@@ -18830,12 +18908,12 @@ const getTinymce = () => {
 };
 const ɵ0$3 = getTinymce;
 let DatoRichTextDirective = DatoRichTextDirective_1 = class DatoRichTextDirective extends BaseCustomControl {
-    constructor(ngZone, http, host, config) {
+    constructor(ngZone, richTextService, config, host) {
         super();
         this.ngZone = ngZone;
-        this.http = http;
-        this.host = host;
+        this.richTextService = richTextService;
         this.config = config;
+        this.host = host;
         this.autocompleteOptions = {};
         this.forcePlainTextPasting = false;
         this.format = 'html';
@@ -18862,28 +18940,11 @@ let DatoRichTextDirective = DatoRichTextDirective_1 = class DatoRichTextDirectiv
             base: this.config.paths.richText,
             query: ''
         };
-        /**
-         * We support only one instance in load time
-         */
-        if (window.tinymce) {
+        this.richTextService
+            .getLib(appendScript, appendStyle)
+            .pipe(untilDestroyed(this))
+            .subscribe(() => {
             this.init.call(this);
-        }
-        else {
-            this.loadLib().subscribe(lib => {
-                appendScript(lib, 'rich-text-editor');
-                this.init.call(this);
-                this.loadAutoCompleteStyle();
-            });
-        }
-    }
-    loadLib() {
-        return this.http.get(`${this.config.paths.richText}/index.js`, { responseType: 'text' });
-    }
-    loadAutoCompleteStyle() {
-        this.http
-            .get(`${this.config.paths.richText}/plugins/autocomplete/plugin.css`, { responseType: 'text' })
-            .subscribe(style => {
-            appendStyle(style, 'tinymce-autocomplete');
         });
     }
     initEditor(_, editor) {
@@ -18984,9 +19045,9 @@ let DatoRichTextDirective = DatoRichTextDirective_1 = class DatoRichTextDirectiv
 };
 DatoRichTextDirective.ctorParameters = () => [
     { type: NgZone },
-    { type: HttpClient },
-    { type: ElementRef },
-    { type: undefined, decorators: [{ type: Inject, args: [DATO_CORE_CONFIG,] }] }
+    { type: RichTextService },
+    { type: undefined, decorators: [{ type: Inject, args: [DATO_CORE_CONFIG,] }] },
+    { type: ElementRef }
 ];
 __decorate([
     Input(),
@@ -19052,10 +19113,9 @@ DatoRichTextDirective = DatoRichTextDirective_1 = __decorate([
             }
         ]
     }),
-    __param(3, Inject(DATO_CORE_CONFIG)),
+    __param(2, Inject(DATO_CORE_CONFIG)),
     __metadata("design:paramtypes", [NgZone,
-        HttpClient,
-        ElementRef, Object])
+        RichTextService, Object, ElementRef])
 ], DatoRichTextDirective);
 
 /**
@@ -21336,7 +21396,9 @@ let DatoBreadcrumbsComponent = class DatoBreadcrumbsComponent {
         this._breadcrumbs = [...start, ...dots, ...end];
     }
     initEditableHeader() {
-        this.headerControl.valueChanges.pipe(debounceTime(300), untilDestroyed(this)).subscribe((res) => {
+        this.headerControl.valueChanges
+            .pipe(debounceTime(300), untilDestroyed(this))
+            .subscribe((res) => {
             this.updateEditableText.emit(res);
             this.cdr.detectChanges();
         });
@@ -22601,7 +22663,7 @@ function fixNgLeaks() {
     };
 }
 
-window.coreVersion = '22.0.4';
+window.coreVersion = '22.1.5-rc.';
 
 /**
  * @license
@@ -22615,5 +22677,5 @@ window.coreVersion = '22.0.4';
  * Generated bundle index. Do not edit.
  */
 
-export { APP_TRANSLATE, AceService, BaseCustomControl, COMPARE_RESULT, CUSTOM_RANGE_ID, ColorPalette, ConfirmationType, ContentRef, ContentType, CustomHeaderControllerService, DATE_PICKER_CONFIG, DATE_PICKER_POPOVER_ID, DATO_CORE_LOGGER, DATO_FORM_ERRORS, DATO_GRID_STORAGE_API, DEFAULT_FORMAT, DEFAULT_GRID_SEARCH_DEBOUNCE_TIME, DatePickerConfig, DatePickerMonthComponent, DateType, DatoAccordionComponent, DatoAccordionContentComponent, DatoAccordionGroupComponent, DatoAccordionHeaderComponent, DatoAccordionModule, DatoAceDirective, DatoAceDraggableDirective, DatoAceModule, DatoActionType, DatoAutoCompleteContentDirective, DatoAutoFocusDirective, DatoAutocompleteComponent, DatoAutocompleteDirective, DatoAutocompleteModule, DatoBreadcrumbsComponent, DatoBreadcrumbsModule, DatoButtonComponent, DatoButtonGroupComponent, DatoButtonGroupModule, DatoButtonModule, DatoCamelCasePipe, DatoCarouselComponent, DatoCarouselItemDirective, DatoCarouselItemElement, DatoCarouselModule, DatoCheckboxComponent, DatoCheckboxModule, DatoClipboardDirective, DatoColorDirective, DatoConfirmationDialogComponent, DatoControlErrorComponent, DatoControlErrorContainerDirective, DatoControlErrorsDirective, DatoCoreError, DatoCoreModule, DatoCustomHeaderTemplateComponent, DatoCustomHeaderTemplateDirective, DatoCustomMoreMenuTemplateDirective, DatoDatePickerContainerComponent, DatoDatePickerModule, DatoDatePickerRangeComponent, DatoDatePickerSingleComponent, DatoDialog, DatoDialogCloseDirective, DatoDialogComponent, DatoDialogContentComponent, DatoDialogDismissDirective, DatoDialogFooterComponent, DatoDialogHeaderComponent, DatoDialogModule, DatoDialogRef, DatoDirectivesModule, DatoDisableControlDirective, DatoDraggableDirective, DatoDynamicContentComponent, DatoDynamicContentModule, DatoEditableHeaderComponent, DatoEditableHeaderModule, DatoFileInputComponent, DatoFileInputDefaultComponent, DatoFileInputModule, DatoFilterConditions, DatoFontDirective, DatoFontIconComponent, DatoFontIconModule, DatoFormSubmitDirective, DatoFormValidationModule, DatoGrid, DatoGridAPI, DatoGridAvatarCellComponent, DatoGridColumnDisplayMenuComponent, DatoGridColumnHeaderComponent, DatoGridColumnHeaderMoreMenuComponent, DatoGridColumnTypes, DatoGridComponent, DatoGridControllerComponent, DatoGridDateFilterOptions, DatoGridFilterComponent, DatoGridFilterOptionsMap, DatoGridFilterSections, DatoGridFilterTypes, DatoGridGroupsMenuComponent, DatoGridHeaderComponent, DatoGridHeaderV2Component, DatoGridInitialsCellComponent, DatoGridItemsCellComponent, DatoGridModule, DatoGridMoreMenuActions, DatoGridNumberFilterOptions, DatoGridOnHoverComponent, DatoGridPaginationComponent, DatoGridPaginationV2Component, DatoGridStatusCellComponent, DatoGridStringFilterOptions, DatoGridToolbarComponent, DatoGridToolbarItemDirective, DatoGridToolbarItemElementDirective, DatoGridV2Component, DatoGridV2LoaderComponent, DatoGridV2Module, DatoGridV2NoDataOverlayComponent, DatoGridV2ToolbarButtonComponent, DatoGridV2ToolbarComponent, DatoGroupComponent, DatoHighlightPipe, DatoHotkeys, DatoHotkeysDirective, DatoHotkeysHelpComponent, DatoHotkeysModule, DatoIconButtonComponent, DatoIconButtonModule, DatoIconComponent, DatoIconModule, DatoInfiniteScrollComponent, DatoInfiniteScrollModule, DatoInputComponent, DatoInputModule, DatoInputNumberComponent, DatoInputNumberDirective, DatoInputNumberModule, DatoKebabCasePipe, DatoLinkButtonComponent, DatoLinkButtonModule, DatoListComponent, DatoListModule, DatoListNoDataComponent, DatoListNoResultComponent, DatoListV2Component, DatoListV2Module, DatoLoaderComponent, DatoLoadersModule, DatoMenuComponent, DatoMenuContentDirective, DatoMenuItemDirective, DatoMenuModule, DatoMenuTriggerForDirective, DatoMultiOptionComponent, DatoMultiOptionV2Component, DatoOperatorTogglerComponent, DatoOperatorTogglerModule, DatoOptionComponent, DatoOptionV2Component, DatoOptionsModule, DatoOriginDirective, DatoOverlay, DatoPageLoaderComponent, DatoPanel, DatoPanelComponent, DatoPanelContentComponent, DatoPanelFooterComponent, DatoPanelHeaderComponent, DatoPanelInternalConfig, DatoPanelModule, DatoPanelRef, DatoPillsComponent, DatoPillsModule, DatoPipesModule, DatoPopover, DatoPopoverComponent, DatoPopoverModule, DatoProgressBarComponent, DatoProgressBarModule, DatoRadioComponent, DatoRadioModule, DatoRichTextDirective, DatoRichTextModule, DatoSearchResultsGroupSortPipe, DatoSearchResultsSortPipe, DatoSearchableContainerComponent, DatoSearchableDirective, DatoSearchableHighlightDirective, DatoSearchableModule, DatoSelectActiveDirective, DatoSelectComponent, DatoSelectEmptyComponent, DatoSelectModule, DatoSliderComponent, DatoSliderModule, DatoSnackbar, DatoSnackbarComponent, DatoSnackbarModule, DatoSortableComponent, DatoSortableHandleDirective, DatoSortableModule, DatoStaticImageSrcDirective, DatoStaticImagesSrcModule, DatoSubscribeContext, DatoSubscribeDirective, DatoTab, DatoTabContent, DatoTabTitle, DatoTabsModule, DatoTabset, DatoTemplatePortal, DatoTextModule, DatoThemesModule, DatoToast, DatoToastComponent, DatoToastModule, DatoTogglerComponent, DatoTogglerModule, DatoTooltipDirective, DatoTooltipV2Directive, DatoTrackByPropPipe, DatoTranslateService, DatoTreePipe, DatoTriggerMulti, DatoTriggerSingle, DialogConfig, DialogResultStatus, Dimensions, EventModifiersPlugin, GridActionType, GridMinWidths, GridRowSelectionType, GridToolbarService, ISO_FORMAT, IconRegistry, KeyCodes, KeyboardEventKeys, ListValueTypes, MockService, OperatorTypes, POPPER_BOUNDARY, PaletteDirective, PanelResultCloseTrigger, PillType, PopoverCloseDirective, PopoverContentDirective, PopoverRef, PopoverTrigger, ROOT_NODE_ID, RelativeDateType, RenderMethod, RowSelectionType, RowSelectionTypeV2, SELECT_MAX_HEIGHT, SUPPORTED_LOCALES, SelectType, SnackbarRef, SnackbarType, Store, SvgRegistry, ToolbarActionType, ToolbarArea, ToolbarConfirmation, ToolbarDeleteConfirmation, ToolbarHandler, TranslatePipe, Types, _valueChanges, a, addClass, addJSObjectCompletor, allowedFileTypes, alphabeticalGroupSort, alphabeticalSort, appendChild, appendScript, appendStyle, appendToBody, assertString, camelCase, capitalize, cloneDeep, closest, coerceArray, coerceElement, compareWith, compose, convertFromTreeData, convertToTreeData, copyToClipboard, createComponent, createElement, createGUID, createHTMLCompletor, curry, dateCompare, daysOfTheMonth, debounce, declarations$2 as declarations, deepEqual, deepmerge, defaultActions$1 as defaultActions, defaultConfig, defaultEditableColumnRenderer, defaultGridOptions, defaultGridTreeLabel, defaultOptionsDisplayLimit, defaultTreeOptions, dialogSizePreset, diff, difference, differenceBy, dimensionsChanges, directives, drop, editableCellRendererWithSearchHighlight, escape, escapeRegExp, filter, filterByControlValue, filterByTerm, filterDialogDismissed, filterDialogSuccess, filterGroupByControlValue, filterGroupByTerm, filterKey, find, findIndex, findKey, fixNgLeaks, forEach, formatKeys, generateMonths, get, getAttr, getCustomRange, getDateISOString, getDefaultConfirmationOptions, getDefaultOptions, getDefaultsToastOptions, getElementCoords, getFunctionName, getGridConfiguration, getGridModel, getInitials, getLocalizedFormat, getMultiTemplate, getOptionTemplate, getPopperDefaults, getUTCDate, getVisibleActions, gridTreeFilePathKey, groupBy, groupSortOrder, has, inView, intersection, invert, isArrayValuesEqual, isArrowUpDown, isBoolean, isEmpty, isEmptyString, isEnter, isEqual, isEscape, isFraction, isFunction, isMacintosh, isNil, isNumber, isObject, isRangeCondition, isRangeCustom, isString, isTestEnv, isValidMediaLink, kebabCase, keyBy, keysSymbols, last, map, mapKeys, mapValues, maxFileSize, merge, minBy, mockInDev, mocks, ngContentResolver, noop, normalizeData, omit, omitBy, optionalDebounce, pallete, parseDateString, partial, polling, prependChild, publicApi$1 as publicApi, query, queryAll, random, rawDiff, reject, relativeDateTypes, removeClass, resolveRange, round, searchHighlightCellRenderer, searchResultsGroupSort, searchResultsSort, setAttr, setAttribute, setDimensions, setEmptyFolderClass, setGridConfiguration, setGridModel, setMaxDimensions, setMinDimensions, setStyle, setStyles, size, sortBy, stubs, supportedLocales, tapLog, tapOnce, throttle, toBoolean, toFormData, toNumber, toResponseBody, toString, toggleClass, toolbarActionToContextAction, tryParsePivotValue, unescape, union, uniq, uniqBy, uploadProgress, validBase64Image, validUrl, validateCondition, validateDate, validateDateCondition, validateFilter, validateNumberCondition, validateRange, validateStringCondition, values, workerMap, zoneStable, ɵ0$2 as ɵ0, ɵ1$2 as ɵ1, ɵ2, DATO_CORE_CONFIG as ɵb, DatoGridHelper as ɵc, Popper as ɵd, GridQuery as ɵe, GridStore as ɵf, GridService as ɵg, DatoDateRangesFilterPipe as ɵh, ListStore as ɵi, DatoListSelectAllComponent as ɵj, DatoGridMultiSelectColumnHeaderComponent as ɵk, DatoGridItemsCountCellComponent as ɵl, DatoGridV2ToolbarMoreMenuComponent as ɵm, DatoGridSearchBarComponent as ɵn };
+export { APP_TRANSLATE, AceService, BaseCustomControl, COMPARE_RESULT, CUSTOM_RANGE_ID, ColorPalette, ConfirmationType, ContentRef, ContentType, CustomHeaderControllerService, DATE_PICKER_CONFIG, DATE_PICKER_POPOVER_ID, DATO_CORE_LOGGER, DATO_FORM_ERRORS, DATO_GRID_STORAGE_API, DEFAULT_FORMAT, DEFAULT_GRID_SEARCH_DEBOUNCE_TIME, DatePickerConfig, DatePickerMonthComponent, DateType, DatoAccordionComponent, DatoAccordionContentComponent, DatoAccordionGroupComponent, DatoAccordionHeaderComponent, DatoAccordionModule, DatoAceDirective, DatoAceDraggableDirective, DatoAceModule, DatoActionType, DatoAutoCompleteContentDirective, DatoAutoFocusDirective, DatoAutocompleteComponent, DatoAutocompleteDirective, DatoAutocompleteModule, DatoBreadcrumbsComponent, DatoBreadcrumbsModule, DatoButtonComponent, DatoButtonGroupComponent, DatoButtonGroupModule, DatoButtonModule, DatoCamelCasePipe, DatoCarouselComponent, DatoCarouselItemDirective, DatoCarouselItemElement, DatoCarouselModule, DatoCheckboxComponent, DatoCheckboxModule, DatoClipboardDirective, DatoColorDirective, DatoConfirmationDialogComponent, DatoControlErrorComponent, DatoControlErrorContainerDirective, DatoControlErrorsDirective, DatoCoreError, DatoCoreModule, DatoCustomHeaderTemplateComponent, DatoCustomHeaderTemplateDirective, DatoCustomMoreMenuTemplateDirective, DatoDatePickerContainerComponent, DatoDatePickerModule, DatoDatePickerRangeComponent, DatoDatePickerSingleComponent, DatoDialog, DatoDialogCloseDirective, DatoDialogComponent, DatoDialogContentComponent, DatoDialogDismissDirective, DatoDialogFooterComponent, DatoDialogHeaderComponent, DatoDialogModule, DatoDialogRef, DatoDirectivesModule, DatoDisableControlDirective, DatoDraggableDirective, DatoDynamicContentComponent, DatoDynamicContentModule, DatoEditableHeaderComponent, DatoEditableHeaderModule, DatoFileInputComponent, DatoFileInputDefaultComponent, DatoFileInputModule, DatoFilterConditions, DatoFontDirective, DatoFontIconComponent, DatoFontIconModule, DatoFormSubmitDirective, DatoFormValidationModule, DatoGrid, DatoGridAPI, DatoGridAvatarCellComponent, DatoGridColumnDisplayMenuComponent, DatoGridColumnHeaderComponent, DatoGridColumnHeaderMoreMenuComponent, DatoGridColumnTypes, DatoGridComponent, DatoGridControllerComponent, DatoGridDateFilterOptions, DatoGridFilterComponent, DatoGridFilterOptionsMap, DatoGridFilterSections, DatoGridFilterTypes, DatoGridGroupsMenuComponent, DatoGridHeaderComponent, DatoGridHeaderV2Component, DatoGridInitialsCellComponent, DatoGridItemsCellComponent, DatoGridModule, DatoGridMoreMenuActions, DatoGridNumberFilterOptions, DatoGridOnHoverComponent, DatoGridPaginationComponent, DatoGridPaginationV2Component, DatoGridStatusCellComponent, DatoGridStringFilterOptions, DatoGridToolbarComponent, DatoGridToolbarItemDirective, DatoGridToolbarItemElementDirective, DatoGridV2Component, DatoGridV2LoaderComponent, DatoGridV2Module, DatoGridV2NoDataOverlayComponent, DatoGridV2ToolbarButtonComponent, DatoGridV2ToolbarComponent, DatoGroupComponent, DatoHighlightPipe, DatoHotkeys, DatoHotkeysDirective, DatoHotkeysHelpComponent, DatoHotkeysModule, DatoIconButtonComponent, DatoIconButtonModule, DatoIconComponent, DatoIconModule, DatoInfiniteScrollComponent, DatoInfiniteScrollModule, DatoInputComponent, DatoInputModule, DatoInputNumberComponent, DatoInputNumberDirective, DatoInputNumberModule, DatoKebabCasePipe, DatoLinkButtonComponent, DatoLinkButtonModule, DatoListComponent, DatoListModule, DatoListNoDataComponent, DatoListNoResultComponent, DatoListV2Component, DatoListV2Module, DatoLoaderComponent, DatoLoadersModule, DatoMenuComponent, DatoMenuContentDirective, DatoMenuItemDirective, DatoMenuModule, DatoMenuTriggerForDirective, DatoMultiOptionComponent, DatoMultiOptionV2Component, DatoOperatorTogglerComponent, DatoOperatorTogglerModule, DatoOptionComponent, DatoOptionV2Component, DatoOptionsModule, DatoOriginDirective, DatoOverlay, DatoPageLoaderComponent, DatoPanel, DatoPanelComponent, DatoPanelContentComponent, DatoPanelFooterComponent, DatoPanelHeaderComponent, DatoPanelInternalConfig, DatoPanelModule, DatoPanelRef, DatoPillsComponent, DatoPillsModule, DatoPipesModule, DatoPopover, DatoPopoverComponent, DatoPopoverModule, DatoProgressBarComponent, DatoProgressBarModule, DatoRadioComponent, DatoRadioModule, DatoRichTextDirective, DatoRichTextModule, DatoSearchResultsGroupSortPipe, DatoSearchResultsSortPipe, DatoSearchableContainerComponent, DatoSearchableDirective, DatoSearchableHighlightDirective, DatoSearchableModule, DatoSelectActiveDirective, DatoSelectComponent, DatoSelectEmptyComponent, DatoSelectModule, DatoSliderComponent, DatoSliderModule, DatoSnackbar, DatoSnackbarComponent, DatoSnackbarModule, DatoSortableComponent, DatoSortableHandleDirective, DatoSortableModule, DatoStaticImageSrcDirective, DatoStaticImagesSrcModule, DatoSubscribeContext, DatoSubscribeDirective, DatoTab, DatoTabContent, DatoTabTitle, DatoTabsModule, DatoTabset, DatoTemplatePortal, DatoTextModule, DatoThemesModule, DatoToast, DatoToastComponent, DatoToastModule, DatoTogglerComponent, DatoTogglerModule, DatoTooltipDirective, DatoTooltipV2Directive, DatoTrackByPropPipe, DatoTranslateService, DatoTreePipe, DatoTriggerMulti, DatoTriggerSingle, DialogConfig, DialogResultStatus, Dimensions, EventModifiersPlugin, GridActionType, GridMinWidths, GridRowSelectionType, GridToolbarService, ISO_FORMAT, IconRegistry, KeyCodes, KeyboardEventKeys, ListValueTypes, MockService, OperatorTypes, POPPER_BOUNDARY, PaletteDirective, PanelResultCloseTrigger, PillType, PopoverCloseDirective, PopoverContentDirective, PopoverRef, PopoverTrigger, ROOT_NODE_ID, RelativeDateType, RenderMethod, RowSelectionType, RowSelectionTypeV2, SELECT_MAX_HEIGHT, SUPPORTED_LOCALES, SelectType, SnackbarRef, SnackbarType, Store, SvgRegistry, ToolbarActionType, ToolbarArea, ToolbarConfirmation, ToolbarDeleteConfirmation, ToolbarHandler, TranslatePipe, Types, _valueChanges, a, addClass, addJSObjectCompletor, allowedFileTypes, alphabeticalGroupSort, alphabeticalSort, appendChild, appendScript, appendStyle, appendToBody, assertString, camelCase, capitalize, cloneDeep, closest, coerceArray, coerceElement, compareWith, compose, convertFromTreeData, convertToTreeData, copyToClipboard, createComponent, createElement, createGUID, createHTMLCompletor, curry, dateCompare, daysOfTheMonth, debounce, declarations$2 as declarations, deepEqual, deepmerge, defaultActions$1 as defaultActions, defaultConfig, defaultEditableColumnRenderer, defaultGridOptions, defaultGridTreeLabel, defaultOptionsDisplayLimit, defaultTreeOptions, dialogSizePreset, diff, difference, differenceBy, dimensionsChanges, directives, drop, editableCellRendererWithSearchHighlight, escape, escapeRegExp, filter, filterByControlValue, filterByTerm, filterDialogDismissed, filterDialogSuccess, filterGroupByControlValue, filterGroupByTerm, filterKey, find, findIndex, findKey, fixNgLeaks, forEach, formatKeys, generateMonths, get, getAttr, getCustomRange, getDateISOString, getDefaultConfirmationOptions, getDefaultOptions, getDefaultsToastOptions, getElementCoords, getFunctionName, getGridConfiguration, getGridModel, getInitials, getLocalizedFormat, getMultiTemplate, getOptionTemplate, getPopperDefaults, getUTCDate, getVisibleActions, gridTreeFilePathKey, groupBy, groupSortOrder, has, inView, intersection, invert, isArrayValuesEqual, isArrowUpDown, isBoolean, isEmpty, isEmptyString, isEnter, isEqual, isEscape, isFraction, isFunction, isMacintosh, isNil, isNumber, isObject, isRangeCondition, isRangeCustom, isString, isTestEnv, isValidMediaLink, kebabCase, keyBy, keysSymbols, last, map, mapKeys, mapValues, maxFileSize, merge, minBy, mockInDev, mocks, ngContentResolver, noop, normalizeData, omit, omitBy, optionalDebounce, pallete, parseDateString, partial, polling, prependChild, publicApi$1 as publicApi, query, queryAll, random, rawDiff, reject, relativeDateTypes, removeClass, resolveRange, round, searchHighlightCellRenderer, searchResultsGroupSort, searchResultsSort, setAttr, setAttribute, setDimensions, setEmptyFolderClass, setGridConfiguration, setGridModel, setMaxDimensions, setMinDimensions, setStyle, setStyles, size, sortBy, stubs, supportedLocales, tapLog, tapOnce, throttle, toBoolean, toFormData, toNumber, toResponseBody, toString, toggleClass, toolbarActionToContextAction, tryParsePivotValue, unescape, union, uniq, uniqBy, uploadProgress, validBase64Image, validUrl, validateCondition, validateDate, validateDateCondition, validateFilter, validateNumberCondition, validateRange, validateStringCondition, values, workerMap, zoneStable, ɵ0$2 as ɵ0, ɵ1$2 as ɵ1, ɵ2, DATO_CORE_CONFIG as ɵb, DatoGridHelper as ɵc, Popper as ɵd, GridQuery as ɵe, GridStore as ɵf, GridService as ɵg, DatoDateRangesFilterPipe as ɵh, ListStore as ɵi, DatoListSelectAllComponent as ɵj, DatoGridMultiSelectColumnHeaderComponent as ɵk, DatoGridItemsCountCellComponent as ɵl, DatoGridV2ToolbarMoreMenuComponent as ɵm, DatoGridSearchBarComponent as ɵn, RichTextService as ɵo };
 //# sourceMappingURL=datorama-core.js.map