Skip to main content


A hook for determining whether a Checkbox group has an indeterminate state.

View source


import { useIsIndeterminate } from '@pluralsight/react'
interface CheckboxGroup {
[k: string]: boolean

useIsIndeterminate(group: CheckboxGroup)


Call useIsIndeterminate at the Effect level of the component in which you wish to determine the state of a Checkbox group:

function Form() {
const [allSelected, setAllSelected] = useState(false)
const [checkboxGroup, setCheckboxGroup] = useState({
one: false,
two: false,
three: false
const isIndeterminate = useIsIndeterminate(checkboxGroup)


  • checkboxGroup: an Object containing the available Checkbox items in a group containing Boolean values describing thier "checked" state.


This hook returns a Boolean value representing if the group is indeterminate.


My hook only returns false even though my Checkboxes are updating in the browser

Make sure you are passing in the correct type of state of an Object containg property names that match the selector of choice you are using for the Checkboxes "checked" state with a Boolean value.

Likewise, make sure you are passing in an Object created from the useState hook to ensure the checkboxGroup parameter is actually changing with the UI.