finos / finos/regular-table

How to have different header row height than body row height?

Open
#194 2 comments 1 reaction 0 assignees View on GitHub
Dominant language
JavaScript
Stars
403
Forks
43
Avg merge
3m
Merged PRs (30d)
1

Description

## Support Question

Hi, in the editable data grid example on Perspective's website, the column header row has a height of 36px while the table rows have a height of 23px:
CleanShot 2023-09-19 at 14 38 50@2x

Despite this difference, the virtualization works properly and you can scroll to all rows within the window.

I have tried to accomplish something similar using regular-table, but any time my header row is bigger than my table rows, the table does not render properly. It ends up rendering less rows than fill the available scrolling space.

I have tried looking at the underlying perspective data grid code to figure out how its accomplishing this different header size, but I can't seem to find the solution.

Any guidance on how to render a column header height that is different from the table body row height, without breaking the row virtualization? See this video of the broken behavior:

https://github.com/finos/regular-table/assets/5554373/728cba78-880b-413f-8210-81edb975c83e

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.