MudSwitch with TriState similar to MudCheckBox

[pierre1012]

Feature request type

Enhance component

Component name

MudSwitch

Is your feature request related to a problem?

Not related to a problem, our users are often requesting this feature to a point that they convinced us to open this Issue. The switch is a popular component and is more preferable than the checkbox.

You would make a lot of people happy if this feature was available. :)

Describe the solution you'd like

We would like a similar feature for the MudSwitch component which the MudCheckBox already has related to indeterminate state.

Example:

<MudSwitch @bind-Checked="triValue" IndeterminateColor="Color.Default" CheckedColor="Color.Success" UnCheckedColor="Color.Error" TriState="true" />

@code {
    public bool? triValue { get; set; } = null;
}

The Indeterminate state would be in the center, true right and false left.

Have you seen this feature anywhere else?

Describe alternatives you've considered

No response

Pull Request

• [ ] I would like to do a Pull Request

Code of Conduct

• [X] I agree to follow this project's Code of Conduct

[Yomodo]

The Indeterminate state would be in the center, true left and false right.

Shouldn't it be: false left, true right?

[pierre1012]

You are right! I've corrected it. Thanks for the heads up.

[mckaragoz]

I don't know what users think, but im totally against of it. Users can use slider if they want 3 states. Thumb-in-the-middle switch not sound user friendly

[Yomodo]

Apparently, this feature request emerged from users request. Our team also had many requests about this feature and it's in our backlog, so there's certainly a need for this.

Also, it makes migrating one's app from checkboxes to the more modern switches a lot easier when the switch can handle tri-state.

[pierre1012]

I don't know what users think, but im totally against of it. Users can use slider if they want 3 states. Thumb-in-the-middle switch not sound user friendly

We do not require exactly a 3 state switch.

To summarize our situation:

1. We currently have wizard styled pages where the user is required to select True or False before they can progress the next step.
2. Some questions cannot be True of False by default. It requires the input from the user to select the value before we allow the user to continue.
3. This means; once the user has made the decision, the user should not have the ability to return the switch to an indeterminate state.
4. Unfortunately, your suggestion on using a 3 state slider in combination with the switches does not look that pretty. This also allows the user to put the slider back in the middle (indeterminate state).

I hope this clarifies what we are looking for.

[mckaragoz]

https://m3.material.io/components/switch/guidelines

Material clearly says switch is design for true or false selection. Material even doesn't suggest use switch on opposing options, instead of they offer button group.

I also think switch is not design for "swipe", its a "click or touch" control. Imagine we have null valued switch, so user swipe left to the switch for false (because if user touch it, it goes to true)? It's a slider thing. Switch's power is its simplicity, just touch and make immediate change.

For your 4.th argument, if you find slider solution is not pretty, this also means switch is not pretty for this aim 🙂

And the last, i think if we can't give a default answer to a question, switch doesn't fit to use.

[Yomodo]

Yes, Material clearly says that, but Mudblazor says: Blazor Component Library based on Material design, so why should we not improve upon if possible and there are use-cases for it?

Perhaps we should ask for a new <MudTriStateSwitch/> component then.

[mckaragoz]

It sounds more like a "community" or "extension" component 🙂

[Yomodo]

It sounds more like a "community" or "extension" component 🙂

Perhaps a better fit yeah.

[DaveRMaltby]

For anyone desiring this feature, here's a possible alternate solution to this feature request, I made a basic pushbutton style example that acts like it is one control.