@datorama/core 22.9.9-rc.3 → 22.9.10

package/bundle.scss

@@ -4870,13 +4870,13 @@ dato-button button[disabled] {
  Secondary
  */
 dato-button[datoType='secondary'] button {
-    background-color: themify(primary-300, 0.15);
-    color: themify(primary-400);
+    background-color: themify(primary-100);
+    color: themify(primary-600);
 }
 
 dato-button[datoType='secondary'] button:hover {
-    background-color: themify(primary-300, 0.25);
-    color: themify(primary-500);
+    background-color: themify(primary-200);
+    color: themify(primary-600);
 }
 
 dato-button[datoType='secondary'] dato-icon svg {
@@ -4884,8 +4884,8 @@ dato-button[datoType='secondary'] dato-icon svg {
 }
 
 dato-button[datoType='secondary'] button:active {
-    background-color: themify(primary-300, 0.35);
-    color: themify(primary-600);
+    background-color: themify(primary-300);
+    color: themify(primary-700);
 }
 
 /**

package/bundles/datorama-core.umd.js

@@ -12087,6 +12087,14 @@
         GridRowSelectionType["MULTIPLE"] = "multiple";
     })(exports.GridRowSelectionType || (exports.GridRowSelectionType = {}));
 
+    (function (GridStatusColumnTypes) {
+        GridStatusColumnTypes["SUCCESS"] = "SUCCESS";
+        GridStatusColumnTypes["FAILURE"] = "FAILURE";
+        GridStatusColumnTypes["IN_PROGRESS"] = "IN_PROGRESS";
+        GridStatusColumnTypes["PENDING"] = "PENDING";
+        GridStatusColumnTypes["WAITING"] = "WAITING";
+    })(exports.GridStatusColumnTypes || (exports.GridStatusColumnTypes = {}));
+
     /**
      * @license
      * Copyright Datorama. All Rights Reserved.
@@ -15623,7 +15631,7 @@
         });
         DatoGridControllerComponent.prototype.ngOnDestroy = function () {
             this.contentInit.complete();
-            this.tooltip && this.clearTooltip();
+            this.clearTooltip();
             this.rowHoverComponent && this.rowHoverComponent.destroy();
             this.rowHoverComponent = null;
         };
@@ -15853,40 +15861,51 @@
                 });
                 this.addOnHoverElement();
             }
-            agGrid.cellMouseOver
-                .pipe(operators.filter(function (_a) {
-                var node = _a.node, column = _a.column;
-                return lastHoveredCell !== node.id + "-" + column.getColId();
-            }), ngxTakeUntilDestroy.untilDestroyed(this))
-                .subscribe(function (event) {
-                lastHoveredCell = event.node.id + "-" + event.column.getColId();
+            agGrid.cellMouseOver.pipe(ngxTakeUntilDestroy.untilDestroyed(this)).subscribe(function (event) {
+                var node = event.node, column = event.column;
+                if (lastHoveredCell === node.id + "-" + column.getColId()) {
+                    clearTimeout(_this.cellMouseOutTimer);
+                    return;
+                }
+                lastHoveredCell = node.id + "-" + column.getColId();
                 _this.showTooltip(event);
                 var row = event.event.target.parentElement;
-                if (onHoverEnabled && (event.node.group === false || isNil(event.node.group)) && _this.lastHoveredRow !== row) {
+                if (onHoverEnabled && (node.group === false || isNil(node.group)) && _this.lastHoveredRow !== row) {
                     var previousNode = _this.lastHoveredRow;
                     _this.lastHoveredRow = row;
                     _this.toggleRowHoverClass([previousNode, _this.lastHoveredRow]);
                     _this.setOnHoverState(true, event);
                 }
             });
-            var onTooltipOut = rxjs.merge(rxjs.fromEvent(bodyViewport, 'scroll'), rxjs.fromEvent(this.agGridEl, 'mouseleave'), agGrid.cellMouseOut);
-            onTooltipOut
+            var onTooltipOut = rxjs.merge(rxjs.fromEvent(bodyViewport, 'scroll'), rxjs.fromEvent(this.agGridEl, 'mouseleave'));
+            onTooltipOut.pipe(ngxTakeUntilDestroy.untilDestroyed(this)).subscribe(function () {
+                lastHoveredCell = null;
+                _this.clearTooltip();
+            });
+            agGrid.cellMouseOut
                 .pipe(operators.filter(function () { return !isNil(_this.tooltip); }), ngxTakeUntilDestroy.untilDestroyed(this))
                 .subscribe(function () {
-                _this.clearTooltip();
+                _this.cellMouseOutTimer = window.setTimeout(function () { return _this.clearTooltip(); });
             });
         };
         /**
          * Dispose the tooltip
          */
         DatoGridControllerComponent.prototype.clearTooltip = function () {
-            this.tooltip.dispose();
+            this.tooltip && this.tooltip.dispose();
             this.tooltip = null;
         };
         DatoGridControllerComponent.prototype.showTooltip = function (event) {
             var cell = event.event.target;
+            if (cell.tagName === 'SPAN' && cell.scrollWidth === 0) {
+                cell = cell.parentElement;
+            }
+            if (event.colDef.editable) {
+                cell = cell.querySelector('.value-wrapper') || cell;
+            }
             var textOverflow = cell.offsetWidth < cell.scrollWidth;
             if (textOverflow) {
+                clearTimeout(this.cellMouseOutTimer);
                 var params = { cell: cell, value: cell.innerText };
                 isNil(this.tooltip) ? this.createAndShowTooltip(params) : this.updateTooltip(params);
             }
@@ -20547,7 +20566,15 @@
 
     var DatoGridStatusCellComponent = /** @class */ (function () {
         function DatoGridStatusCellComponent(cdr) {
+            var _a;
             this.cdr = cdr;
+            this.defaultConfigByStatus = (_a = {},
+                _a[exports.GridStatusColumnTypes.SUCCESS] = { icon: 'success-line', iconCssClass: 'green-400-color' },
+                _a[exports.GridStatusColumnTypes.FAILURE] = { icon: 'failed-line', iconCssClass: 'red-400-color' },
+                _a[exports.GridStatusColumnTypes.PENDING] = { icon: 'time', iconCssClass: 'yellow-400-color' },
+                _a[exports.GridStatusColumnTypes.WAITING] = { icon: 'info-line', iconCssClass: 'orange-400-color' },
+                _a[exports.GridStatusColumnTypes.IN_PROGRESS] = { showSpinner: true },
+                _a);
         }
         DatoGridStatusCellComponent.prototype.agInit = function (params) {
             var value = params.value, valueFormatted = params.valueFormatted, node = params.node;
@@ -20562,13 +20589,14 @@
             var mainCustomCellConfig = customCellConfig || {};
             var valueCustomCellConfig = valueToCustomCellConfig ? valueToCustomCellConfig[params.value] || {} : {};
             var config = __assign(__assign({}, mainCustomCellConfig), valueCustomCellConfig);
-            var textCssClass = config.textCssClass, icon = config.icon, iconCssClass = config.iconCssClass, showSpinner = config.showSpinner, getAdditionalText = config.getAdditionalText, additionalTextCssClass = config.additionalTextCssClass, getIsVisible = config.getIsVisible;
+            var textCssClass = config.textCssClass, icon = config.icon, iconCssClass = config.iconCssClass, showSpinner = config.showSpinner, getAdditionalText = config.getAdditionalText, additionalTextCssClass = config.additionalTextCssClass, getIsVisible = config.getIsVisible, status = config.status;
+            var defaultConfig = this.defaultConfigByStatus[status] || {};
             this.isVisible = !getIsVisible || getIsVisible(params.data);
-            this.icon = icon;
-            this.iconCssClass = iconCssClass || '';
+            this.icon = icon || defaultConfig.icon;
+            this.iconCssClass = iconCssClass || defaultConfig.iconCssClass || '';
             this.textCssClass = textCssClass || '';
             this.additionalTextCssClass = additionalTextCssClass || '';
-            this.showSpinner = showSpinner;
+            this.showSpinner = !!showSpinner || !!defaultConfig.showSpinner;
             this.additionalText = getAdditionalText ? getAdditionalText(params.data) : null;
         };
         DatoGridStatusCellComponent.prototype.refresh = function (params) {