From 45b86b1fa3b94c827f25c4c446450eb7303306e7 Mon Sep 17 00:00:00 2001
From: Dominik Ritter <dritter03@googlemail.com>
Date: Tue, 11 May 2021 20:31:26 +0200
Subject: [PATCH 1/4] Update default svelte version

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

diff --git a/package.json b/package.json
index ddcb4f7..1122341 100644
--- a/package.json
+++ b/package.json
@@ -40,7 +40,7 @@
     "benchmark": "^2.1.4",
     "jest": "^25.1.0",
     "jsdom": "^16.2.2",
-    "svelte": "^3.20.1",
+    "svelte": "^3.38.2",
     "svelte-jester": "^1.0.5"
   },
   "jest": {

From 6876a7a258fd76c74b723668cc491066f3accc93 Mon Sep 17 00:00:00 2001
From: Dominik Ritter <dritter03@googlemail.com>
Date: Tue, 11 May 2021 20:33:11 +0200
Subject: [PATCH 2/4] Enable grouping of rows (multiple tbodies)

---
 src/ExtendedTable.svelte | 28 +++++++++++++++++++++++-----
 1 file changed, 23 insertions(+), 5 deletions(-)

diff --git a/src/ExtendedTable.svelte b/src/ExtendedTable.svelte
index 708b396..daba033 100644
--- a/src/ExtendedTable.svelte
+++ b/src/ExtendedTable.svelte
@@ -9,6 +9,7 @@
     export let columns = [];
     export let rows = {
         classNames: [],
+        group: () => false,
     };
     const defaultRowClickHandler = (row) => true;
     export let onRowClick = defaultRowClickHandler;
@@ -108,6 +109,16 @@
         }
     }
 
+    const openTBody = () => {
+        console.log('Opening TBODY');
+        return '<tbody>';
+    }
+
+    const closeTBody = () => {
+        console.log('Closing TBODY');
+        return '</tbody>';
+    }
+
     let slots = new Set($$props.$$slots ? Object.getOwnPropertyNames($$props.$$slots) : []);
 </script>
 
@@ -121,7 +132,7 @@
         position: relative;
     }
 
-    tbody tr:hover {
+    table tr:hover {
         background-color: rgba(0, 0, 0, 0.1);
     }
 
@@ -137,12 +148,12 @@
         font-weight: 700;
     }
 
-    tbody .row-even {
+    tr.row-even {
         background: rgba(153, 202, 255, 0.15);
         border-bottom: 0;
     }
 
-    tbody .col-even {
+    tr.col-even {
         background: rgba(153, 202, 255, 0.15);
     }
 
@@ -179,8 +190,13 @@
         </tr>
         <slot name="additionalHeaderRow"></slot>
     </thead>
-    <tbody>
         {#each data as d, rowIndex}
+            {#if rowIndex === 0 || rows.group(d, rowIndex)}
+                {#if rowIndex > 0}
+                    {@html closeTBody()}
+                {/if}
+                {@html openTBody()}
+            {/if}
             <tr on:click={() => onRowClick(d)} class="{getRowClasses(rowIndex, rows.classNames, d)}" class:mouse-pointer={onRowClick !== defaultRowClickHandler}>
                 {#each columns as column, columnIndex}
                     <td on:click={(event) => onCellClick(event, column, d, columnIndex)} class="{getCellClasses(columnIndex, rowIndex, column, d)}" class:hidden={column.hidden}>
@@ -241,7 +257,9 @@
                 {/each}
             </tr>
             <slot name="additionalRow" rowData={d}></slot>
+            {#if rowIndex === data.length -1}
+                {@html closeTBody()}
+            {/if}
         {/each}
-    </tbody>
 </table>
 </div>
\ No newline at end of file

From 0e00a9b673beda43976630a8ca5f7bf35123dddc Mon Sep 17 00:00:00 2001
From: Dominik Ritter <dritter03@googlemail.com>
Date: Tue, 11 May 2021 20:34:11 +0200
Subject: [PATCH 3/4] Update grouping example

---
 examples/theming/App.svelte | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/examples/theming/App.svelte b/examples/theming/App.svelte
index 208f150..52c1790 100644
--- a/examples/theming/App.svelte
+++ b/examples/theming/App.svelte
@@ -34,6 +34,9 @@
             {value: (data, rowIndex) => (rowIndex + 1) % 2 === 0 ? data.last_name : ""},
             {value: (data, rowIndex) => data.title === "mr" ? "male my-other-class" : ""},
         ],
+        group: (data, rowIndex) => {
+            return rowIndex % 3 === 0;
+        },
     };
 
     let data = rawData.slice(0, 10);

From dbe5e4187a0c1828a0a426f0355e12ada8cbdbb2 Mon Sep 17 00:00:00 2001
From: Dominik Ritter <dritter03@googlemail.com>
Date: Tue, 11 May 2021 20:34:34 +0200
Subject: [PATCH 4/4] Update example to work with newer svelte version

---
 examples/full/App.svelte | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/examples/full/App.svelte b/examples/full/App.svelte
index 1f149cf..f119213 100644
--- a/examples/full/App.svelte
+++ b/examples/full/App.svelte
@@ -149,11 +149,11 @@
         </tr>
     </ExtendedTable>
 </div>
-<Pagination totalPages={pages} activePage={activePage} on:change={(event) => rows = getPage(event.detail.page, filteredAndSortedRows)} />
+<Pagination totalPages={pages} activePage={activePage} on:blur={(event) => rows = getPage(event.detail.page, filteredAndSortedRows)} />
 
 <div>
     Show
-    <select bind:value={itemsPerPage} on:change={switchShownItemsPerPage}>
+    <select bind:value={itemsPerPage} on:blur={switchShownItemsPerPage}>
         {#each [5, 10, 20] as itemsPerPage}
             <option value={itemsPerPage}>
                 {itemsPerPage}