@datorama/core 22.12.1 → 22.12.3-rc.1

package/bundles/datorama-core.umd.js

@@ -8833,9 +8833,8 @@
         DatoSelectComponent.prototype.writeValue = function (activeOptions) {
             this._model = activeOptions ? akita.coerceArray(activeOptions) : [];
             if (this.options) {
-                var 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();
@@ -8963,7 +8962,6 @@
         };
         DatoSelectComponent.prototype.removeOption = function (option) {
             var _this = this;
-            var updateDisabled = this.limitSelectedTo && this._model.length === this.limitSelectedTo;
             this._model = this._model.filter(function (current) { return current[_this.idKey] !== option[_this.idKey]; });
             var optionToRemove = this.options.find(function (datoOption) { return datoOption.option && datoOption.option[_this.idKey] === option[_this.idKey]; });
             /**
@@ -8973,7 +8971,7 @@
             if (optionToRemove) {
                 optionToRemove.active = false;
             }
-            updateDisabled && this.updateDisabledState();
+            this.limitSelectedTo && this.updateDisabledState();
             this.onChange(this._model);
             this.cdr.markForCheck();
             this.asyncUpdateDropdownPosition();
@@ -9321,9 +9319,6 @@
             if (!datoOption) {
                 return;
             }
-            var modelLength = this._model.length;
-            var updateDisabled = this.limitSelectedTo &&
-                (modelLength === this.limitSelectedTo || (modelLength === this.limitSelectedTo - 1 && !datoOption.active));
             datoOption.active = !datoOption.active;
             var rawOption = datoOption.option;
             if (datoOption.active) {
@@ -9332,7 +9327,7 @@
             else {
                 this._model = this._model.filter(function (current) { return current[_this.idKey] !== rawOption[_this.idKey]; });
             }
-            updateDisabled && this.updateDisabledState();
+            this.limitSelectedTo && this.updateDisabledState();
             this.onChange(this._model);
             this.cdr.markForCheck();
             this.asyncUpdateDropdownPosition();
@@ -12065,7 +12060,7 @@
         return contextActions;
     }
 
-    var DATO_GRID_STORAGE_API = new core.InjectionToken('DATO_GRID_STORAGE_API');
+    var DATO_GRID_STORAGE_API = new core.InjectionToken('DATO_GRID_STORAGE_AP');
 
     var defaultEditableColumnRenderer = function (params) {
         return params && params.value ? "<div class=\"value-wrapper ellipsis\">" + params.value + "</div>" : null;
@@ -13580,6 +13575,7 @@
             this.showFilter = colDef.filter !== exports.DatoGridFilterTypes.None;
             this.showMoreMenu = isNil(colDef.moreMenuActions) || colDef.moreMenuActions.length > 0;
             this.field = getColField(colDef);
+            this.headerTooltip = this.getHeaderTooltip(colDef);
             this.context = {
                 api: {
                     grid: params.api,
@@ -13662,6 +13658,19 @@
             });
         };
         DatoGridColumnHeaderComponent.prototype.ngOnDestroy = function () { };
+        DatoGridColumnHeaderComponent.prototype.getHeaderTooltip = function (initialColDef) {
+            if (this.params) {
+                var colDef_1 = initialColDef;
+                if (colDef_1.showRowGroup) {
+                    var rowGroupColumns = this.params.columnApi.getRowGroupColumns();
+                    var rowGroupColumn = rowGroupColumns && rowGroupColumns.find(function (col) { return col.getColId() === colDef_1.showRowGroup; });
+                    var rowGroupColDef = rowGroupColumn && rowGroupColumn.getColDef();
+                    colDef_1 = rowGroupColDef || colDef_1;
+                }
+                return colDef_1.customHeaderTooltip || colDef_1.headerName;
+            }
+            return '';
+        };
         DatoGridColumnHeaderComponent.ctorParameters = function () { return [
             { type: core.ViewContainerRef },
             { type: CustomHeaderControllerService },
@@ -13671,7 +13680,7 @@
         DatoGridColumnHeaderComponent = __decorate([
             core.Component({
                 selector: 'dato-grid-column-header',
-                template: "<div class=\"d-flex align-start-center\" [attr.data-auto-id]=\"field + '-column-header'\" [attr.data-field]=\"field\">\n    <ng-container *ngIf=\"customTemplates && customTemplates.customHeader as customHeader\">\n        <div class=\"mr-5\" [attr.data-auto-id]=\"field + '-dynamic-section'\">\n            <ng-container *ngTemplateOutlet=\"customHeader; context: context\"></ng-container>\n        </div>\n    </ng-container>\n    <div class=\"d-flex d-flex-grow align-start-center min-width-0 items-center\">\n        <span class=\"dato-simple-bold primary-400-color ellipsis min-width-0 mr-5\" [datoTooltip]=\"headerName\"\n              datoTooltipPosition=\"bottom\">{{headerName}}</span>\n        <div>\n            <dato-icon class=\"primary-300-color\" *ngIf=\"headerInfo\" [datoTooltip]=\"headerInfo\" datoTooltipPosition=\"bottom\" datoIcon=\"question\"></dato-icon>\n        </div>\n    </div>\n    <div class=\"sort-icon opacity-0\" *ngIf=\"params.enableSorting && (sortingInfo$ | async) as sortingInfo\"\n         [class.active]=\"sortingInfo.active\">\n        <dato-icon width=\"24px\" height=\"16px\" class=\"primary-300-color\"\n                   [attr.data-auto-id]=\"field + '-sort'\"\n                   [icon]=\"sortingInfo.icon\"></dato-icon>\n    </div>\n    <ng-container *ngIf=\"showFilter\">\n        <div class=\"filter relative\" *datoSubscribe=\"filterActive$ as filterActive\">\n            <dato-icon-button (click.stop)=\"openFilters(filters)\" datoTooltip=\"core.filters\" datoTooltipPosition=\"bottom\"\n                              datoType=\"none\" [attr.data-auto-id]=\"field + '-filter'\" class=\"filter-icon opacity-0\"\n                              [class.active]=\"filtersMenuOpen || filterActive\"\n                              datoSize=\"md\" icon=\"filter\"\n                              #filters></dato-icon-button>\n            <div [class.opacity-100]=\"filterActive\"\n                 class=\"opacity-0 filter-active-circle accent-400-background-color absolute\"></div>\n        </div>\n    </ng-container>\n    <dato-icon-button *ngIf=\"showMoreMenu\" (click.stop)=\"openMoreMenu(moreMenu)\" datoTooltip=\"core.more-options\" datoTooltipPosition=\"bottom\"\n                      datoType=\"none\" [attr.data-auto-id]=\"field + '-more-menu'\" [class.active]=\"moreMenuOpen\"\n                      datoSize=\"md\" icon=\"more-vertical\" #moreMenu></dato-icon-button>\n</div>\n",
+                template: "<div class=\"d-flex align-start-center\" [attr.data-auto-id]=\"field + '-column-header'\" [attr.data-field]=\"field\">\n    <ng-container *ngIf=\"customTemplates && customTemplates.customHeader as customHeader\">\n        <div class=\"mr-5\" [attr.data-auto-id]=\"field + '-dynamic-section'\">\n            <ng-container *ngTemplateOutlet=\"customHeader; context: context\"></ng-container>\n        </div>\n    </ng-container>\n    <div class=\"d-flex d-flex-grow align-start-center min-width-0 items-center\">\n        <span class=\"dato-simple-bold primary-400-color ellipsis min-width-0 mr-5\" [datoTooltip]=\"headerTooltip\"\n              datoTooltipPosition=\"bottom\">{{headerName}}</span>\n        <div>\n            <dato-icon class=\"primary-300-color\" *ngIf=\"headerInfo\" [datoTooltip]=\"headerInfo\" datoTooltipPosition=\"bottom\" datoIcon=\"question\"></dato-icon>\n        </div>\n    </div>\n    <div class=\"sort-icon opacity-0\" *ngIf=\"params.enableSorting && (sortingInfo$ | async) as sortingInfo\"\n         [class.active]=\"sortingInfo.active\">\n        <dato-icon width=\"24px\" height=\"16px\" class=\"primary-300-color\"\n                   [attr.data-auto-id]=\"field + '-sort'\"\n                   [icon]=\"sortingInfo.icon\"></dato-icon>\n    </div>\n    <ng-container *ngIf=\"showFilter\">\n        <div class=\"filter relative\" *datoSubscribe=\"filterActive$ as filterActive\">\n            <dato-icon-button (click.stop)=\"openFilters(filters)\" datoTooltip=\"core.filters\" datoTooltipPosition=\"bottom\"\n                              datoType=\"none\" [attr.data-auto-id]=\"field + '-filter'\" class=\"filter-icon opacity-0\"\n                              [class.active]=\"filtersMenuOpen || filterActive\"\n                              datoSize=\"md\" icon=\"filter\"\n                              #filters></dato-icon-button>\n            <div [class.opacity-100]=\"filterActive\"\n                 class=\"opacity-0 filter-active-circle accent-400-background-color absolute\"></div>\n        </div>\n    </ng-container>\n    <dato-icon-button *ngIf=\"showMoreMenu\" (click.stop)=\"openMoreMenu(moreMenu)\" datoTooltip=\"core.more-options\" datoTooltipPosition=\"bottom\"\n                      datoType=\"none\" [attr.data-auto-id]=\"field + '-more-menu'\" [class.active]=\"moreMenuOpen\"\n                      datoSize=\"md\" icon=\"more-vertical\" #moreMenu></dato-icon-button>\n</div>\n",
                 styles: [":host .filter-icon,:host .sort-icon{transition:opacity .25s linear,width .25s ease-in-out;width:0}:host .sort-icon{height:16px}:host .filter-icon.active,:host .sort-icon.active{opacity:1;width:24px}:host:hover .filter-icon,:host:hover .sort-icon{opacity:1;width:24px}:host .filter-active-circle{pointer-events:none;transition:opacity .2s ease-in-out;position:absolute;height:8px;width:8px;top:2px;right:2px;border-radius:4px;border:1px solid #fff}:host ::ng-deep .filter dato-icon-button dato-icon{transition:color .2s ease-in-out}"]
             }),
             __metadata("design:paramtypes", [core.ViewContainerRef,
@@ -14713,7 +14722,8 @@
             this.updateSettings({ gridAlignment: gridAlignment, columnsSizes: null });
         };
         GridService.prototype.saveSettingsToServer = function (settings) {
-            this.storageAPI.set(this.gridName, settings);
+            var isGlobal = this.gridQuery.getGridOptions().isGlobalSettings;
+            this.storageAPI.set(this.gridName, settings, isGlobal);
         };
         /**
          * @internal used to log grid events to the platform's logging service
@@ -15723,7 +15733,10 @@
                 .pipe(operators.switchMap(function () {
                 _this.gridOptions = _this.normalizeOptions();
                 agGrid.gridOptions = _this.gridOptions;
-                var settingsLoader = _this.gridOptions.saveSettings === false ? rxjs.of(null) : _this.storageAPI.get(_this.gridOptions.gridName);
+                var isGlobal = _this.gridOptions.isGlobalSettings;
+                var settingsLoader = _this.gridOptions.saveSettings === false
+                    ? rxjs.of(null)
+                    : _this.storageAPI.get(_this.gridOptions.gridName, isGlobal);
                 return rxjs.combineLatest([agGrid.gridReady, settingsLoader]);
             }), ngxTakeUntilDestroy.untilDestroyed(this))
                 .subscribe(function (_a) {
@@ -17018,6 +17031,18 @@
             this.registerGroupListeners();
             this.subscribeRowsSelectionData();
         };
+        DatoGridV2ToolbarComponent.prototype.getCellValueChangeEvent = function () {
+            var _this = this;
+            return this.gridController.gridQuery.waitForGrid(function () {
+                return _this.gridQuery.gridRef.cellValueChanged.pipe(operators.debounceTime(100), ngxTakeUntilDestroy.untilDestroyed(_this));
+            });
+        };
+        DatoGridV2ToolbarComponent.prototype.getRowDataUpdatedEvent = function () {
+            var _this = this;
+            return this.gridController.gridQuery.waitForGrid(function () {
+                return _this.gridQuery.gridRef.rowDataUpdated.pipe(operators.debounceTime(100), ngxTakeUntilDestroy.untilDestroyed(_this));
+            });
+        };
         DatoGridV2ToolbarComponent.prototype.onActionClick = function (action) {
             if (isFunction(action.onClick)) {
                 var selectedRowsCount = this.gridController.gridQuery.getSelectedRowsCount();
@@ -21505,6 +21530,40 @@
      * found in the LICENSE file at https://github.com/datorama/client-core/blob/master/LICENSE
      */
 
+    var RichTextService = /** @class */ (function () {
+        function RichTextService(http, config) {
+            this.http = http;
+            this.config = config;
+        }
+        RichTextService.prototype.getLib = function (appendScriptFunc, appendStyleFunc) {
+            if (!this.richTextScript$) {
+                this.initLib(appendScriptFunc, appendStyleFunc);
+            }
+            return this.richTextScript$;
+        };
+        RichTextService.prototype.initLib = function (appendScriptFunc, appendStyleFunc) {
+            this.richTextScript$ = rxjs.combineLatest([
+                this.http
+                    .get(this.config.paths.richText + "/index.js", { responseType: 'text' })
+                    .pipe(operators.tap(function (lib) { return appendScriptFunc(lib, 'rich-text-editor'); })),
+                this.http
+                    .get(this.config.paths.richText + "/plugins/autocomplete/plugin.css", { responseType: 'text' })
+                    .pipe(operators.tap(function (style) { return appendStyleFunc(style, 'tinymce-autocomplete'); }))
+            ]).pipe(operators.shareReplay(1));
+        };
+        RichTextService.ctorParameters = function () { return [
+            { type: http.HttpClient },
+            { type: undefined, decorators: [{ type: core.Inject, args: [DATO_CORE_CONFIG,] }] }
+        ]; };
+        RichTextService.ɵprov = core.ɵɵdefineInjectable({ factory: function RichTextService_Factory() { return new RichTextService(core.ɵɵinject(http.HttpClient), core.ɵɵinject(DATO_CORE_CONFIG)); }, token: RichTextService, providedIn: "root" });
+        RichTextService = __decorate([
+            core.Injectable({ providedIn: 'root' }),
+            __param(1, core.Inject(DATO_CORE_CONFIG)),
+            __metadata("design:paramtypes", [http.HttpClient, Object])
+        ], RichTextService);
+        return RichTextService;
+    }());
+
     /**
      * @license
      * Copyright Datorama. All Rights Reserved.
@@ -21518,20 +21577,20 @@
     var ɵ0$3 = getTinymce;
     var DatoRichTextDirective = /** @class */ (function (_super) {
         __extends(DatoRichTextDirective, _super);
-        function DatoRichTextDirective(ngZone, http, host, config) {
+        function DatoRichTextDirective(ngZone, richTextService, config, host) {
             var _this = _super.call(this) || this;
             _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';
             _this.isOneLine = false;
             _this.initialValue = '';
-            _this.defaultPlugins = 'link fullscreen textcolor colorpicker image lists table textpattern autocomplete';
+            _this.defaultPlugins = 'link fullscreen image lists table autocomplete';
             _this.defaultToolbar = [
-                'fontselect fontsizeselect forecolor backcolor bold italic underline link',
+                'fontfamily fontsize forecolor backcolor bold italic underline link',
                 'alignleft aligncenter alignright alignjustify outdent indent | table numlist bullist  | image fullscreen'
             ];
             return _this;
@@ -21557,28 +21616,11 @@
                 base: this.config.paths.richText,
                 query: ''
             };
-            /**
-             * We support only one instance in load time
-             */
-            if (window.tinymce) {
-                this.init.call(this);
-            }
-            else {
-                this.loadLib().subscribe(function (lib) {
-                    appendScript(lib, 'rich-text-editor');
-                    _this.init.call(_this);
-                    _this.loadAutoCompleteStyle();
-                });
-            }
-        };
-        DatoRichTextDirective.prototype.loadLib = function () {
-            return this.http.get(this.config.paths.richText + "/index.js", { responseType: 'text' });
-        };
-        DatoRichTextDirective.prototype.loadAutoCompleteStyle = function () {
-            this.http
-                .get(this.config.paths.richText + "/plugins/autocomplete/plugin.css", { responseType: 'text' })
-                .subscribe(function (style) {
-                appendStyle(style, 'tinymce-autocomplete');
+            this.richTextService
+                .getLib(appendScript, appendStyle)
+                .pipe(ngxTakeUntilDestroy.untilDestroyed(this))
+                .subscribe(function () {
+                _this.init.call(_this);
             });
         };
         DatoRichTextDirective.prototype.initEditor = function (_, editor) {
@@ -21602,8 +21644,6 @@
                 target: this.host.nativeElement,
                 width: this.width || 600,
                 height: this.height || 300,
-                force_br_newlines: true,
-                force_p_newlines: false,
                 resize: 'both',
                 branding: false,
                 inline: this.inline,
@@ -21611,10 +21651,12 @@
                 readonly: this.disabled,
                 plugins: this.plugins || this.defaultPlugins,
                 toolbar: isNil(this.toolbar) ? this.defaultToolbar : this.toolbar,
-                fontsize_formats: '8px 10px 12px 14px 18px 24px 36px',
+                font_size_formats: '8px 10px 12px 14px 18px 24px 36px',
                 min_width: 480,
                 menubar: false,
                 autocomplete: this.autocompleteOptions,
+                suffix: '.min',
+                skin: 'tinymce-5',
                 setup: function (editor) {
                     _this.editor = editor;
                     editor.on('init', function (e) {
@@ -21671,9 +21713,9 @@
         var DatoRichTextDirective_1;
         DatoRichTextDirective.ctorParameters = function () { return [
             { type: core.NgZone },
-            { type: http.HttpClient },
-            { type: core.ElementRef },
-            { type: undefined, decorators: [{ type: core.Inject, args: [DATO_CORE_CONFIG,] }] }
+            { type: RichTextService },
+            { type: undefined, decorators: [{ type: core.Inject, args: [DATO_CORE_CONFIG,] }] },
+            { type: core.ElementRef }
         ]; };
         __decorate([
             core.Input(),
@@ -21739,10 +21781,9 @@
                     }
                 ]
             }),
-            __param(3, core.Inject(DATO_CORE_CONFIG)),
+            __param(2, core.Inject(DATO_CORE_CONFIG)),
             __metadata("design:paramtypes", [core.NgZone,
-                http.HttpClient,
-                core.ElementRef, Object])
+                RichTextService, Object, core.ElementRef])
         ], DatoRichTextDirective);
         return DatoRichTextDirective;
     }(BaseCustomControl));
@@ -24265,7 +24306,9 @@
         };
         DatoBreadcrumbsComponent.prototype.initEditableHeader = function () {
             var _this = this;
-            this.headerControl.valueChanges.pipe(operators.debounceTime(300), ngxTakeUntilDestroy.untilDestroyed(this)).subscribe(function (res) {
+            this.headerControl.valueChanges
+                .pipe(operators.debounceTime(300), ngxTakeUntilDestroy.untilDestroyed(this))
+                .subscribe(function (res) {
                 _this.updateEditableText.emit(res);
                 _this.cdr.detectChanges();
             });
@@ -25071,10 +25114,10 @@
         DatoProgressBarComponent = __decorate([
             core.Component({
                 selector: 'dato-progress-bar',
-                template: "<div class=\"bar d-flex width-100 overflow-hidden\"\n     [style.width]=\"width\"\n     [class]=\"barColor + '-background-color'\">\n    <div *ngFor=\"let part of parts; index as i\"\n         class=\"part height-100\"\n         [ngClass]=\"part.color ? part.color + '-background-color' : ''\"\n         [style.width]=\"i > 0 ? 'calc(' + part.percent + '% + 8px)' : part.percent + '%'\"\n         [style.z-index]=\"100 - i\"\n         [datoTooltipV2]=\"part.tooltip\">\n    </div>\n</div>\n\n<ng-content></ng-content>\n\n<div *ngIf=\"showLegend\" class=\"d-flex mt-12\">\n    <div *ngFor=\"let part of parts; index as i\" class=\"d-flex mr-16\">\n        <div class=\"d-flex dato-note primary-400-color\">\n            <div class=\"legend-color mr-6\" [ngClass]=\"part.color ? part.color + '-background-color' : ''\"></div>\n            <div>{{ part.legendLabel || part.tooltip }}</div>\n        </div>\n    </div>\n</div>\n",
+                template: "<div class=\"bar d-flex width-100 overflow-hidden\"\n     [style.width]=\"width\"\n     [class]=\"barColor + '-background-color'\">\n    <div *ngFor=\"let part of parts; index as i\"\n         class=\"part height-100\"\n         [ngClass]=\"part.color ? part.color + '-background-color' : ''\"\n         [style.width]=\"i > 0 ? 'calc(' + part.percent + '% + 8px)' : part.percent + '%'\"\n         [style.z-index]=\"100 - i\"\n         [datoTooltipV2]=\"part.tooltip\">\n    </div>\n</div>\n\n<ng-content></ng-content>\n\n<div *ngIf=\"showLegend\" class=\"d-flex mt-12\">\n    <div *ngFor=\"let part of parts; index as i\" class=\"d-flex mr-16\">\n        <div class=\"d-flex items-center dato-note primary-400-color\">\n            <div class=\"legend-color mr-4\" [ngClass]=\"part.color ? part.color + '-background-color' : ''\"></div>\n            <div>{{ part.legendLabel || part.tooltip }}</div>\n            <div class=\"primary-300-color ml-3\" *ngIf=\"part.legendSecondaryLabel\">{{ part.legendSecondaryLabel }}</div>\n        </div>\n    </div>\n</div>\n",
                 changeDetection: core.ChangeDetectionStrategy.OnPush,
                 encapsulation: core.ViewEncapsulation.None,
-                styles: ["dato-progress-bar .bar{height:8px;border-radius:4px}dato-progress-bar .part{border-radius:0 4px 4px 0}dato-progress-bar .part:not(:first-child){margin-left:-8px}dato-progress-bar .legend-color{width:16px;height:16px;min-width:16px;border-radius:50%}"]
+                styles: ["dato-progress-bar .bar{height:8px;border-radius:4px}dato-progress-bar .part{border-radius:0 4px 4px 0}dato-progress-bar .part:not(:first-child){margin-left:-8px}dato-progress-bar .legend-color{width:8px;height:8px;min-width:8px;border-radius:50%}"]
             }),
             __metadata("design:paramtypes", [core.ChangeDetectorRef])
         ], DatoProgressBarComponent);
@@ -25628,7 +25671,7 @@
         };
     }
 
-    window.coreVersion = '22.12.1';
+    window.coreVersion = '22.13.2-rc.';
 
     exports.APP_TRANSLATE = APP_TRANSLATE;
     exports.AceService = AceService;
@@ -26070,6 +26113,7 @@
     exports.ɵl = DatoGridItemsCountCellComponent;
     exports.ɵm = DatoGridV2ToolbarMoreMenuComponent;
     exports.ɵn = DatoGridSearchBarComponent;
+    exports.ɵo = RichTextService;
 
     Object.defineProperty(exports, '__esModule', { value: true });