New DataEditorProp to disable header of a table.

[davidsanchez222]

Why?

In short, I have key-value pair data that I want display as a table in a streamlit web app. It is redundant to have a header row. Streamlit dataframes use the <GlideDataEditor> component under the hood. I want to be able to render the table below using the <GlideDataEditor> component. (notice the lack of a header row)

Details

I opened an issue on streamlit to disable the header for their st.dataframe objects. https://github.com/streamlit/streamlit/issues/8235

When I built their code I realized they are using a <GlideDataEditor> component to display the dataframe so that is what lead me here.

I am making an effort to change it here because

1. The streamlit issue I made got 18 likes, so more people want this feature
2. It is important for a personal project of mine so I am eager to help add this feature.

At first I tried making the headerHeight={0}

which turned this:

into this:

There is two problems with the table above.

1. A sliver of the header is still visible.
2. It leaves an empty row on the bottom so I have to do some hacky data slicing which is hard to do based on how streamlit feeds data into the component.

How?

After perusing the src/data-editor/data-editor.tsx file and inspecting element on the table, I realized that it renders on the page as a canvas element and not a native html table? My background isn't in front end development so this is where I get a little lost.

There is a related issue brought up in the discussion forum in which it is suggested to use CSS. https://community.glideapps.com/t/hide-column-names-of-tables-data-grids-without-data/75678 However, I would rather the component come with the hidden header functionality and not have to do any front end hacks to achieve my desired result

This probably won't be a big priority for the team. However, I am willing to take some time to help implement this. With that being said, can I be pointed in the right direction on how I should code this up? Thanks!