[Button] Add three-valued button

[sergeyprokhorenko]

Search keywords

three-valued button checkbox

Latest version

• I have tested the latest version

Summary

The three-valued button represents a control that implements the three-valued logic.

The true state is equivalent to the checked state of the checkbox.
The unknown state is equivalent to the unchecked state of the checkbox.
The false state has no equivalent for the checkbox. This state means prohibition of the specified search criterion.
The all state is equivalent to the undefined state of the checkbox.

These states must be looped (but it is preferable to use a dropdown list/menu of states):

• unknown -> true -> false -> unknown
• all -> true -> false -> unknown -> all (for group button)

Examples

There are only homemade solutions now that are similar to my proposal, for example, in Nigma search engine:

Motivation

This new feature should be used instead of a checkbox, for example, to apply or prohibit the specified search criterion from a list of criteria.

[mj12albert]

@sergeyprokhorenko Material UI checkboxes already support 3 states - checked (true), unchecked (false), and indeterminate or mixed (which would correspond to your unknown state)

For the 4th visual state ("all") you are proposing, do you have some more examples of this in the wild? (It could be a simple customization in userland but I'm just thinking out loud)

It could also be addressed by: mui/base-ui#24

[sergeyprokhorenko]

@mj12albert I can't agree with you. See this article: Indeterminate checkboxes are weird

You will never see an individual checkbox in the indeterminate state. But it is the unchecked state that means the absence of any conditions or requirements. The unchecked state means unknown, and not prohibited. Therefore, it is necessary to add a prohibiting state false.

The indeterminate state does not refer to any one individual checkbox. It refers only to a group checkbox and means that the checkboxes in the group can be in any state. I call this state all (states of buttons in the group).

[sergeyprokhorenko]