argent-grid 0.1.0 → 0.2.0

package/src/lib/rendering/render/primitives.ts

@@ -0,0 +1,161 @@
+/**
+ * Rendering Primitives for Canvas Renderer
+ *
+ * Provides specialized drawing functions for grid UI elements:
+ * - Checkboxes
+ * - Group indicators (expand/collapse)
+ * - Sparklines
+ */
+
+import { SparklineOptions } from '../../types/ag-grid-types';
+import { GridTheme } from './types';
+
+/**
+ * Draw a grid checkbox
+ */
+export function drawCheckbox(
+  ctx: CanvasRenderingContext2D,
+  x: number,
+  y: number,
+  size: number,
+  checked: boolean,
+  theme: GridTheme
+): void {
+  // Draw checkbox border
+  ctx.strokeStyle = theme.borderColor;
+  ctx.lineWidth = 1.2;
+  ctx.strokeRect(Math.floor(x) + 0.5, Math.floor(y) + 0.5, size, size);
+
+  // Draw checkmark if checked
+  if (checked) {
+    ctx.strokeStyle = theme.textCell;
+    ctx.lineWidth = 1.2;
+    ctx.beginPath();
+    const padding = 3;
+    const checkX = x + padding;
+    const checkY = y + size / 2;
+    const checkWidth = size - padding * 2;
+
+    // Draw checkmark
+    ctx.moveTo(checkX, checkY);
+    ctx.lineTo(checkX + checkWidth / 3, checkY + checkWidth / 3);
+    ctx.lineTo(checkX + checkWidth, checkY - checkWidth / 3);
+    ctx.stroke();
+  }
+}
+
+/**
+ * Draw a group expand/collapse indicator
+ */
+export function drawGroupIndicator(
+  ctx: CanvasRenderingContext2D,
+  x: number,
+  y: number,
+  rowHeight: number,
+  expanded: boolean,
+  theme: GridTheme
+): void {
+  ctx.beginPath();
+  ctx.strokeStyle = theme.textCell;
+  ctx.lineWidth = 1;
+  const centerY = Math.floor(y + rowHeight / 2);
+  const size = theme.groupIndicatorSize;
+
+  if (expanded) {
+    // Expanded: horizontal line
+    ctx.moveTo(Math.floor(x), centerY);
+    ctx.lineTo(Math.floor(x + size), centerY);
+  } else {
+    // Collapsed: plus sign
+    const halfSize = size / 2;
+    ctx.moveTo(Math.floor(x), centerY);
+    ctx.lineTo(Math.floor(x + size), centerY);
+    ctx.moveTo(Math.floor(x + halfSize), centerY - halfSize);
+    ctx.lineTo(Math.floor(x + halfSize), centerY + halfSize);
+  }
+  ctx.stroke();
+}
+
+/**
+ * Draw a sparkline within a cell
+ */
+export function drawSparkline(
+  ctx: CanvasRenderingContext2D,
+  data: any[],
+  x: number,
+  y: number,
+  width: number,
+  height: number,
+  options: SparklineOptions
+): void {
+  if (!Array.isArray(data) || data.length === 0) return;
+
+  const padding = options.padding || { top: 4, bottom: 4, left: 4, right: 4 };
+  const drawX = x + (padding.left || 0);
+  const drawY = y + (padding.top || 0);
+  const drawWidth = width - (padding.left || 0) - (padding.right || 0);
+  const drawHeight = height - (padding.top || 0) - (padding.bottom || 0);
+
+  if (drawWidth <= 0 || drawHeight <= 0) return;
+
+  const min = Math.min(...data);
+  const max = Math.max(...data);
+  const range = max - min || 1;
+
+  const type = options.type || 'line';
+
+  ctx.save();
+
+  if (type === 'line' || type === 'area') {
+    ctx.beginPath();
+    for (let i = 0; i < data.length; i++) {
+      const px = drawX + (i / (data.length - 1)) * drawWidth;
+      const py = drawY + drawHeight - ((data[i] - min) / range) * drawHeight;
+
+      if (i === 0) ctx.moveTo(px, py);
+      else ctx.lineTo(px, py);
+    }
+
+    if (type === 'area') {
+      const areaOptions = options.area || {};
+      ctx.lineTo(drawX + drawWidth, drawY + drawHeight);
+      ctx.lineTo(drawX, drawY + drawHeight);
+      ctx.closePath();
+      ctx.fillStyle = areaOptions.fill || 'rgba(33, 150, 243, 0.3)';
+      ctx.fill();
+
+      // Stroke the top line
+      ctx.beginPath();
+      for (let i = 0; i < data.length; i++) {
+        const px = drawX + (i / (data.length - 1)) * drawWidth;
+        const py = drawY + drawHeight - ((data[i] - min) / range) * drawHeight;
+        if (i === 0) ctx.moveTo(px, py);
+        else ctx.lineTo(px, py);
+      }
+    }
+
+    const lineOptions = (type === 'area' ? options.area : options.line) || {};
+    ctx.strokeStyle = lineOptions.stroke || '#2196f3';
+    ctx.lineWidth = lineOptions.strokeWidth || 1.5;
+    ctx.lineJoin = 'round';
+    ctx.lineCap = 'round';
+    ctx.stroke();
+  } else if (type === 'column' || type === 'bar') {
+    const colOptions = options.column || {};
+    const colPadding = colOptions.padding || 0.1;
+    const colWidth = drawWidth / data.length;
+    const barWidth = colWidth * (1 - colPadding);
+
+    ctx.fillStyle = colOptions.fill || '#2196f3';
+
+    for (let i = 0; i < data.length; i++) {
+      const px = drawX + i * colWidth + (colWidth * colPadding) / 2;
+      const valHeight = ((data[i] - min) / range) * drawHeight;
+      const py = drawY + drawHeight - valHeight;
+
+      ctx.fillRect(Math.floor(px), Math.floor(py), Math.floor(barWidth), Math.ceil(valHeight));
+    }
+  }
+
+  ctx.restore();
+}

package/src/lib/rendering/render/theme.spec.ts

@@ -5,17 +5,17 @@
  */
 
 import {
-  DEFAULT_THEME,
+  createTheme,
   DARK_THEME,
-  THEME_PRESETS,
-  mergeTheme,
+  DEFAULT_THEME,
+  getCellBackgroundColor,
   getFontFromTheme,
   getRowTheme,
-  getCellBackgroundColor,
   getThemePreset,
-  createTheme,
+  mergeTheme,
+  THEME_PRESETS,
 } from './theme';
-import { GridTheme, PartialTheme } from './types';
+import { GridTheme } from './types';
 
 describe('Theme System', () => {
   describe('DEFAULT_THEME', () => {
@@ -86,11 +86,7 @@ describe('Theme System', () => {
     });
 
     it('should apply multiple overrides in order', () => {
-      const result = mergeTheme(
-        DEFAULT_THEME,
-        { bgCell: '#ff0000' },
-        { bgCell: '#00ff00' }
-      );
+      const result = mergeTheme(DEFAULT_THEME, { bgCell: '#ff0000' }, { bgCell: '#00ff00' });
 
       expect(result.bgCell).toBe('#00ff00');
     });
@@ -279,4 +275,4 @@ describe('Theme System', () => {
       expect(comfortableFull.fontSize).toBeGreaterThan(DEFAULT_THEME.fontSize);
     });
   });
-});
+});

package/src/lib/rendering/render/theme.ts

@@ -18,7 +18,7 @@ export const DEFAULT_THEME: GridTheme = {
   bgCell: '#ffffff',
   bgCellEven: '#f8f9fa',
   bgHeader: '#f8f9fa',
-  bgSelection: '#e3f2fd',
+  bgSelection: '#d1e9ff', // Clearer blue for selection
   bgHover: '#f0f2f5',
   bgGroupRow: '#f5f5f5',
 
@@ -61,7 +61,7 @@ export const DARK_THEME: PartialTheme = {
 
   textCell: '#cccccc',
   textHeader: '#ffffff',
-  
+
   borderColor: '#3c3c3c',
   headerBorderColor: '#3c3c3c',
   gridLineColor: '#3c3c3c',
@@ -78,13 +78,13 @@ export function mergeTheme(base: GridTheme, ...overrides: PartialTheme[]): GridT
   if (overrides.length === 0) return base;
 
   let result = { ...base };
-  
+
   for (const override of overrides) {
     if (override) {
       result = { ...result, ...override };
     }
   }
-  
+
   return result;
 }
 
@@ -113,7 +113,7 @@ export function getRowTheme(
   if (isSelected) {
     return { bgCell: baseTheme.bgSelection };
   }
-  
+
   if (isHovered) {
     return { bgCell: baseTheme.bgHover };
   }
@@ -192,10 +192,7 @@ export function getThemePreset(name: string): PartialTheme {
 /**
  * Create a complete theme from a preset name and optional overrides
  */
-export function createTheme(
-  presetName: string = 'default',
-  overrides?: PartialTheme
-): GridTheme {
+export function createTheme(presetName: string = 'default', overrides?: PartialTheme): GridTheme {
   const preset = getThemePreset(presetName);
   return mergeTheme(DEFAULT_THEME, preset, overrides || {});
-}
+}

package/src/lib/rendering/render/types.ts

@@ -4,7 +4,7 @@
  * Shared type definitions used across the rendering modules.
  */
 
-import { Column, IRowNode, ColDef, GridApi } from '../../types/ag-grid-types';
+import { ColDef, Column, IRowNode } from '../../types/ag-grid-types';
 
 // ============================================================================
 // CORE RENDERING TYPES
@@ -276,4 +276,4 @@ export interface GridMouseEvent {
   hitTest: HitTestResult;
   canvasX: number;
   canvasY: number;
-}
+}

package/src/lib/rendering/render/walk.spec.ts

@@ -4,22 +4,21 @@
  * Tests for walkColumns, walkRows, walkCells, and related utilities.
  */
 
+import { Column } from '../../types/ag-grid-types';
 import {
-  walkColumns,
-  getPositionedColumns,
-  getPinnedWidths,
-  walkRows,
-  getVisibleRowRange,
-  getRowY,
-  walkCells,
+  calculateVisibleRange,
   getColumnAtX,
   getColumnIndex,
-  getTotalColumnWidth,
+  getPinnedWidths,
+  getPositionedColumns,
   getRowAtY,
+  getRowY,
+  getTotalColumnWidth,
+  getVisibleRowRange,
   isRowVisible,
-  calculateVisibleRange,
+  walkColumns,
+  walkRows,
 } from './walk';
-import { Column } from '../../types/ag-grid-types';
 
 // Helper to create mock columns
 function createMockColumn(overrides: Partial<Column> = {}): Column {
@@ -66,11 +65,11 @@ describe('Walker Functions', () => {
   describe('getVisibleRowRange', () => {
     it('should calculate visible row range with buffer', () => {
       const result = getVisibleRowRange(
-        100,  // scrollTop
-        400,  // viewportHeight
-        32,   // rowHeight
+        100, // scrollTop
+        400, // viewportHeight
+        32, // rowHeight
         1000, // totalRowCount
-        5     // buffer
+        5 // buffer
       );
 
       // Starting row: floor(100/32) = 3, minus buffer = -2 -> clamped to 0
@@ -82,11 +81,11 @@ describe('Walker Functions', () => {
 
     it('should clamp start row to 0', () => {
       const result = getVisibleRowRange(
-        0,    // scrollTop
-        400,  // viewportHeight
-        32,   // rowHeight
+        0, // scrollTop
+        400, // viewportHeight
+        32, // rowHeight
         1000, // totalRowCount
-        5     // buffer
+        5 // buffer
       );
 
       expect(result.startRow).toBe(0);
@@ -94,11 +93,11 @@ describe('Walker Functions', () => {
 
     it('should clamp end row to total row count', () => {
       const result = getVisibleRowRange(
-        0,    // scrollTop
-        400,  // viewportHeight
-        32,   // rowHeight
-        10,   // totalRowCount (small)
-        5     // buffer
+        0, // scrollTop
+        400, // viewportHeight
+        32, // rowHeight
+        10, // totalRowCount (small)
+        5 // buffer
       );
 
       expect(result.endRow).toBeLessThanOrEqual(10);
@@ -116,7 +115,7 @@ describe('Walker Functions', () => {
       const visited: string[] = [];
       const xPositions: number[] = [];
 
-      walkColumns(columns, 0, 400, 50, 75, (col, x, width, isPinned, pinSide) => {
+      walkColumns(columns, 0, 400, 50, 75, (col, x, _width, _isPinned, _pinSide) => {
         visited.push(col.colId);
         xPositions.push(x);
       });
@@ -141,7 +140,7 @@ describe('Walker Functions', () => {
 
       // Scroll so center1 and part of center2 are hidden
       const visited: string[] = [];
-      walkColumns(columns, 150, 400, 50, 75, (col, x, width, isPinned) => {
+      walkColumns(columns, 150, 400, 50, 75, (col, _x, _width, _isPinned) => {
         visited.push(col.colId);
       });
 
@@ -156,7 +155,7 @@ describe('Walker Functions', () => {
       const visited: { row: number; y: number }[] = [];
       const getRowNode = (index: number) => ({ data: { id: index } }) as any;
 
-      walkRows(0, 5, 0, 32, getRowNode, (rowIndex, y, height, rowNode) => {
+      walkRows(0, 5, 0, 32, getRowNode, (rowIndex, y, _height, _rowNode) => {
         visited.push({ row: rowIndex, y });
       });
 
@@ -170,7 +169,7 @@ describe('Walker Functions', () => {
       const visited: { row: number; y: number }[] = [];
       const getRowNode = (index: number) => ({ data: { id: index } }) as any;
 
-      walkRows(10, 15, 320, 32, getRowNode, (rowIndex, y, height, rowNode) => {
+      walkRows(10, 15, 320, 32, getRowNode, (rowIndex, y, _height, _rowNode) => {
         visited.push({ row: rowIndex, y });
       });
 
@@ -255,9 +254,7 @@ describe('Walker Functions', () => {
     });
 
     it('should return null for position outside columns', () => {
-      const columns: Column[] = [
-        createMockColumn({ colId: 'col1', width: 100 }),
-      ];
+      const columns: Column[] = [createMockColumn({ colId: 'col1', width: 100 })];
 
       const result = getColumnAtX(columns, 200, 0, 400);
       expect(result.column).toBeNull();
@@ -311,13 +308,13 @@ describe('Walker Functions', () => {
 
       const range = calculateVisibleRange(
         columns,
-        0,    // scrollTop
-        0,    // scrollLeft
-        400,  // viewportWidth
-        400,  // viewportHeight
-        32,   // rowHeight
-        100,  // totalRowCount
-        5     // buffer
+        0, // scrollTop
+        0, // scrollLeft
+        400, // viewportWidth
+        400, // viewportHeight
+        32, // rowHeight
+        100, // totalRowCount
+        5 // buffer
       );
 
       expect(range.startRow).toBe(0);
@@ -357,4 +354,4 @@ describe('Walker Functions', () => {
       expect(getColumnIndex(columns, 'notfound')).toBe(-1);
     });
   });
-});
+});

package/src/lib/rendering/render/walk.ts

@@ -5,13 +5,13 @@
  * Based on Glide Data Grid's walker architecture.
  */
 
-import { Column, IRowNode, GridApi } from '../../types/ag-grid-types';
-import { 
-  ColumnWalkCallback, 
-  RowWalkCallback, 
+import { Column, GridApi, IRowNode } from '../../types/ag-grid-types';
+import {
   CellWalkCallback,
+  ColumnWalkCallback,
   PositionedColumn,
-  VisibleRange 
+  RowWalkCallback,
+  VisibleRange,
 } from './types';
 
 // ============================================================================
@@ -30,42 +30,44 @@ export function walkColumns(
   rightPinnedWidth: number,
   callback: ColumnWalkCallback
 ): void {
-  const leftPinned = columns.filter(c => c.pinned === 'left');
-  const rightPinned = columns.filter(c => c.pinned === 'right');
-  const centerColumns = columns.filter(c => !c.pinned);
+  const leftPinned = columns.filter((c) => c.pinned === 'left');
+  const rightPinned = columns.filter((c) => c.pinned === 'right');
+  const centerColumns = columns.filter((c) => !c.pinned);
 
   // 1. Left pinned columns (no scroll offset)
   let x = 0;
   for (const col of leftPinned) {
-    callback(col, x, col.width, true, 'left');
-    x += col.width;
+    const width = Math.floor(col.width);
+    callback(col, x, width, true, 'left');
+    x += width;
   }
 
   // 2. Center columns (with scroll offset and clipping)
-  const centerStartX = leftPinnedWidth;
-  const centerEndX = viewportWidth - rightPinnedWidth;
-  const centerWidth = centerEndX - centerStartX;
+  const centerStartX = Math.floor(leftPinnedWidth);
+  const centerEndX = Math.floor(viewportWidth - rightPinnedWidth);
 
-  x = leftPinnedWidth - scrollX;
+  x = centerStartX - scrollX;
   for (const col of centerColumns) {
+    const width = Math.floor(col.width);
     // Skip columns completely outside viewport
-    if (x + col.width < centerStartX) {
-      x += col.width;
+    if (x + width < centerStartX) {
+      x += width;
       continue;
     }
     if (x > centerEndX) {
       break; // Rest of columns are off-screen
     }
 
-    callback(col, x, col.width, false);
-    x += col.width;
+    callback(col, x, width, false);
+    x += width;
   }
 
   // 3. Right pinned columns (no scroll offset)
-  x = viewportWidth - rightPinnedWidth;
+  x = centerEndX;
   for (const col of rightPinned) {
-    callback(col, x, col.width, true, 'right');
-    x += col.width;
+    const width = Math.floor(col.width);
+    callback(col, x, width, true, 'right');
+    x += width;
   }
 }
 
@@ -81,7 +83,12 @@ export function getPositionedColumns(
 ): PositionedColumn[] {
   const result: PositionedColumn[] = [];
 
-  walkColumns(columns, scrollX, viewportWidth, leftPinnedWidth, rightPinnedWidth, 
+  walkColumns(
+    columns,
+    scrollX,
+    viewportWidth,
+    leftPinnedWidth,
+    rightPinnedWidth,
     (column, x, width, isPinned, pinSide) => {
       result.push({ column, x, width, isPinned, pinSide });
     }
@@ -95,12 +102,12 @@ export function getPositionedColumns(
  */
 export function getPinnedWidths(columns: Column[]): { left: number; right: number } {
   const left = columns
-    .filter(c => c.pinned === 'left')
-    .reduce((sum, c) => sum + c.width, 0);
-  
+    .filter((c) => c.pinned === 'left')
+    .reduce((sum, c) => sum + Math.floor(c.width), 0);
+
   const right = columns
-    .filter(c => c.pinned === 'right')
-    .reduce((sum, c) => sum + c.width, 0);
+    .filter((c) => c.pinned === 'right')
+    .reduce((sum, c) => sum + Math.floor(c.width), 0);
 
   return { left, right };
 }
@@ -124,7 +131,7 @@ export function walkRows(
   for (let rowIndex = startRow; rowIndex < endRow; rowIndex++) {
     const y = api ? api.getRowY(rowIndex) - scrollTop : rowIndex * rowHeight - scrollTop;
     const rowNode = getRowNode(rowIndex);
-    const height = (api && rowNode) ? (rowNode.rowHeight || rowHeight) : rowHeight;
+    const height = api && rowNode ? rowNode.rowHeight || rowHeight : rowHeight;
     callback(rowIndex, y, height, rowNode);
   }
 }
@@ -142,19 +149,13 @@ export function getVisibleRowRange(
 ): { startRow: number; endRow: number } {
   if (api) {
     const startRow = Math.max(0, api.getRowAtY(scrollTop) - buffer);
-    const endRow = Math.min(
-      totalRowCount,
-      api.getRowAtY(scrollTop + viewportHeight) + buffer + 1
-    );
+    const endRow = Math.min(totalRowCount, api.getRowAtY(scrollTop + viewportHeight) + buffer + 1);
     return { startRow, endRow };
   }
 
   const startRow = Math.max(0, Math.floor(scrollTop / rowHeight) - buffer);
   const visibleRowCount = Math.ceil(viewportHeight / rowHeight);
-  const endRow = Math.min(
-    totalRowCount,
-    startRow + visibleRowCount + buffer * 2
-  );
+  const endRow = Math.min(totalRowCount, startRow + visibleRowCount + buffer * 2);
 
   return { startRow, endRow };
 }
@@ -180,7 +181,7 @@ export function walkCells(
   scrollX: number,
   scrollTop: number,
   viewportWidth: number,
-  viewportHeight: number,
+  _viewportHeight: number,
   rowHeight: number,
   getRowNode: (index: number) => IRowNode | null,
   callback: CellWalkCallback
@@ -189,8 +190,13 @@ export function walkCells(
 
   // Walk columns for each row
   walkRows(startRow, endRow, scrollTop, rowHeight, getRowNode, (rowIndex, y, height, rowNode) => {
-    walkColumns(columns, scrollX, viewportWidth, leftPinnedWidth, rightPinnedWidth, 
-      (column, x, width, isPinned) => {
+    walkColumns(
+      columns,
+      scrollX,
+      viewportWidth,
+      leftPinnedWidth,
+      rightPinnedWidth,
+      (column, x, width, _isPinned) => {
         callback(column, rowIndex, x, y, width, height, rowNode);
       }
     );
@@ -212,9 +218,9 @@ export function getColumnAtX(
 ): { column: Column | null; index: number; localX: number } {
   const { left: leftPinnedWidth, right: rightPinnedWidth } = getPinnedWidths(columns);
 
-  const leftPinned = columns.filter(c => c.pinned === 'left');
-  const rightPinned = columns.filter(c => c.pinned === 'right');
-  const centerColumns = columns.filter(c => !c.pinned);
+  const leftPinned = columns.filter((c) => c.pinned === 'left');
+  const rightPinned = columns.filter((c) => c.pinned === 'right');
+  const centerColumns = columns.filter((c) => !c.pinned);
 
   // Check left pinned
   if (x < leftPinnedWidth) {
@@ -258,7 +264,7 @@ export function getColumnAtX(
  * Get column index in visible columns array
  */
 export function getColumnIndex(columns: Column[], colId: string): number {
-  return columns.findIndex(c => c.colId === colId);
+  return columns.findIndex((c) => c.colId === colId);
 }
 
 /**
@@ -269,7 +275,7 @@ export function getTotalColumnWidth(columns: Column[]): number {
 }
 
 // ============================================================================
-// ROW UTILITIES  
+// ROW UTILITIES
 // ============================================================================
 
 /**
@@ -291,7 +297,7 @@ export function isRowVisible(
   const y = rowIndex * rowHeight;
   const rowBottom = y + rowHeight;
   const viewportBottom = scrollTop + viewportHeight;
-  
+
   return y < viewportBottom && rowBottom > scrollTop;
 }
 
@@ -313,13 +319,17 @@ export function calculateVisibleRange(
   rowBuffer: number = 5
 ): VisibleRange {
   const { startRow, endRow } = getVisibleRowRange(
-    scrollTop, viewportHeight, rowHeight, totalRowCount, rowBuffer
+    scrollTop,
+    viewportHeight,
+    rowHeight,
+    totalRowCount,
+    rowBuffer
   );
 
   // For columns, we just track indices
-  const centerColumns = columns.filter(c => !c.pinned);
-  const leftPinned = columns.filter(c => c.pinned === 'left');
-  const rightPinned = columns.filter(c => c.pinned === 'right');
+  const centerColumns = columns.filter((c) => !c.pinned);
+  const leftPinned = columns.filter((c) => c.pinned === 'left');
+  const rightPinned = columns.filter((c) => c.pinned === 'right');
 
   const leftPinnedWidth = leftPinned.reduce((sum, c) => sum + c.width, 0);
   const rightPinnedWidth = rightPinned.reduce((sum, c) => sum + c.width, 0);
@@ -357,4 +367,4 @@ export function calculateVisibleRange(
     startColumnIndex,
     endColumnIndex,
   };
-}
+}

package/src/lib/rendering/utils/damage-tracker.spec.ts

@@ -4,12 +4,8 @@
  * Tests for DamageTracker class and related utilities.
  */
 
-import {
-  DamageTracker,
-  getDirtyBounds,
-  mergeRectangles,
-} from './damage-tracker';
 import { DirtyRegions, Rectangle } from '../render/types';
+import { DamageTracker, getDirtyBounds, mergeRectangles } from './damage-tracker';
 
 describe('DamageTracker', () => {
   let tracker: DamageTracker;
@@ -221,7 +217,12 @@ describe('DamageTracker', () => {
         [3, 4],
       ]);
       const cells = tracker.getDirtyCells();
-      expect(cells).toEqual(expect.arrayContaining([[1, 2], [3, 4]]));
+      expect(cells).toEqual(
+        expect.arrayContaining([
+          [1, 2],
+          [3, 4],
+        ])
+      );
     });
   });
 
@@ -441,4 +442,4 @@ describe('mergeRectangles', () => {
   it('should handle empty array', () => {
     expect(mergeRectangles([])).toEqual([]);
   });
-});
+});