From 1dc387e350c6437f968b2400107101021b25d1f0 Mon Sep 17 00:00:00 2001
From: Yash Raj Singh <yash.raj270998@gmail.com>
Date: Wed, 16 Apr 2025 19:02:48 +0200
Subject: [PATCH 1/8] added some misc dependencies

---
 Project.toml | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/Project.toml b/Project.toml
index 8e4ca8e..b31dd59 100644
--- a/Project.toml
+++ b/Project.toml
@@ -4,8 +4,10 @@ authors = ["Benjamin Lungwitz <benj.lung@googlemail.com> and contributors"]
 version = "0.1.2"
 
 [deps]
+CSV = "336ed68f-0bac-5ca0-87d4-7b16caf5d00b"
 DataFrames = "a93c6f00-e57d-5684-b7b6-d8193f3e46c0"
 HypertextLiteral = "ac1192a8-f4b3-4bfe-ba22-af5b92cd3ab2"
+Revise = "295af30f-e4ad-537b-8983-00126c2a3abe"
 Tables = "bd369af6-aec1-5ad0-b16a-f7cc5008161c"
 
 [compat]

From aaaee5ea3c50ce5f3996fe6427ffd5507d18d672 Mon Sep 17 00:00:00 2001
From: Yash Raj Singh <yash.raj270998@gmail.com>
Date: Wed, 16 Apr 2025 19:03:05 +0200
Subject: [PATCH 2/8] Update PlutoGrid.jl

selection functionality
---
 src/PlutoGrid.jl | 29 ++++++++++++++++++++++++-----
 1 file changed, 24 insertions(+), 5 deletions(-)

diff --git a/src/PlutoGrid.jl b/src/PlutoGrid.jl
index ac6c868..6951ce4 100644
--- a/src/PlutoGrid.jl
+++ b/src/PlutoGrid.jl
@@ -29,10 +29,10 @@ Shows a non-editable table in Pluto.
 `height`: vertical size of the table in Pluto in pixel (default: 600)
 
 """
-function readonly_table(df:: DataFrame; filterable:: Bool=true, kwargs...)
+function readonly_table(df:: DataFrame; filterable:: Bool=true, selectable_rows::Bool = false, kwargs...)
 	column_defs = _make_col_defs(df; filterable)
 	data = _prepare_data(df)
-    return _create_table(column_defs, data; filterable, kwargs...)
+    return _create_table(column_defs, data; filterable, selectable_rows, kwargs...)
 end
 
 readonly_table(df; kwargs...) = readonly_table(DataFrame(df); kwargs...)
@@ -57,10 +57,10 @@ Shows an editable table in Pluto. In case of user edits in the table,
 `height`: vertical size of the table in Pluto in pixel (default: 600)
 
 """
-function editable_table(df:: DataFrame, editable_cols:: AbstractVector{<: AbstractString}=collect(names(df)); filterable:: Bool=true, return_only_modified:: Bool=false, kwargs...)
+function editable_table(df:: DataFrame, editable_cols:: AbstractVector{<: AbstractString}=collect(names(df)); filterable:: Bool=true, selectable_rows::Bool = false, return_only_modified:: Bool=false, kwargs...)
 	column_defs = _make_col_defs(df; filterable, editable_cols)
 	data = _prepare_data(df)
-	return _create_table(column_defs, data; editable=true, filterable, kwargs...)
+	return _create_table(column_defs, data; editable=true, filterable, selectable_rows, kwargs...)
 end
 
 editable_table(df, editable_cols; kwargs...) = editable_table(DataFrame(df), editable_cols; kwargs...)
@@ -69,7 +69,7 @@ editable_table(df; kwargs...) = editable_table(DataFrame(df); kwargs...)
 
 function _create_table(column_defs:: AbstractVector{<: AbstractDict}, data:: AbstractVector; 
 	sortable=true, filterable=true, resizable=true, pagination=false, height:: Integer=600,
-	editable=false, insert=true, delete=true, auto_confirm=false)
+	editable=false, insert=true, delete=true, auto_confirm=false, selectable_rows = false)
 
 	edit_button = @htl("""
 		<button  
@@ -133,6 +133,22 @@ function _create_table(column_defs:: AbstractVector{<: AbstractDict}, data:: Abs
 		})
 	""")
 
+	select_button = @htl("""
+		<button
+		id="select_rows"
+		type="button">
+			Confirm Selection
+		</button>
+	""")
+
+	select_button_callback = JavaScript("""
+    div.querySelector("button#select_rows").addEventListener("click", (e) => {
+        const selectedRows = gridOptions.api.getSelectedRows();
+        div.value = selectedRows;
+        div.dispatchEvent(new CustomEvent("input"));
+    })
+    """)
+
 	checkbox_renderer = JavaScript("""
 	// source: https://stackoverflow.com/a/62173238/14693778
 	function CheckboxRenderer() {}
@@ -168,6 +184,7 @@ function _create_table(column_defs:: AbstractVector{<: AbstractDict}, data:: Abs
 $(editable ? edit_button : "")
 $((editable && insert) ? insert_button : "")
 $((editable && delete) ? delete_button : "")
+$(selectable_rows ? select_button : "")
 
 <script src="https://unpkg.com/ag-grid-community@$(AG_GRID_VERSION)/dist/ag-grid-community.min.js"></script>
 <script>
@@ -188,11 +205,13 @@ $checkbox_renderer
 $(editable ? edit_button_callbacks : JavaScript(""))
 $((editable && insert) ? insert_new_row_callback : JavaScript(""))
 $((editable && delete) ? delete_row_callback : JavaScript(""))
+$(selectable_rows ? select_button_callback : JavaScript(""))
 
 // let the grid know which columns and what data to use
 const gridOptions = {
   columnDefs: columnDefs,
   rowData: rowData,
+  rowSelection: $(selectable_rows ? "multiple" : "none"),
   components: { checkboxRenderer: CheckboxRenderer },
   defaultColDef: {
     filter: $(sortable),

From 77c076180e1a2a76a1fc22787b709bab5ef0d959 Mon Sep 17 00:00:00 2001
From: Yash Raj Singh <yash.raj270998@gmail.com>
Date: Wed, 16 Apr 2025 19:17:57 +0200
Subject: [PATCH 3/8] removed revise to main env

---
 Project.toml | 1 -
 1 file changed, 1 deletion(-)

diff --git a/Project.toml b/Project.toml
index b31dd59..7c68975 100644
--- a/Project.toml
+++ b/Project.toml
@@ -7,7 +7,6 @@ version = "0.1.2"
 CSV = "336ed68f-0bac-5ca0-87d4-7b16caf5d00b"
 DataFrames = "a93c6f00-e57d-5684-b7b6-d8193f3e46c0"
 HypertextLiteral = "ac1192a8-f4b3-4bfe-ba22-af5b92cd3ab2"
-Revise = "295af30f-e4ad-537b-8983-00126c2a3abe"
 Tables = "bd369af6-aec1-5ad0-b16a-f7cc5008161c"
 
 [compat]

From 4832970384805d2c66f7d8fa2617735749fa974d Mon Sep 17 00:00:00 2001
From: Yash Raj Singh <yash.raj270998@gmail.com>
Date: Wed, 16 Apr 2025 19:54:37 +0200
Subject: [PATCH 4/8] Update PlutoGrid.jl

multi select without CTRL key
---
 src/PlutoGrid.jl | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/PlutoGrid.jl b/src/PlutoGrid.jl
index 6951ce4..dee4a94 100644
--- a/src/PlutoGrid.jl
+++ b/src/PlutoGrid.jl
@@ -212,6 +212,7 @@ const gridOptions = {
   columnDefs: columnDefs,
   rowData: rowData,
   rowSelection: $(selectable_rows ? "multiple" : "none"),
+  rowMultiSelectWithClick: true,
   components: { checkboxRenderer: CheckboxRenderer },
   defaultColDef: {
     filter: $(sortable),

From bf783fff2233a638e014133473b2f616ee0011ac Mon Sep 17 00:00:00 2001
From: Yash Raj Singh <yash.raj270998@gmail.com>
Date: Fri, 18 Apr 2025 00:25:18 +0200
Subject: [PATCH 5/8] Update PlutoGrid.jl

pagination enabled
---
 src/PlutoGrid.jl | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/PlutoGrid.jl b/src/PlutoGrid.jl
index dee4a94..6defc73 100644
--- a/src/PlutoGrid.jl
+++ b/src/PlutoGrid.jl
@@ -29,10 +29,10 @@ Shows a non-editable table in Pluto.
 `height`: vertical size of the table in Pluto in pixel (default: 600)
 
 """
-function readonly_table(df:: DataFrame; filterable:: Bool=true, selectable_rows::Bool = false, kwargs...)
+function readonly_table(df:: DataFrame; filterable:: Bool=true, selectable_rows::Bool = false, pagination::Bool = false, kwargs...)
 	column_defs = _make_col_defs(df; filterable)
 	data = _prepare_data(df)
-    return _create_table(column_defs, data; filterable, selectable_rows, kwargs...)
+    return _create_table(column_defs, data; filterable, selectable_rows, pagination, kwargs...)
 end
 
 readonly_table(df; kwargs...) = readonly_table(DataFrame(df); kwargs...)

From 63aaab474b43ec38b121263d3d5c45d5e4c268c5 Mon Sep 17 00:00:00 2001
From: Yash Raj Singh <yash.raj270998@gmail.com>
Date: Fri, 18 Apr 2025 00:28:55 +0200
Subject: [PATCH 6/8] Update PlutoGrid.jl

pagination size
---
 src/PlutoGrid.jl | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/PlutoGrid.jl b/src/PlutoGrid.jl
index 6defc73..db3cabf 100644
--- a/src/PlutoGrid.jl
+++ b/src/PlutoGrid.jl
@@ -230,6 +230,7 @@ const gridOptions = {
     },
   },
   pagination: $(pagination),
+  paginationPageSize: 20,
   undoRedoCellEditing: true,
   onCellValueChanged: (params) => {
 		if (params.oldValue === params.newValue) {

From 03cda42919ea6984ec4db5e3688f5b96f6016633 Mon Sep 17 00:00:00 2001
From: Yash Raj Singh <yash.raj270998@gmail.com>
Date: Fri, 18 Apr 2025 22:22:13 +0200
Subject: [PATCH 7/8] removed select button and added automatic selection
 callback

---
 src/PlutoGrid.jl | 38 +++++++++++++++++++++-----------------
 1 file changed, 21 insertions(+), 17 deletions(-)

diff --git a/src/PlutoGrid.jl b/src/PlutoGrid.jl
index db3cabf..bfe0f68 100644
--- a/src/PlutoGrid.jl
+++ b/src/PlutoGrid.jl
@@ -133,21 +133,21 @@ function _create_table(column_defs:: AbstractVector{<: AbstractDict}, data:: Abs
 		})
 	""")
 
-	select_button = @htl("""
-		<button
-		id="select_rows"
-		type="button">
-			Confirm Selection
-		</button>
-	""")
-
-	select_button_callback = JavaScript("""
-    div.querySelector("button#select_rows").addEventListener("click", (e) => {
-        const selectedRows = gridOptions.api.getSelectedRows();
-        div.value = selectedRows;
-        div.dispatchEvent(new CustomEvent("input"));
-    })
-    """)
+	# select_button = @htl("""
+	# 	<button
+	# 	id="select_rows"
+	# 	type="button">
+	# 		Confirm Selection
+	# 	</button>
+	# """)
+
+	# select_button_callback = JavaScript("""
+    # div.querySelector("button#select_rows").addEventListener("click", (e) => {
+    #     const selectedRows = gridOptions.api.getSelectedRows();
+    #     div.value = selectedRows;
+    #     div.dispatchEvent(new CustomEvent("input"));
+    # })
+    # """)
 
 	checkbox_renderer = JavaScript("""
 	// source: https://stackoverflow.com/a/62173238/14693778
@@ -184,7 +184,7 @@ function _create_table(column_defs:: AbstractVector{<: AbstractDict}, data:: Abs
 $(editable ? edit_button : "")
 $((editable && insert) ? insert_button : "")
 $((editable && delete) ? delete_button : "")
-$(selectable_rows ? select_button : "")
+
 
 <script src="https://unpkg.com/ag-grid-community@$(AG_GRID_VERSION)/dist/ag-grid-community.min.js"></script>
 <script>
@@ -205,7 +205,6 @@ $checkbox_renderer
 $(editable ? edit_button_callbacks : JavaScript(""))
 $((editable && insert) ? insert_new_row_callback : JavaScript(""))
 $((editable && delete) ? delete_row_callback : JavaScript(""))
-$(selectable_rows ? select_button_callback : JavaScript(""))
 
 // let the grid know which columns and what data to use
 const gridOptions = {
@@ -250,6 +249,11 @@ const gridOptions = {
 			div.querySelector("button#update_grid").click();
 		}
 	},
+	onSelectionChanged: (params) => {
+            const selectedRows = params.api.getSelectedRows();
+            div.value = selectedRows;
+            div.dispatchEvent(new CustomEvent("input"));
+        },
 };
 new agGrid.Grid(div, gridOptions);
 

From db51e144ecee91b46f7bf2e347b2d19c43da5e2a Mon Sep 17 00:00:00 2001
From: Yash Raj Singh <yash.raj270998@gmail.com>
Date: Tue, 9 Sep 2025 02:56:00 +0200
Subject: [PATCH 8/8] row selection final and ag-grid version update

---
 src/PlutoGrid.jl | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/src/PlutoGrid.jl b/src/PlutoGrid.jl
index bfe0f68..39a16b2 100644
--- a/src/PlutoGrid.jl
+++ b/src/PlutoGrid.jl
@@ -268,6 +268,13 @@ function _make_col_defs(df; filterable=true, editable_cols=String[])
 	setdiff(editable_cols, names(df)) == [] || error("not all columns defined as editable are in input data")
     
 	column_defs = Dict[]
+	#checkbox rendering in table
+	push!(column_defs, Dict(
+    	"headerCheckboxSelection" => true,   
+        "checkboxSelection" => true,        
+        "width" => 40,
+        "pinned" => "left"
+    ))
 	for c in names(df)
 		col_dict = Dict{String, Any}("field" => c)