fix(datagrid-web): preventScroll on column selector focus

Author: rahmanunver

packages/pluggableWidgets/datagrid-web/CHANGELOG.md

@@ -6,6 +6,10 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 
 ## [Unreleased]
 
+### Fixed
+
+- We fixed an issue where the datagrid's horizontal scrollbar would unexpectedly jump to the right when the column selector was enabled.
+
 ## [3.0.1] - 2025-08-05
 
 ### Fixed

packages/pluggableWidgets/datagrid-web/package.json

@@ -1,7 +1,7 @@
 {
     "name": "@mendix/datagrid-web",
     "widgetName": "Datagrid",
-    "version": "3.0.1",
+    "version": "3.0.2",
     "description": "",
     "copyright": "© Mendix Technology BV 2025. All rights reserved.",
     "license": "Apache-2.0",

packages/pluggableWidgets/datagrid-web/src/components/ColumnSelector.tsx

@@ -56,9 +56,9 @@ export function ColumnSelector(props: ColumnSelectorProps): ReactElement {
                 (refs.floating?.current?.querySelector("li") as HTMLElement)?.focus();
             }, 10);
         } else {
-            // focus back to the button when closing
+            // focus back to the button when closing (prevent scroll to prevent horizontal scroll jumps on initial render)
             setTimeout(() => {
-                (refs.reference?.current as HTMLElement)?.focus();
+                (refs.reference?.current as HTMLElement)?.focus({ preventScroll: true });
             }, 10);
         }
     }, [show]);

packages/pluggableWidgets/datagrid-web/src/package.xml

@@ -1,6 +1,6 @@
 <?xml version="1.0" encoding="utf-8" ?>
 <package xmlns="http://www.mendix.com/package/1.0/">
-    <clientModule name="Datagrid" version="3.0.1" xmlns="http://www.mendix.com/clientModule/1.0/">
+    <clientModule name="Datagrid" version="3.0.2" xmlns="http://www.mendix.com/clientModule/1.0/">
         <widgetFiles>
             <widgetFile path="Datagrid.xml" />
         </widgetFiles>