Added scrollbars

src/myfasthtml/controls/DataGrid.py

@@ -281,11 +281,11 @@ class DataGrid(MultipleInstance):
   def mk_body(self):
     return Div(
       *self.mk_body_content_page(0),
-      cls="dt2-body",
-      id=f"tb_{self._id}",
+      cls="dt2-body"
     )
   
   def mk_footers(self):
+    return self.mk_headers()
     return Div(
       *[Div(
         *[self.mk_aggregation_cell(col_def, row_index, footer) for col_def in self._state.columns],
@@ -299,11 +299,43 @@ class DataGrid(MultipleInstance):
   
   def mk_table(self):
     return Div(
-      self.mk_headers(),
-      self.mk_body(),
-      self.mk_footers(),
-      cls="dt2-table",
-      id=f"t_{self._id}",
+      # Grid table with header, body, footer
+      Div(
+        # Header container - no scroll
+        Div(
+          self.mk_headers(),
+          cls="dt2-header-container"
+        ),
+        # Body container - scroll via JS, scrollbars hidden
+        Div(
+          self.mk_body(),
+          cls="dt2-body-container",
+          id=f"tb_{self._id}"
+        ),
+        # Footer container - no scroll
+        Div(
+          self.mk_footers(),
+          cls="dt2-footer-container"
+        ),
+        cls="dt2-table",
+        id=f"t_{self._id}"
+      ),
+      # Custom scrollbars overlaid
+      Div(
+        # Vertical scrollbar wrapper (right side)
+        Div(
+          Div(cls="dt2-scrollbars-vertical"),
+          cls="dt2-scrollbars-vertical-wrapper"
+        ),
+        # Horizontal scrollbar wrapper (bottom)
+        Div(
+          Div(cls="dt2-scrollbars-horizontal"),
+          cls="dt2-scrollbars-horizontal-wrapper"
+        ),
+        cls="dt2-scrollbars"
+      ),
+      cls="dt2-table-wrapper",
+      id=f"tw_{self._id}"
     )
   
   def mk_aggregation_cell(self, col_def, row_index: int, footer_conf, oob=False):
@@ -371,13 +403,12 @@ class DataGrid(MultipleInstance):
   def render(self):
     if self._state.ne_df is None:
       return Div("No data to display !")
-    
+
     return Div(
-      Div(
-        self.mk_table(),
-        # Script(f"bindDatagrid('{self._id}', false);"),
-      ),
-      id=self._id
+      self.mk_table(),
+      Script(f"initDataGridScrollbars('{self._id}');"),
+      id=self._id,
+      style="height: 100%;"
     )
   
   def __ft__(self):