fix(core): add missing option to control row highlight duration after…

… CRUD (#1278)
ghiscoding · Dec 21, 2023 · 8240c8c · 8240c8c
1 parent 1cfc265
commit 8240c8c
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 3 deletions.
diff --git a/packages/common/src/core/slickGrid.ts b/packages/common/src/core/slickGrid.ts
@@ -219,6 +219,7 @@ export class SlickGrid<TData = any, C extends Column<TData> = Column<TData>, O e
     editorFactory: null,
     cellFlashingCssClass: 'flashing',
     rowHighlightCssClass: 'highlight-animate',
+    rowHighlightDuration: 400,
     selectedCellCssClass: 'selected',
     multiSelect: true,
     enableTextSelectionOnCells: false,
@@ -4754,8 +4755,9 @@ export class SlickGrid<TData = any, C extends Column<TData> = Column<TData>, O e
    * @param {Number} row - grid row number
    * @param {Number} [duration] - duration (ms), defaults to 500ms
    */
-  highlightRow(row: number, duration = 500) {
+  highlightRow(row: number, duration?: number) {
     const rowCache = this.rowsCache[row];
+    duration ||= this._options.rowHighlightDuration;
 
     if (Array.isArray(rowCache?.rowNode) && this._options.rowHighlightCssClass) {
       rowCache.rowNode.forEach(node => node.classList.add(this._options.rowHighlightCssClass || ''));

diff --git a/packages/common/src/interfaces/gridOption.interface.ts b/packages/common/src/interfaces/gridOption.interface.ts
@@ -635,6 +635,9 @@ export interface GridOption<C extends Column = Column> {
    */
   rowHighlightCssClass?: string;
 
+  /** Defaults to 400, duration to show the row highlight (e.g. after insert/edit/...) */
+  rowHighlightDuration?: number;
+
   /** Row Move Manager Plugin options & events */
   rowMoveManager?: RowMoveManager;
 

diff --git a/packages/common/src/services/grid.service.ts b/packages/common/src/services/grid.service.ts
@@ -257,15 +257,16 @@ export class GridService {
   /**
    * Highlight then fade a row for certain duration (ms).
    * @param {Number} rowNumber - grid row number
-   * @param {Number} duration - duration in ms
+   * @param {Number} [duration] - duration in ms
    */
-  highlightRow(rowNumber: number | number[], duration = 750) {
+  highlightRow(rowNumber: number | number[], duration?: number) {
     // create a SelectionModel if there's not one yet
     if (!this._grid.getSelectionModel()) {
       this._rowSelectionPlugin = new SlickRowSelectionModel(this._gridOptions.rowSelectionOptions);
       this._grid.setSelectionModel(this._rowSelectionPlugin);
     }
 
+    duration ||= this._gridOptions.rowHighlightDuration;
     if (Array.isArray(rowNumber)) {
       rowNumber.forEach(row => this._grid.highlightRow(row));
     } else {