@alaarab/ogrid-angular 2.1.6 → 2.1.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/esm/index.js CHANGED
@@ -790,7 +790,7 @@ var DataGridLayoutHelper = class {
790
790
  }
791
791
  };
792
792
  var DataGridEditingHelper = class {
793
- constructor(getVisibleCols, getItems, getWrappedOnCellValueChanged, setActiveCellFn) {
793
+ constructor(getVisibleCols, getItems, getWrappedOnCellValueChanged, setActiveCellFn, setSelectionRangeFn, getColOffset) {
794
794
  this.editingCellSig = signal(null);
795
795
  this.pendingEditorValueSig = signal(void 0);
796
796
  this.popoverAnchorElSig = signal(null);
@@ -798,6 +798,8 @@ var DataGridEditingHelper = class {
798
798
  this.getItems = getItems;
799
799
  this.getWrappedOnCellValueChanged = getWrappedOnCellValueChanged;
800
800
  this.setActiveCellFn = setActiveCellFn;
801
+ this.setSelectionRangeFn = setSelectionRangeFn;
802
+ this.getColOffset = getColOffset;
801
803
  }
802
804
  setEditingCell(cell) {
803
805
  this.editingCellSig.set(cell);
@@ -824,7 +826,10 @@ var DataGridEditingHelper = class {
824
826
  this.pendingEditorValueSig.set(void 0);
825
827
  const items = this.getItems();
826
828
  if (rowIndex < items.length - 1) {
827
- this.setActiveCellFn({ rowIndex: rowIndex + 1, columnIndex: globalColIndex });
829
+ const newRow = rowIndex + 1;
830
+ const localCol = globalColIndex - this.getColOffset();
831
+ this.setActiveCellFn({ rowIndex: newRow, columnIndex: globalColIndex });
832
+ this.setSelectionRangeFn({ startRow: newRow, startCol: localCol, endRow: newRow, endCol: localCol });
828
833
  }
829
834
  }
830
835
  cancelPopoverEdit() {
@@ -1546,7 +1551,9 @@ var DataGridStateService = class {
1546
1551
  () => this.visibleCols(),
1547
1552
  () => this.props()?.items ?? [],
1548
1553
  () => this.wrappedOnCellValueChanged(),
1549
- (cell) => this.setActiveCell(cell)
1554
+ (cell) => this.setActiveCell(cell),
1555
+ (range) => this.setSelectionRange(range),
1556
+ () => this.colOffset()
1550
1557
  );
1551
1558
  effect((onCleanup) => {
1552
1559
  const onMove = (e) => this.onWindowMouseMove(e);
@@ -2507,23 +2514,6 @@ var OGRID_THEME_VARS_CSS = `
2507
2514
  --ogrid-selection-color: #217346;
2508
2515
  --ogrid-loading-overlay: rgba(255, 255, 255, 0.7);
2509
2516
  }
2510
- @media (prefers-color-scheme: dark) {
2511
- :root:not([data-theme="light"]) {
2512
- --ogrid-bg: #1e1e1e;
2513
- --ogrid-fg: rgba(255, 255, 255, 0.87);
2514
- --ogrid-fg-secondary: rgba(255, 255, 255, 0.6);
2515
- --ogrid-fg-muted: rgba(255, 255, 255, 0.5);
2516
- --ogrid-border: rgba(255, 255, 255, 0.12);
2517
- --ogrid-header-bg: rgba(255, 255, 255, 0.06);
2518
- --ogrid-hover-bg: rgba(255, 255, 255, 0.08);
2519
- --ogrid-selected-row-bg: #1a3a5c;
2520
- --ogrid-active-cell-bg: rgba(255, 255, 255, 0.06);
2521
- --ogrid-range-bg: rgba(46, 160, 67, 0.15);
2522
- --ogrid-accent: #4da6ff;
2523
- --ogrid-selection-color: #2ea043;
2524
- --ogrid-loading-overlay: rgba(0, 0, 0, 0.7);
2525
- }
2526
- }
2527
2517
  [data-theme="dark"] {
2528
2518
  --ogrid-bg: #1e1e1e;
2529
2519
  --ogrid-fg: rgba(255, 255, 255, 0.87);
@@ -19,7 +19,14 @@ export declare class DataGridEditingHelper<T> {
19
19
  private getItems;
20
20
  private getWrappedOnCellValueChanged;
21
21
  private setActiveCellFn;
22
- constructor(getVisibleCols: () => IColumnDef<T>[], getItems: () => T[], getWrappedOnCellValueChanged: () => ((event: ICellValueChangedEvent<T>) => void) | undefined, setActiveCellFn: (cell: IActiveCell | null) => void);
22
+ private setSelectionRangeFn;
23
+ private getColOffset;
24
+ constructor(getVisibleCols: () => IColumnDef<T>[], getItems: () => T[], getWrappedOnCellValueChanged: () => ((event: ICellValueChangedEvent<T>) => void) | undefined, setActiveCellFn: (cell: IActiveCell | null) => void, setSelectionRangeFn: (range: {
25
+ startRow: number;
26
+ startCol: number;
27
+ endRow: number;
28
+ endCol: number;
29
+ } | null) => void, getColOffset: () => number);
23
30
  setEditingCell(cell: {
24
31
  rowId: RowId;
25
32
  columnId: string;
@@ -2,4 +2,4 @@
2
2
  * Shared OGrid CSS theme variables (light + dark mode).
3
3
  * Used by all Angular UI packages (Material, PrimeNG, Radix) to avoid duplication.
4
4
  */
5
- export declare const OGRID_THEME_VARS_CSS = "\n/* \u2500\u2500\u2500 OGrid Theme Variables \u2500\u2500\u2500 */\n:root {\n --ogrid-bg: #ffffff;\n --ogrid-fg: rgba(0, 0, 0, 0.87);\n --ogrid-fg-secondary: rgba(0, 0, 0, 0.6);\n --ogrid-fg-muted: rgba(0, 0, 0, 0.5);\n --ogrid-border: rgba(0, 0, 0, 0.12);\n --ogrid-header-bg: rgba(0, 0, 0, 0.04);\n --ogrid-hover-bg: rgba(0, 0, 0, 0.04);\n --ogrid-selected-row-bg: #e6f0fb;\n --ogrid-active-cell-bg: rgba(0, 0, 0, 0.02);\n --ogrid-range-bg: rgba(33, 115, 70, 0.12);\n --ogrid-accent: #0078d4;\n --ogrid-selection-color: #217346;\n --ogrid-loading-overlay: rgba(255, 255, 255, 0.7);\n}\n@media (prefers-color-scheme: dark) {\n :root:not([data-theme=\"light\"]) {\n --ogrid-bg: #1e1e1e;\n --ogrid-fg: rgba(255, 255, 255, 0.87);\n --ogrid-fg-secondary: rgba(255, 255, 255, 0.6);\n --ogrid-fg-muted: rgba(255, 255, 255, 0.5);\n --ogrid-border: rgba(255, 255, 255, 0.12);\n --ogrid-header-bg: rgba(255, 255, 255, 0.06);\n --ogrid-hover-bg: rgba(255, 255, 255, 0.08);\n --ogrid-selected-row-bg: #1a3a5c;\n --ogrid-active-cell-bg: rgba(255, 255, 255, 0.06);\n --ogrid-range-bg: rgba(46, 160, 67, 0.15);\n --ogrid-accent: #4da6ff;\n --ogrid-selection-color: #2ea043;\n --ogrid-loading-overlay: rgba(0, 0, 0, 0.7);\n }\n}\n[data-theme=\"dark\"] {\n --ogrid-bg: #1e1e1e;\n --ogrid-fg: rgba(255, 255, 255, 0.87);\n --ogrid-fg-secondary: rgba(255, 255, 255, 0.6);\n --ogrid-fg-muted: rgba(255, 255, 255, 0.5);\n --ogrid-border: rgba(255, 255, 255, 0.12);\n --ogrid-header-bg: rgba(255, 255, 255, 0.06);\n --ogrid-hover-bg: rgba(255, 255, 255, 0.08);\n --ogrid-selected-row-bg: #1a3a5c;\n --ogrid-active-cell-bg: rgba(255, 255, 255, 0.06);\n --ogrid-range-bg: rgba(46, 160, 67, 0.15);\n --ogrid-accent: #4da6ff;\n --ogrid-selection-color: #2ea043;\n --ogrid-loading-overlay: rgba(0, 0, 0, 0.7);\n}";
5
+ export declare const OGRID_THEME_VARS_CSS = "\n/* \u2500\u2500\u2500 OGrid Theme Variables \u2500\u2500\u2500 */\n:root {\n --ogrid-bg: #ffffff;\n --ogrid-fg: rgba(0, 0, 0, 0.87);\n --ogrid-fg-secondary: rgba(0, 0, 0, 0.6);\n --ogrid-fg-muted: rgba(0, 0, 0, 0.5);\n --ogrid-border: rgba(0, 0, 0, 0.12);\n --ogrid-header-bg: rgba(0, 0, 0, 0.04);\n --ogrid-hover-bg: rgba(0, 0, 0, 0.04);\n --ogrid-selected-row-bg: #e6f0fb;\n --ogrid-active-cell-bg: rgba(0, 0, 0, 0.02);\n --ogrid-range-bg: rgba(33, 115, 70, 0.12);\n --ogrid-accent: #0078d4;\n --ogrid-selection-color: #217346;\n --ogrid-loading-overlay: rgba(255, 255, 255, 0.7);\n}\n[data-theme=\"dark\"] {\n --ogrid-bg: #1e1e1e;\n --ogrid-fg: rgba(255, 255, 255, 0.87);\n --ogrid-fg-secondary: rgba(255, 255, 255, 0.6);\n --ogrid-fg-muted: rgba(255, 255, 255, 0.5);\n --ogrid-border: rgba(255, 255, 255, 0.12);\n --ogrid-header-bg: rgba(255, 255, 255, 0.06);\n --ogrid-hover-bg: rgba(255, 255, 255, 0.08);\n --ogrid-selected-row-bg: #1a3a5c;\n --ogrid-active-cell-bg: rgba(255, 255, 255, 0.06);\n --ogrid-range-bg: rgba(46, 160, 67, 0.15);\n --ogrid-accent: #4da6ff;\n --ogrid-selection-color: #2ea043;\n --ogrid-loading-overlay: rgba(0, 0, 0, 0.7);\n}";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@alaarab/ogrid-angular",
3
- "version": "2.1.6",
3
+ "version": "2.1.8",
4
4
  "description": "OGrid Angular – Angular services, signals, and headless components for OGrid data grids.",
5
5
  "main": "dist/esm/index.js",
6
6
  "module": "dist/esm/index.js",
@@ -35,7 +35,7 @@
35
35
  "node": ">=18"
36
36
  },
37
37
  "dependencies": {
38
- "@alaarab/ogrid-core": "2.1.6"
38
+ "@alaarab/ogrid-core": "2.1.8"
39
39
  },
40
40
  "peerDependencies": {
41
41
  "@angular/core": "^21.0.0",