horizontal scroll in datagrid #113

packages/web/src/datagrid/DataGridCore.svelte

@@ -171,6 +171,7 @@
     if (_.isPlainObject(value) || _.isArray(value)) return JSON.stringify(value);
     return value;
   }
+
 </script>
 
 <script lang="ts">
@@ -663,6 +664,24 @@
   }
 
   function handleGridWheel(event) {
+    if (event.shiftKey) {
+      let newFirstVisibleColumnScrollIndex = firstVisibleColumnScrollIndex;
+      if (event.deltaY > 0) {
+        newFirstVisibleColumnScrollIndex++;
+      }
+      if (event.deltaY < 0) {
+        newFirstVisibleColumnScrollIndex--;
+      }
+      if (newFirstVisibleColumnScrollIndex > maxScrollColumn) {
+        newFirstVisibleColumnScrollIndex = maxScrollColumn;
+      }
+      if (newFirstVisibleColumnScrollIndex < 0) {
+        newFirstVisibleColumnScrollIndex = 0;
+      }
+      firstVisibleColumnScrollIndex = newFirstVisibleColumnScrollIndex;
+
+      domHorizontalScroll.scroll(newFirstVisibleColumnScrollIndex);
+    } else {
       let newFirstVisibleRowScrollIndex = firstVisibleRowScrollIndex;
       if (event.deltaY > 0) {
         newFirstVisibleRowScrollIndex += wheelRowCount;
@@ -681,6 +700,7 @@
 
       domVerticalScroll.scroll(newFirstVisibleRowScrollIndex);
     }
+  }
 
   function getSelectedRowIndexes() {
     if (selectedCells.find(x => x[0] == 'header')) return _.range(0, grider.rowCount);
@@ -958,6 +978,7 @@
   );
 
   const menu = getContextMenu();
+
 </script>
 
 {#if !display || (!isDynamicStructure && (!columns || columns.length == 0))}
@@ -1164,4 +1185,5 @@
     right: 40px;
     bottom: 20px;
   }
+
 </style>