MudList: Implement selection modes Single-, Toggle- and MultiSelection

MudBlazor / MudBlazor

Blazor Component Library based on Material design with an emphasis on ease of use. Mainly written in C# with Javascript kept to a bare minimum it empowers .NET developers to easily debug it if needed.

http://mudblazor.com

MIT License

7.22k stars 1.18k forks source link

MudList: Implement selection modes Single-, Toggle- and MultiSelection #8775

Closed henon closed 2 weeks ago

henon commented 3 weeks ago

Description

Adds SelectionMode like in MudChipSet, MudTreeView and MudButtonGroup

Renames parameter AdornmentColor to ExpandIconColor Renames parameter OnClickHandlerPreventDefault to OnClickPreventDefault

How Has This Been Tested?

unit | visually

Type of Changes

[ ] Bug fix (non-breaking change which fixes an issue)
[x] New feature (non-breaking change which adds functionality)
[x] Breaking change (fix or feature that would cause existing functionality to not work as expected)
[ ] Documentation (fix or improvement to the website or code docs)

Checklist

[x] The PR is submitted to the correct branch (dev).
[x] My code follows the code style of this project.
[x] I've added relevant tests.

henon commented 3 weeks ago

@mckaragoz FYI, this implements multiselection like you suggested. Is it OK that the nesting items are not selectable themselves in multiselection or what do you say?

Yomodo commented 3 weeks ago

Having the nesting items selectable would be a big help to easily to select al sub-items, provided there's a checkbox on the nested item.

henon commented 3 weeks ago

Ok, makes sense. Interestingly in the current implementation (single-selection only) it is impossible to select a nested list item. If you click it, it just toggles expansion.

henon commented 3 weeks ago

So I guess the best way would be to add Selectable to the items. If it is set, the nested item can be selected by a body click in single-selection as well as multiselection and can only be expanded by a click on the expand button. If unset, it behaves as before.

henon commented 3 weeks ago

We may leave it at nesting items being only for nesting/grouping, not selection. Neither Vuetify nor MUI have such functionality, and I guess for good reason.

henon commented 3 weeks ago

If you look at MUI there are a couple of cool things a list can do, such as show the checkboxes either left or right, or show a switch instead of checkboxes.

The most promising way to implement all these things (as well as tri-state checkboxes for selecting on/off all nested items) would be to implement special list items, i.e. a MudListSwitchActionItem. That's gonna be a project for a future PR though.

codecov[bot] commented 3 weeks ago

Codecov Report

Attention: Patch coverage is 82.02247% with 16 lines in your changes are missing coverage. Please review.

Project coverage is 90.02%. Comparing base (28bc599) to head (02a1bc7). Report is 126 commits behind head on dev.

Files	Patch %	Lines
src/MudBlazor/Components/List/MudList.razor.cs	86.88%	3 Missing and 5 partials :warning:
src/MudBlazor/Components/List/MudListItem.razor.cs	73.07%	0 Missing and 7 partials :warning:
src/MudBlazor/Components/List/MudListItem.razor	0.00%	0 Missing and 1 partial :warning:

Additional details and impacted files

```diff @@ Coverage Diff @@ ## dev #8775 +/- ## ========================================== + Coverage 89.82% 90.02% +0.19% ========================================== Files 412 421 +9 Lines 11878 12286 +408 Branches 2364 2437 +73 ========================================== + Hits 10670 11061 +391 + Misses 681 671 -10 - Partials 527 554 +27 ```

:umbrella: View full report in Codecov by Sentry.
:loudspeaker: Have feedback on the report? Share it here.

henon commented 2 weeks ago

@ScarletKuro do you still want to review this?

henon commented 2 weeks ago

added to v7.0.0 Migration Guide #8447