New Component: Selectable Grid

Custom Components
,
1

For anyone interested in a selectable grid that gives you feedback on which cell is selected, I’ve made a custom component for it!

pip install st-selectable-grid

You can check it out, along with the documentation, here: st-selectable-grid · PyPI

Here’s an example of much of what you can do with it:

1000014750
1000014750524×289 11.1 KB

Which returns:
{"primary": {"x": col_index, "y": row_index}}

Features:

  • Interactive grid with selectable cells
  • Support for headers and row indices
  • Customizable cell colors and aspect ratio
  • Primary (left-click) and secondary (right-click) selections
  • Tooltips on hover
  • Cell marking with indicator dots
  • Responsive design with positioning options
  • Fixed or flexible sizing options
  • HTML formatting support for cell content
3 Likes
2

thank you! Great feature, it compensates for streamlit cell click events. If column headings can be fixed and columns and rows can be selectively frozen, it would be even more perfect. When there is a lot of data, it is more user-friendly. What’s your opinion?

3

Hi, I’m not exactly sure what you mean by that. You can choose the column/row names (or leave them blank if you want). You can also set the backgrounds for the column headers and make the column headers selectable if you so choose.

While this is similar to the future “selectable cells in a data frame” feature that streamlit will inevitably implement, it has a slightly different use case and feel. The grid is meant to be all on screen at once. You’re able to select two cells at once if desired. You can change the aspect ratio of the grid to take more unique shapes. The grid is meant to be more visual (hence the “marker”) than it is for viewing raw data. Hope this helps!