refactor: improve multiselect behaviours

[alexfreska]

changes

• Multi-select now supports single select, toggle select, and range selection interactions, with click, ctrl-click, and shift-click.
• Table now prevents default on any mouse down with shift held. This ensures the user does not highlight text while shift selecting a range of rows.
• Renamed selectionMap to selection in the useMultiSelect hook API.

overview

normal click (single select):

• The selection is reduced to the clicked row, and the range selection anchor is updated.
• Clicking the only selected row does not deselect it.

ctrl/cmd-click (toggle select):

• Toggles selection of an individual row without affecting others.
• If selected, updates the anchor to that row.
• If deselected, the anchor is updated to the nearest selected index, first checking higher indices, then lower. If no index is found reset the anchor.

shift-click (range select):

• Always select the full continuous range between the anchor and the clicked row, deselect all rows between the anchor and the last range end from the same anchor.
• Do not update the anchor on shift-click, unless there is none set yet.
• If no anchor is set, the range select will use the top row as the anchor and set the range end to the selected row.

anchor

• Whenever the anchor is updated, the range end is reset.
• Whenever the anchor is reset the range end is also reset.

video

I could not get screenstudio to show the keypresses, but the following video shows some of the new multi-select interactions, such as how ranges are selected and rows between the anchor and the previous range end are deselected.

multiselect.mp4

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
hostd	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Dec 10, 2024 11:52pm
renterd	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Dec 10, 2024 11:52pm

3 Skipped Deployments

Name	Status	Preview	Comments	Updated (UTC)
explorer	⬜️ Ignored (Inspect)	Visit Preview		Dec 10, 2024 11:52pm
explorer-zen	⬜️ Ignored (Inspect)	Visit Preview		Dec 10, 2024 11:52pm
website	⬜️ Ignored (Inspect)	Visit Preview		Dec 10, 2024 11:52pm

[changeset-bot]

🦋 Changeset detected

Latest commit: 60794e6

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 4 packages

Name	Type
@siafoundation/design-system	Minor
hostd	Minor
renterd	Minor
walletd	Minor

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[alexfreska]

• refactor: improve multiselect behaviours #844 👈 (View in Graphite)
• main

This stack of pull requests is managed by Graphite. Learn more about stacking.

[peterjan]

sweet