@datorama/core 22.9.6-rc → 22.9.8-rc

package/bundles/datorama-core.umd.js

@@ -9577,7 +9577,7 @@
         DatoTriggerSingle = __decorate([
             core.Component({
                 selector: 'dato-trigger-single',
-                template: "<ng-template [ngClass]=\"{'hidden' : true}\" *ngIf=\"!loadingTemplate\" [ngTemplateOutlet]=\"loadingTemplate\"></ng-template>\n<ng-container\n        *ngIf=\"active && !hidePlaceholder\"\n        [ngTemplateOutlet]=\"active.tpl\"\n        [ngTemplateOutletContext]=\"_model\">\n</ng-container>\n<ng-container *ngIf=\"!active\">{{getLabel | translate}}</ng-container>\n<span class=\"dato-select__placeholder\" *ngIf=\"hidePlaceholder\">{{_placeholder}}</span>\n<dato-icon datoIcon=\"arrow-down\" datoSize=\"sm\" class=\"dato-select__single__arrow\"></dato-icon>\n",
+                template: "<ng-template *ngIf=\"loadingTemplate\" [ngTemplateOutlet]=\"loadingTemplate\"></ng-template>\n<ng-container\n        *ngIf=\"active && !hidePlaceholder\"\n        [ngTemplateOutlet]=\"active.tpl\"\n        [ngTemplateOutletContext]=\"_model\">\n</ng-container>\n<ng-container *ngIf=\"!active\">{{getLabel | translate}}</ng-container>\n<span class=\"dato-select__placeholder\" *ngIf=\"hidePlaceholder\">{{_placeholder}}</span>\n<dato-icon datoIcon=\"arrow-down\" datoSize=\"sm\" class=\"dato-select__single__arrow\"></dato-icon>\n",
                 changeDetection: core.ChangeDetectionStrategy.OnPush,
                 styles: [":host{display:block;position:relative;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host dato-icon{position:absolute;top:50%;transform:translateY(-50%);right:10px}"]
             }),
@@ -12180,26 +12180,40 @@
      * found in the LICENSE file at https://github.com/datorama/client-core/blob/master/LICENSE
      */
     var DatoGridV2NoDataOverlayComponent = /** @class */ (function () {
-        function DatoGridV2NoDataOverlayComponent(gridQuery, gridService, element) {
+        function DatoGridV2NoDataOverlayComponent(gridQuery, gridService, element, cdr) {
             this.gridQuery = gridQuery;
             this.gridService = gridService;
             this.element = element;
+            this.cdr = cdr;
             this.config = {};
         }
-        Object.defineProperty(DatoGridV2NoDataOverlayComponent.prototype, "showImage", {
+        Object.defineProperty(DatoGridV2NoDataOverlayComponent.prototype, "overlayStyles", {
+            /** Adjust the overlay to the grid body viewport height */
             get: function () {
-                var elParent = this.element.nativeElement.parentElement;
-                if (elParent.classList.contains('ag-overlay-wrapper')) {
-                    return elParent.offsetHeight >= 390;
+                if (this.gridBody) {
+                    var _a = this.gridBody, offsetHeight = _a.offsetHeight, offsetTop = _a.offsetTop;
+                    return {
+                        height: offsetHeight + "px",
+                        marginTop: offsetTop + "px"
+                    };
                 }
-                return true;
+                return null;
             },
             enumerable: true,
             configurable: true
         });
         DatoGridV2NoDataOverlayComponent.prototype.ngOnInit = function () {
+            var _this = this;
+            var grid = this.element.nativeElement.closest('dato-grid-v2');
+            this.gridBody = grid && grid.querySelector('.ag-body-viewport');
             this.filterActive$ = this.gridQuery.filterActive$;
-            this.hasError$ = this.gridQuery.isServerSide ? this.gridQuery.serverSideError$ : rxjs.of(false);
+            this.hasError$ = this.gridQuery.isServerSide
+                ? this.gridQuery.serverSideError$.pipe(operators.tap(function () {
+                    setTimeout(function () {
+                        _this.cdr.detectChanges();
+                    });
+                }))
+                : rxjs.of(false);
             this.initDefaultConfig();
             var gridConfig = this.gridQuery.getGridOptions().overlaysConfig || {};
             var userConfig = deepmerge(gridConfig, this.config);
@@ -12209,6 +12223,38 @@
             this.gridService.clearAllFilters();
         };
         DatoGridV2NoDataOverlayComponent.prototype.agInit = function (params) { };
+        DatoGridV2NoDataOverlayComponent.prototype.isIconHidden = function () {
+            var e_1, _a;
+            if (this.gridBody) {
+                var el = this.element.nativeElement;
+                if (el) {
+                    var container = el.querySelector('.container');
+                    var icon = container.querySelector('img');
+                    var heightOfElements = 0;
+                    /** hide the icon until next change detection cycle */
+                    if (icon.height === 0) {
+                        return true;
+                    }
+                    try {
+                        for (var _b = __values(container.children), _c = _b.next(); !_c.done; _c = _b.next()) {
+                            var child = _c.value;
+                            var childHeight = child.offsetHeight || child.height || 0;
+                            var childMarginBottom = toNumber(child.style.marginBottom.replace('px', ''));
+                            heightOfElements += childHeight + childMarginBottom;
+                        }
+                    }
+                    catch (e_1_1) { e_1 = { error: e_1_1 }; }
+                    finally {
+                        try {
+                            if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
+                        }
+                        finally { if (e_1) throw e_1.error; }
+                    }
+                    return heightOfElements > this.gridBody.offsetHeight;
+                }
+            }
+            return true;
+        };
         DatoGridV2NoDataOverlayComponent.prototype.initDefaultConfig = function () {
             var enableSearch = this.gridQuery.getGridOptions().enableSearch;
             this.defaultConfig = {
@@ -12229,20 +12275,29 @@
         DatoGridV2NoDataOverlayComponent.ctorParameters = function () { return [
             { type: GridQuery },
             { type: GridService },
-            { type: core.ElementRef }
+            { type: core.ElementRef },
+            { type: core.ChangeDetectorRef }
         ]; };
         __decorate([
             core.Input(),
             __metadata("design:type", Object)
         ], DatoGridV2NoDataOverlayComponent.prototype, "config", void 0);
+        __decorate([
+            core.HostBinding('style'),
+            __metadata("design:type", Object),
+            __metadata("design:paramtypes", [])
+        ], DatoGridV2NoDataOverlayComponent.prototype, "overlayStyles", null);
         DatoGridV2NoDataOverlayComponent = __decorate([
             core.Component({
                 selector: 'dato-grid-v2-no-data-overlay',
-                template: "<div class=\"container d-flex-column align-center\">\n    <ng-container *ngIf=\"(hasError$ | async) === false; else error\">\n          <ng-container *ngIf=\"(filterActive$ | async) === true; else noData\">\n              <ng-container *ngTemplateOutlet=\"imgNText; context: {$implicit: mergedConfig.noResult }\"></ng-container>\n              <div class=\"d-flex items-center\">\n                  <div class=\"dato-simple primary-400-color\">{{'core.try-to-adjust-or' | translate}}&nbsp;</div>\n                  <dato-link (click)=\"clearFilters()\">{{ 'core.clear-filters' | translate }}</dato-link>\n              </div>\n          </ng-container>\n          <ng-template #noData>\n              <ng-container *ngTemplateOutlet=\"imgNText; context: {$implicit: mergedConfig.noData}\"></ng-container>\n              <ng-content select=\"[no-data-content]\"></ng-content>\n          </ng-template>\n\n    </ng-container>\n    <ng-template #error>\n        <ng-container *ngTemplateOutlet=\"imgNText; context: {$implicit: mergedConfig.serverSideError}\"></ng-container>\n        <div #errorContent><ng-content select=\"[server-error-content]\"></ng-content></div>\n        <div class=\"dato-simple primary-400-color\" *ngIf=\"errorContent.children.length === 0\">{{'core.try-to-refresh-or-contact' | translate}}&nbsp;</div>\n    </ng-template>\n</div>\n\n<ng-template #imgNText let-view>\n    <img class=\"mb-30\" [datoStaticSrc]=\"view.icon\" *ngIf=\"showImage && view.icon\">\n    <div class=\"dato-simple-bold primary-500-color mb-3\">{{ view.text | translate }}</div>\n</ng-template>\n",
+                template: "<div class=\"container d-flex-column align-center height-100 p-4\">\n    <ng-container *ngIf=\"(hasError$ | async) === false; else error\">\n          <ng-container *ngIf=\"(filterActive$ | async) === true; else noData\">\n              <ng-container *ngTemplateOutlet=\"imgNText; context: {$implicit: mergedConfig.noResult }\"></ng-container>\n              <div class=\"d-flex items-center\">\n                  <div class=\"dato-simple primary-400-color\">{{'core.try-to-adjust-or' | translate}}&nbsp;</div>\n                  <dato-link (click)=\"clearFilters()\">{{ 'core.clear-filters' | translate }}</dato-link>\n              </div>\n          </ng-container>\n          <ng-template #noData>\n              <ng-container *ngTemplateOutlet=\"imgNText; context: {$implicit: mergedConfig.noData}\"></ng-container>\n              <ng-content select=\"[no-data-content]\"></ng-content>\n          </ng-template>\n\n    </ng-container>\n    <ng-template #error>\n        <ng-container *ngTemplateOutlet=\"imgNText; context: {$implicit: mergedConfig.serverSideError}\"></ng-container>\n        <div #errorContent><ng-content select=\"[server-error-content]\"></ng-content></div>\n        <div class=\"dato-simple primary-400-color\" *ngIf=\"errorContent.children.length === 0\">{{'core.try-to-refresh-or-contact' | translate}}&nbsp;</div>\n    </ng-template>\n</div>\n\n<ng-template #imgNText let-view>\n    <img [datoStaticSrc]=\"view.icon\" *ngIf=\"view.icon\" [hidden]=\"isIconHidden()\" [style.marginBottom]=\"'30px'\">\n    <div class=\"dato-simple-bold primary-500-color\" [style.marginBottom]=\"'3px'\">{{ view.text | translate }}</div>\n</ng-template>\n",
                 changeDetection: core.ChangeDetectionStrategy.OnPush,
-                styles: [":host{pointer-events:all}"]
+                styles: [":host{pointer-events:all;overflow:auto}"]
             }),
-            __metadata("design:paramtypes", [GridQuery, GridService, core.ElementRef])
+            __metadata("design:paramtypes", [GridQuery,
+                GridService,
+                core.ElementRef,
+                core.ChangeDetectorRef])
         ], DatoGridV2NoDataOverlayComponent);
         return DatoGridV2NoDataOverlayComponent;
     }());
@@ -16077,7 +16132,7 @@
                 template: "<ag-grid-angular data-auto-id=\"grid\" class=\"dato-grid ag-theme-material\" [class.has-background]=\"enableBackground\" [class.enable-v2_1]=\"enableV2_1\"\n                 [class.with-multi-selection-col]=\"gridOptions?.showMultiSelectionCheckboxes\" [class.pivot-mode]=\"isPivotMode\">\n</ag-grid-angular>\n<dato-grid-pagination-v2 [class.has-background]=\"enableBackground\"></dato-grid-pagination-v2>\n",
                 changeDetection: core.ChangeDetectionStrategy.OnPush,
                 encapsulation: core.ViewEncapsulation.None,
-                styles: ["dato-grid-v2{flex-grow:1;display:flex;flex-direction:column;position:relative}dato-grid-v2 .dato-grid,dato-grid-v2 dato-grid-pagination-v2{position:absolute;left:0;right:0;bottom:0}dato-grid-v2 .dato-grid{top:0;bottom:50px}dato-grid-v2 .grid-hover-actions{position:absolute;z-index:2;transition:opacity .2s ease-in-out}dato-grid-v2 .ag-row-drag{width:initial!important}dato-grid-v2 .da-grid-icon{display:inline-block;line-height:31px;vertical-align:middle;width:initial;height:initial}dato-grid-v2 .da-grid-icon.drag{width:14px;height:14px;margin-right:6px;opacity:0;transition:opacity .3s;transform:translateY(-50%)}dato-grid-v2 .da-grid-icon.folder{width:18px;height:35px;margin:0 8px}dato-grid-v2 .ag-row.ag-row-hover .da-grid-icon.drag{opacity:1}dato-grid-v2 ag-grid-angular.tree .ag-group-contracted,dato-grid-v2 ag-grid-angular.tree .ag-group-expanded{display:inline-block;width:18px;text-align:center}dato-grid-v2 ag-grid-angular.tree .ag-group-checkbox{display:none}dato-grid-v2 ag-grid-angular.tree .ag-row.ag-empty-folder .folder{margin-left:26px}dato-grid-v2 ag-grid-angular.tree .ag-row.ag-row-level-1 .ag-cell-wrapper .ag-row-drag{padding-right:calc(55px * 1)}dato-grid-v2 ag-grid-angular.tree .ag-row .ag-row-group-indent-1{margin-left:0!important;padding-left:0!important}dato-grid-v2 ag-grid-angular.tree .ag-row.ag-row-level-2 .ag-cell-wrapper .ag-row-drag{padding-right:calc(55px * 2)}dato-grid-v2 ag-grid-angular.tree .ag-row .ag-row-group-indent-2{margin-left:0!important;padding-left:0!important}dato-grid-v2 ag-grid-angular.tree .ag-row.ag-row-level-3 .ag-cell-wrapper .ag-row-drag{padding-right:calc(55px * 3)}dato-grid-v2 ag-grid-angular.tree .ag-row .ag-row-group-indent-3{margin-left:0!important;padding-left:0!important}dato-grid-v2 ag-grid-angular.tree .ag-row.ag-row-level-4 .ag-cell-wrapper .ag-row-drag{padding-right:calc(55px * 4)}dato-grid-v2 ag-grid-angular.tree .ag-row .ag-row-group-indent-4{margin-left:0!important;padding-left:0!important}dato-grid-v2 ag-grid-angular.tree .ag-row div[col-id=ag-Grid-AutoColumn]{padding-left:0}dato-grid-v2 ag-grid-angular.tree .ag-row .ag-cell{display:flex;align-items:center}dato-grid-v2 ag-grid-angular.tree .ag-row .ag-cell .ag-group-value>span{display:inline-block;vertical-align:middle}dato-grid-v2 ag-grid-angular.tree .ag-row .ag-cell .initials{border-radius:50%;padding:4px;margin-right:8px;margin-left:20px;width:28px;height:28px;display:inline-block;text-align:center}dato-grid-v2 ag-grid-angular.tree .ag-row-group-leaf-indent{margin-left:0!important}dato-grid-v2 ag-grid-angular.tree .ag-selection-checkbox .ag-icon-checkbox-indeterminate:before{text-align:center;content:'-';display:inline-block;position:absolute;top:0;left:0;right:0;bottom:0;line-height:.5;color:#fff}dato-grid-v2 ag-grid-angular.row-height-35 .ag-cell{line-height:33px}dato-grid-v2 ag-grid-angular.row-height-35 .ag-cell.dato-editable-cell{line-height:29px}dato-grid-v2 ag-grid-angular.row-height-35 .ag-cell.ag-cell-inline-editing{height:35px}dato-grid-v2 ag-grid-angular.row-height-44 .ag-cell{line-height:42px}dato-grid-v2 ag-grid-angular.row-height-44 .ag-cell.dato-editable-cell{line-height:38px}dato-grid-v2 ag-grid-angular.row-height-44 .ag-cell.ag-cell-inline-editing{height:44px}dato-grid-v2 ag-grid-angular.row-height-50 .ag-cell{line-height:48px}dato-grid-v2 ag-grid-angular.row-height-50 .ag-cell.dato-editable-cell{line-height:44px}dato-grid-v2 ag-grid-angular.row-height-50 .ag-cell.ag-cell-inline-editing{height:50px}dato-grid-v2 ag-grid-angular.row-height-59 .ag-cell{line-height:57px}dato-grid-v2 ag-grid-angular.row-height-59 .ag-cell.dato-editable-cell{line-height:53px}dato-grid-v2 ag-grid-angular.row-height-59 .ag-cell.ag-cell-inline-editing{height:59px}dato-grid-v2 ag-grid-angular .ag-cell.checkbox-selection-cell{display:flex}dato-grid-v2 .ag-menu .da-grid-icon svg{vertical-align:middle}dato-grid-v2 .ag-header-cell-sortable .ag-sort-none-icon{opacity:0;transition:opacity .2s}dato-grid-v2 .ag-header-cell-sortable:hover .ag-sort-none-icon{opacity:1}dato-grid-v2 .group-contracted-icon,dato-grid-v2 .group-expanded-icon{width:7px}dato-grid-v2 .group-expanded-icon{transform:rotate(90deg)}dato-grid-v2 .dato-grid .ag-cell{border-top:0;border-bottom:0}.ag-dnd-ghost{min-width:100px;border:none;display:flex;justify-content:flex-start;align-content:center;align-items:center;cursor:-webkit-grabbing;cursor:grabbing;z-index:10000000}.ag-dnd-ghost .da-grid-icon.column-move-hide svg{height:18px;width:18px}.ag-dnd-ghost .da-grid-icon.column-move svg,.ag-dnd-ghost .da-grid-icon.column-move-pin svg{height:16px;width:16px}"]
+                styles: ["dato-grid-v2{flex-grow:1;display:flex;flex-direction:column;position:relative}dato-grid-v2 .dato-grid,dato-grid-v2 dato-grid-pagination-v2{position:absolute;left:0;right:0;bottom:0}dato-grid-v2 .dato-grid{top:0;bottom:50px}dato-grid-v2 .grid-hover-actions{position:absolute;z-index:2;transition:opacity .2s ease-in-out}dato-grid-v2 .ag-row-drag{width:initial!important}dato-grid-v2 .da-grid-icon{display:inline-block;line-height:31px;vertical-align:middle;width:initial;height:initial}dato-grid-v2 .da-grid-icon.drag{width:14px;height:14px;margin-right:6px;opacity:0;transition:opacity .3s;transform:translateY(-50%)}dato-grid-v2 .da-grid-icon.folder{width:18px;height:35px;margin:0 8px}dato-grid-v2 .ag-row.ag-row-hover .da-grid-icon.drag{opacity:1}dato-grid-v2 ag-grid-angular.tree .ag-group-contracted,dato-grid-v2 ag-grid-angular.tree .ag-group-expanded{display:inline-block;width:18px;text-align:center}dato-grid-v2 ag-grid-angular.tree .ag-group-checkbox{display:none}dato-grid-v2 ag-grid-angular.tree .ag-row.ag-empty-folder .folder{margin-left:26px}dato-grid-v2 ag-grid-angular.tree .ag-row.ag-row-level-1 .ag-cell-wrapper .ag-row-drag{padding-right:calc(55px * 1)}dato-grid-v2 ag-grid-angular.tree .ag-row .ag-row-group-indent-1{margin-left:0!important;padding-left:0!important}dato-grid-v2 ag-grid-angular.tree .ag-row.ag-row-level-2 .ag-cell-wrapper .ag-row-drag{padding-right:calc(55px * 2)}dato-grid-v2 ag-grid-angular.tree .ag-row .ag-row-group-indent-2{margin-left:0!important;padding-left:0!important}dato-grid-v2 ag-grid-angular.tree .ag-row.ag-row-level-3 .ag-cell-wrapper .ag-row-drag{padding-right:calc(55px * 3)}dato-grid-v2 ag-grid-angular.tree .ag-row .ag-row-group-indent-3{margin-left:0!important;padding-left:0!important}dato-grid-v2 ag-grid-angular.tree .ag-row.ag-row-level-4 .ag-cell-wrapper .ag-row-drag{padding-right:calc(55px * 4)}dato-grid-v2 ag-grid-angular.tree .ag-row .ag-row-group-indent-4{margin-left:0!important;padding-left:0!important}dato-grid-v2 ag-grid-angular.tree .ag-row div[col-id=ag-Grid-AutoColumn]{padding-left:0}dato-grid-v2 ag-grid-angular.tree .ag-row .ag-cell{display:flex;align-items:center}dato-grid-v2 ag-grid-angular.tree .ag-row .ag-cell .ag-group-value>span{display:inline-block;vertical-align:middle}dato-grid-v2 ag-grid-angular.tree .ag-row .ag-cell .initials{border-radius:50%;padding:4px;margin-right:8px;margin-left:20px;width:28px;height:28px;display:inline-block;text-align:center}dato-grid-v2 ag-grid-angular.tree .ag-row-group-leaf-indent{margin-left:0!important}dato-grid-v2 ag-grid-angular.tree .ag-selection-checkbox .ag-icon-checkbox-indeterminate:before{text-align:center;content:'-';display:inline-block;position:absolute;top:0;left:0;right:0;bottom:0;line-height:.5;color:#fff}dato-grid-v2 ag-grid-angular.row-height-35 .ag-cell{line-height:33px}dato-grid-v2 ag-grid-angular.row-height-35 .ag-cell.dato-editable-cell{line-height:29px}dato-grid-v2 ag-grid-angular.row-height-35 .ag-cell.ag-cell-inline-editing{height:35px}dato-grid-v2 ag-grid-angular.row-height-44 .ag-cell{line-height:42px}dato-grid-v2 ag-grid-angular.row-height-44 .ag-cell.dato-editable-cell{line-height:38px}dato-grid-v2 ag-grid-angular.row-height-44 .ag-cell.ag-cell-inline-editing{height:44px}dato-grid-v2 ag-grid-angular.row-height-50 .ag-cell{line-height:48px}dato-grid-v2 ag-grid-angular.row-height-50 .ag-cell.dato-editable-cell{line-height:44px}dato-grid-v2 ag-grid-angular.row-height-50 .ag-cell.ag-cell-inline-editing{height:50px}dato-grid-v2 ag-grid-angular.row-height-59 .ag-cell{line-height:57px}dato-grid-v2 ag-grid-angular.row-height-59 .ag-cell.dato-editable-cell{line-height:53px}dato-grid-v2 ag-grid-angular.row-height-59 .ag-cell.ag-cell-inline-editing{height:59px}dato-grid-v2 ag-grid-angular .ag-cell.checkbox-selection-cell{display:flex}dato-grid-v2 .ag-menu .da-grid-icon svg{vertical-align:middle}dato-grid-v2 .ag-header-cell-sortable .ag-sort-none-icon{opacity:0;transition:opacity .2s}dato-grid-v2 .ag-header-cell-sortable:hover .ag-sort-none-icon{opacity:1}dato-grid-v2 .group-contracted-icon,dato-grid-v2 .group-expanded-icon{width:7px}dato-grid-v2 .group-expanded-icon{transform:rotate(90deg)}dato-grid-v2 .dato-grid .ag-cell{border-top:0;border-bottom:0}dato-grid-v2 .ag-overlay-wrapper ng-component{display:flex}.ag-dnd-ghost{min-width:100px;border:none;display:flex;justify-content:flex-start;align-content:center;align-items:center;cursor:-webkit-grabbing;cursor:grabbing;z-index:10000000}.ag-dnd-ghost .da-grid-icon.column-move-hide svg{height:18px;width:18px}.ag-dnd-ghost .da-grid-icon.column-move svg,.ag-dnd-ghost .da-grid-icon.column-move-pin svg{height:16px;width:16px}"]
             }),
             __metadata("design:paramtypes", [DatoGridControllerComponent, core.ElementRef])
         ], DatoGridV2Component);
@@ -25469,7 +25524,7 @@
         };
     }
 
-    window.coreVersion = '22.9.5';
+    window.coreVersion = '22.9.7';
 
     exports.APP_TRANSLATE = APP_TRANSLATE;
     exports.AceService = AceService;