When row selection is enabled, there is a checkbox in the thead that enables users to select or deselect all rows at once. Currently this checkbox is only in the indeterminate state if the user first checks all rows, then unchecks a box. It does not show the indeterminate state if a user just checks a single box.
Instead, the "select all row" checkboxes should show the indeterminate state any time some rows but not all are checked. See the [[ https://www.w3.org/WAI/ARIA/apg/patterns/checkbox/examples/checkbox-mixed/ | APG ]] for an example. In the example below, the "select all rows" checkbox should be in the indeterminate state.
{F53227793}
---
### Acceptance criteria
- [x] The logic for the "select all rows" checkbox is updated to show the indeterminate state any time some but not all rows are selected
- [x] Unit tests are updated accordingly
---
#####Notes
- Checkbox inputs have two states: `checked` and `unchecked`.
- Checkbox inputs have three **visual** states: `checked`, `unchecked`, and `indeterminate`. (Reference: [[ https://css-tricks.com/indeterminate-checkboxes/ | CSS Tricks ]])
- `:indeterminate` is a CSS psuedo-selector. It is not an HTML/DOM attribute. (Reference: [[ https://developer.mozilla.org/en-US/docs/Web/CSS/:indeterminate | MDN docs ]])