From f4d3befc7c0428825189e65a6073c7bc9dd8b942 Mon Sep 17 00:00:00 2001
From: Debdeep Pal <deep64222@gmail.com>
Date: Fri, 10 Jan 2025 00:38:51 +0530
Subject: [PATCH 1/3] Update package.json version to 1.2.3

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index fd10220..20fa91a 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "spread-diff-patch",
-  "version": "1.2.2",
+  "version": "1.2.3",
   "description": "Diff & patch SpreadSheet files",
   "main": "./lib/index.js",
   "module": "./lib/index.mjs",

From c72b82ed1805f003edd18f5af160910fbd50ab2b Mon Sep 17 00:00:00 2001
From: Debdeep Pal <deep64222@gmail.com>
Date: Wed, 22 Jan 2025 19:55:43 +0530
Subject: [PATCH 2/3] Updated git repo

---
 package.json | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/package.json b/package.json
index 20fa91a..b9108b3 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "spread-diff-patch",
-  "version": "1.2.3",
+  "version": "1.2.4",
   "description": "Diff & patch SpreadSheet files",
   "main": "./lib/index.js",
   "module": "./lib/index.mjs",
@@ -14,14 +14,14 @@
   },
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/dev-DTECH/spread-diff-patch.git"
+    "url": "git+https://github.com/dtech-labs/spread-diff-patch.git"
   },
   "author": "DTech",
   "license": "MIT",
   "bugs": {
-    "url": "https://github.com/dev-DTECH/spread-diff-patch/issues"
+    "url": "https://github.com/dtech-labs/spread-diff-patch/issues"
   },
-  "homepage": "https://github.com/dev-DTECH/spread-diff-patch#readme",
+  "homepage": "https://github.com/dtech-labs/spread-diff-patch#readme",
   "keywords": [
     "csv",
     "html",

From 4a10e6cb14bb1f4ce3d22d07a973a7f1c534e446 Mon Sep 17 00:00:00 2001
From: Debdeep Pal <deep64222@gmail.com>
Date: Fri, 22 Aug 2025 02:15:06 +0530
Subject: [PATCH 3/3] Upgraded performance using AG grid

---
 package.json            |  2 +-
 src/formatter/html.ts   |  2 +-
 src/formatter/script.js | 54 ++++++++++++++++++++++++++++++-----------
 3 files changed, 42 insertions(+), 16 deletions(-)

diff --git a/package.json b/package.json
index b9108b3..2ba8fc0 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "spread-diff-patch",
-  "version": "1.2.4",
+  "version": "1.2.5",
   "description": "Diff & patch SpreadSheet files",
   "main": "./lib/index.js",
   "module": "./lib/index.mjs",
diff --git a/src/formatter/html.ts b/src/formatter/html.ts
index aecdf80..9447ff1 100644
--- a/src/formatter/html.ts
+++ b/src/formatter/html.ts
@@ -41,7 +41,7 @@ export class HTML extends Formatter<string> {
             }
             </style>
             <div id="spread-diff-patch-data" data-raw-diffAOA='${escapeHTML(JSON.stringify(patchedAOA))}'></div>
-            <script src="https://unpkg.com/canvas-datagrid"></script>
+            <script src="https://cdn.jsdelivr.net/npm/ag-grid-community@34.1.2/dist/ag-grid-community.min.js"></script>
             <script>
                 ${script}
             </script>
diff --git a/src/formatter/script.js b/src/formatter/script.js
index e166b3e..3e0d1c3 100644
--- a/src/formatter/script.js
+++ b/src/formatter/script.js
@@ -1,26 +1,52 @@
 /* eslint-disable no-undef */
 function isHTML(str) {
+    if (typeof str !== 'string') return false;
     var doc = new DOMParser().parseFromString(str, "text/html");
     return Array.from(doc.body.childNodes).some(node => node.nodeType === 1);
 }
 
-const diffAOA = JSON.parse(document.querySelector("#spread-diff-patch-data").dataset.rawDiffaoa)
+const diffAOA = JSON.parse(document.querySelector("#spread-diff-patch-data").dataset.rawDiffaoa);
 
 const app = document.querySelector('#spread-diff-patch');
 const gridElement = document.createElement('div');
-gridElement.id = "diff-grid"
-const grid = canvasDatagrid({
-    parentNode: gridElement,
-    editable: false,
-});
-
+gridElement.id = "diff-grid";
+gridElement.style.height = '100vh';
+gridElement.style.width = '100%';
+gridElement.className = 'ag-theme-alpine'; // or other theme
 app.append(gridElement);
 
-grid.style.height = '100%';
-grid.style.width = '100%';
-grid.data = diffAOA
+// Generate column definitions
+const columnDefs = diffAOA[0] ? diffAOA[0].map((_, index) => ({
+    headerName: String.fromCharCode(65 + index), // A, B, C...
+    field: String(index),
+    cellRenderer: params => {
+        if (isHTML(params.value)) {
+            const e = document.createElement("div")
+            e.innerHTML = params.value
+            return e
+        }
+        return params.value
+    }
+})) : [];
+
+// Convert array of arrays to array of objects
+const rowData = diffAOA.map(row => {
+    const rowObject = {};
+    row.forEach((cell, index) => {
+        rowObject[String(index)] = cell;
+    });
+    return rowObject;
+});
+
+const gridOptions = {
+    columnDefs: columnDefs,
+    rowData: rowData,
+    defaultColDef: {
+        editable: false,
+        sortable: true,
+        filter: true,
+        resizable: true
+    }
+};
 
-grid.addEventListener('afterrendercell', function (e) {
-    if (isHTML(e.cell.value))
-        e.cell.innerHTML = e.cell.value
-});
\ No newline at end of file
+agGrid.createGrid(gridElement, gridOptions);