---
title: "triStateToggleable"
description: "Configure component to make it toggleable via input and accessibility events with three states:
On, Off and Indeterminate.

TriStateToggleable should be used when there are dependent Toggleables associated to this
component and those can have different values.

This version has no [MutableInteractionSource] or [Indication] parameters, the default indication
from [LocalIndication] will be used. To specify [MutableInteractionSource] or [Indication], use
the other overload.

If you are only creating this triStateToggleable modifier inside composition, consider using the
other overload and explicitly passing `LocalIndication.current` for improved performance. For
more information see the documentation on the other overload."
type: "modifier"
---

<div class='type'>Compose Modifier</div>

<a id='references'></a>
<div class='sourceset sourceset-common'>Common</div>


> **Deprecated** Replaced with new overload that only supports IndicationNodeFactory instances inside LocalIndication, and does not use composed

```kotlin
fun Modifier.triStateToggleable(
    state: ToggleableState,
    enabled: Boolean = true,
    role: Role? = null,
    onClick: () -> Unit,
) =
    composed(
        inspectorInfo =
            debugInspectorInfo {
                name = "triStateToggleable"
                properties["state"] = state
                properties["enabled"] = enabled
                properties["role"] = role
                properties["onClick"] = onClick
            }
    ) {
        val localIndication = LocalIndication.current
        val interactionSource =
            if (localIndication is IndicationNodeFactory) {
                null
            } else {
                remember { MutableInteractionSource() }
            }
        Modifier.triStateToggleable(
            state = state,
            interactionSource = interactionSource,
            indication = localIndication,
            enabled = enabled,
            role = role,
            onClick = onClick,
        )
    }
```


Configure component to make it toggleable via input and accessibility events with three states:
On, Off and Indeterminate.

TriStateToggleable should be used when there are dependent Toggleables associated to this
component and those can have different values.

This version has no `MutableInteractionSource` or `Indication` parameters, the default indication
from `LocalIndication` will be used. To specify `MutableInteractionSource` or `Indication`, use
the other overload.

If you are only creating this triStateToggleable modifier inside composition, consider using the
other overload and explicitly passing `LocalIndication.current` for improved performance. For
more information see the documentation on the other overload.

#### Parameters

| | |
| --- | --- |
| state | current value for the component |
| enabled | whether or not this `triStateToggleable` will handle input events and appear enabled for semantics purposes |
| role | the type of user interface element. Accessibility services might use this to describe the element or do customizations |
| onClick | will be called when user clicks the toggleable. |




<div class='sourceset sourceset-common'>Common</div>


```kotlin
fun Modifier.triStateToggleable(
    state: ToggleableState,
    enabled: Boolean = true,
    role: Role? = null,
    interactionSource: MutableInteractionSource? = null,
    onClick: () -> Unit,
): Modifier
```


Configure component to make it toggleable via input and accessibility events with three states:
On, Off and Indeterminate.

TriStateToggleable should be used when there are dependent Toggleables associated to this
component and those can have different values.

This overload will use the `Indication` from `LocalIndication`. Use the other overload to
explicitly provide an `Indication` instance. Note that this overload only supports
`IndicationNodeFactory` instances provided through `LocalIndication` - it is strongly recommended
to migrate to `IndicationNodeFactory`, but you can use the other overload if you still need to
support `Indication` instances that are not `IndicationNodeFactory`.

If `interactionSource` is `null`, an internal `MutableInteractionSource` will be lazily created
only when needed. This reduces the performance cost of triStateToggleable during composition, as
creating the `indication` can be delayed until there is an incoming
`androidx.compose.foundation.interaction.Interaction`. If you are only passing a remembered
`MutableInteractionSource` and you are never using it outside of triStateToggleable, it is
recommended to instead provide `null` to enable lazy creation. If you need the `Indication` to be
created eagerly, provide a remembered `MutableInteractionSource`.

#### Parameters

| | |
| --- | --- |
| state | current value for the component |
| enabled | whether or not this `triStateToggleable` will handle input events and appear enabled for semantics purposes |
| role | the type of user interface element. Accessibility services might use this to describe the element or do customizations |
| interactionSource | `MutableInteractionSource` that will be used to dispatch `PressInteraction.Press` when this toggleable is pressed. If `null`, an internal `MutableInteractionSource` will be created if needed. |
| onClick | will be called when user clicks the toggleable. |




<div class='sourceset sourceset-common'>Common</div>


```kotlin
fun Modifier.triStateToggleable(
    state: ToggleableState,
    interactionSource: MutableInteractionSource?,
    indication: Indication?,
    enabled: Boolean = true,
    role: Role? = null,
    onClick: () -> Unit,
) =
    clickableWithIndicationIfNeeded(
        interactionSource = interactionSource,
        indication = indication,
    ) { intSource, indicationNodeFactory ->
        TriStateToggleableElement(
            state = state,
            interactionSource = intSource,
            indicationNodeFactory = indicationNodeFactory,
            useLocalIndication = false,
            enabled = enabled,
            role = role,
            onClick = onClick,
        )
    }
```


Configure component to make it toggleable via input and accessibility events with three states:
On, Off and Indeterminate.

TriStateToggleable should be used when there are dependent Toggleables associated to this
component and those can have different values.

If `interactionSource` is `null`, and `indication` is an `IndicationNodeFactory`, an internal
`MutableInteractionSource` will be lazily created along with the `indication` only when needed.
This reduces the performance cost of triStateToggleable during composition, as creating the
`indication` can be delayed until there is an incoming
`androidx.compose.foundation.interaction.Interaction`. If you are only passing a remembered
`MutableInteractionSource` and you are never using it outside of triStateToggleable, it is
recommended to instead provide `null` to enable lazy creation. If you need `indication` to be
created eagerly, provide a remembered `MutableInteractionSource`.

If `indication` is _not_ an `IndicationNodeFactory`, and instead implements the deprecated
`Indication.rememberUpdatedInstance` method, you should explicitly pass a remembered
`MutableInteractionSource` as a parameter for `interactionSource` instead of `null`, as this
cannot be lazily created inside triStateToggleable.

#### Parameters

| | |
| --- | --- |
| state | current value for the component |
| interactionSource | `MutableInteractionSource` that will be used to dispatch `PressInteraction.Press` when this triStateToggleable is pressed. If `null`, an internal `MutableInteractionSource` will be created if needed. |
| indication | indication to be shown when modified element is pressed. Be default, indication from `LocalIndication` will be used. Pass `null` to show no indication, or current value from `LocalIndication` to show theme default |
| enabled | whether or not this `triStateToggleable` will handle input events and appear enabled for semantics purposes |
| role | the type of user interface element. Accessibility services might use this to describe the element or do customizations |
| onClick | will be called when user clicks the toggleable. |




## Code Examples
### TriStateToggleableSample
```kotlin
@Composable
fun TriStateToggleableSample() {
    var checked by remember { mutableStateOf(ToggleableState.Indeterminate) }
    // content that you want to make toggleable
    Text(
        modifier =
            Modifier.triStateToggleable(
                state = checked,
                onClick = {
                    checked =
                        if (checked == ToggleableState.On) ToggleableState.Off
                        else ToggleableState.On
                },
            ),
        text = checked.toString(),
    )
}
```