search

microsoft / fluentui-contrib

Monorepo for contributor extension packages to Fluent UI
MIT License
29 stars 31 forks source link

[Feat] Virtualized DataGrid with autoFitColumns: false #176

Open rocketBANG opened 4 months ago

rocketBANG commented 4 months ago

For the virtualized dataGrid (@fluentui-contrib/react-data-grid-react-window), the scrollbar is on the body

This is fine if the columns all fit without a horizontal overflow, however if there is some horizontal scrollbar there's no way to scroll both the body and the headers at the same time. So when autoFitColumns is set to false, this causes issues

overflow-x: auto can be applied to the parent container, but that means the vertical scrollbar won't be visible unless the user scrolls all the way to the right image https://codesandbox.io/p/sandbox/datagrid-body-overflow-forked-ygzvhs?workspaceId=2e8388ff-7617-4f14-8fb7-fe6621520941

overflow-x: auto can be applied to the DataGridBody, but that means the DataGridHeaders won't scroll with the body and the column data and headers will be misaligned image https://codesandbox.io/p/sandbox/datagrid-bodysize-bug-forked-6xqrry?file=%2Fsrc%2Fexample.tsx

(for the sandboxes, try resizing some columns to be larger and then observe the scrollbar positions/behaviours)

it950 commented 1 week ago

I have the same issue: https://github.com/microsoft/fluentui/issues/32837 fluentui v9's progress was slow, and it still wasn't a complete replacement for fluentui v8