Add dataframe row and column selections

[LukasMasuch]

Describe your changes

This PR adds row and column selection support to st.dataframe. It can be used like this:

selection = st.dataframe(
    df,
    on_select="rerun",
    selection_mode="single-row"
)

• Demo App

Screen.Recording.2024-04-03.at.19.59.04.mov

GitHub Issue Link (if applicable)

• Closes [Coming soon] Allow dataframe rows to be selectable and trigger a function in Python code #688
• Closes Add st.radio in st.column_config #7134
• [Coming soon] Ability to accept input from Charts, Tables, etc. #455
• Select/Deselect All for st.data_editor - st.column_config.CheckboxColumn #8319

Testing Plan

• Added unit tests
• Added e2e tests (see Add e2e tests for the dataframe selections #8634)

e2e tests

Edit tasklist title

Beta Give feedback Tasklist e2e tests, more options

• Rename
• Copy markdown
• Delete tasklist

Delete tasklist

Delete tasklist block?

Are you sure? All relationships in this tasklist will be removed.

Cancel Delete

1. Single row/column selection

   Single row/column selection
   Options

   • Convert to issue
   • Toggle completion
   • Rename
   • Remove
2. Multi row/column selection

   Multi row/column selection
   Options

   • Convert to issue
   • Toggle completion
   • Rename
   • Remove
3. Mixed selections

   Mixed selections
   Options

   • Convert to issue
   • Toggle completion
   • Rename
   • Remove
4. Screenshot of a dataframe with multiple selections

   Screenshot of a dataframe with multiple selections
   Options

   • Convert to issue
   • Toggle completion
   • Rename
   • Remove
5. Clear selections via toolbar

   Clear selections via toolbar
   Options

   • Convert to issue
   • Toggle completion
   • Rename
   • Remove
6. Clear selections via escape

   Clear selections via escape
   Options

   • Convert to issue
   • Toggle completion
   • Rename
   • Remove
7. Select all rows in multi-row selection via top checkbox

   Select all rows in multi-row selection via top checkbox
   Options

   • Convert to issue
   • Toggle completion
   • Rename
   • Remove
8. Optional: Test drag and drop selection

   Optional: Test drag and drop selection
   Options

   • Convert to issue
   • Toggle completion
   • Rename
   • Remove
9. Optional: Test shift selections

   Optional: Test shift selections
   Options

   • Convert to issue
   • Toggle completion
   • Rename
   • Remove
10. Optional: Test selections in form

    Optional: Test selections in form
    Options

    • Convert to issue
    • Toggle completion
    • Rename
    • Remove
11. Have some test cases work with session state and others with return value

    Have some test cases work with session state and others with return value
    Options

    • Convert to issue
    • Toggle completion
    • Rename
    • Remove
12. Add a test case validating that the callback gets called

    Add a test case validating that the callback gets called
    Options

    • Convert to issue
    • Toggle completion
    • Rename
    • Remove

Add item to e2e tests

---

Contribution License Agreement

By submitting this pull request you agree that all contributions to this project are made under the Apache 2.0 license.

[raethlein]

Could you elaborate a little bit how other elements can impact the editing state of a dataframe widget?

[LukasMasuch]

Added more to the comment. TLDR: if elements are inserted before, it can happen that the components gets unmounted and loses all state.

[LukasMasuch]

btw. this is the case (problem) for all widgets and even non-widgets e.g. tabs or expander can lose the state as well because of this

[raethlein]

There is a lot of new / updated logic in this file but no new unit tests are added to DataFrame.test.tsx. Do you think that e2e tests alone are sufficient?

[LukasMasuch]

The aspects that got added are quite complicated to test with RTL and it would also mostly do the same as our e2e tests, but in a less complete way. Most of the new logic in Dataframe.tsx is related to widget state handling. I plan to migrate this logic into a dedicated custom hook - e.g. useWidgetState - which would also allow better testing. But its something that will require a dedicated follow-up PR.

[raethlein]

🚀