Merge pull request #1679 from zewa666/cell-range-decorator-darkmode

feat: matching border color for range selector in darkmode

Author: ghiscoding

packages/common/src/core/__tests__/slickGrid.spec.ts

@@ -1159,6 +1159,15 @@ describe('SlickGrid core file', () => {
 
       expect(rowSelectSpy).toHaveBeenCalled();
     });
+
+    it('should change border color for darkMode', () => {
+      const cellSelectionModel = new SlickCellSelectionModel();
+
+      grid = new SlickGrid<any, Column>(container, [], columns, { ...defaultOptions, darkMode: true });
+      cellSelectionModel.init(grid);
+
+      expect(cellSelectionModel.cellRangeSelector.addonOptions.selectionCss.border).toBe('2px solid white');
+    });
   });
 
   describe('Node Getters', () => {
@@ -5813,4 +5822,4 @@ describe('SlickGrid core file', () => {
       });
     });
   });
-});
+});

packages/common/src/extensions/slickCellSelectionModel.ts

@@ -52,6 +52,10 @@ export class SlickCellSelectionModel implements SelectionModel {
 
   init(grid: SlickGrid): void {
     this._grid = grid;
+    if (this._addonOptions === undefined || this._addonOptions.cellRangeSelector === undefined) {
+      this._selector = new SlickCellRangeSelector({ selectionCss: { border: `2px solid ${this._grid.getOptions().darkMode ? "white" : "black"}` } as CSSStyleDeclaration })
+    }
+
     if (grid.hasDataView()) {
       this._dataView = grid.getData<CustomDataView | SlickDataView>();
     }