---
title: "clickable"
description: "Configure component to receive clicks via input or accessibility \"click\" event.

Add this modifier to the element to make it clickable within its bounds and show a default
indication when it's pressed.

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 clickable 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.

If you need to support double click or long click alongside the single click, consider using
[combinedClickable].

***Note*** Any removal operations on Android Views from `clickable` should wrap `onClick` in a
`post { }` block to guarantee the event dispatch completes before executing the removal. (You do
not need to do this when removing a composable because Compose guarantees it completes via the
snapshot state system.)"
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.clickable(
    enabled: Boolean = true,
    onClickLabel: String? = null,
    role: Role? = null,
    onClick: () -> Unit,
) =
    composed(
        inspectorInfo =
            debugInspectorInfo {
                name = "clickable"
                properties["enabled"] = enabled
                properties["onClickLabel"] = onClickLabel
                properties["role"] = role
                properties["onClick"] = onClick
            }
    ) {
        val localIndication = LocalIndication.current
        val interactionSource =
            if (localIndication is IndicationNodeFactory) {
                null
            } else {
                remember { MutableInteractionSource() }
            }
        Modifier.clickable(
            enabled = enabled,
            onClickLabel = onClickLabel,
            onClick = onClick,
            role = role,
            indication = localIndication,
            interactionSource = interactionSource,
        )
    }
```


Configure component to receive clicks via input or accessibility "click" event.

Add this modifier to the element to make it clickable within its bounds and show a default
indication when it's pressed.

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 clickable 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.

If you need to support double click or long click alongside the single click, consider using
`combinedClickable`.

***Note*** Any removal operations on Android Views from `clickable` should wrap `onClick` in a
`post { }` block to guarantee the event dispatch completes before executing the removal. (You do
not need to do this when removing a composable because Compose guarantees it completes via the
snapshot state system.)

#### Parameters

| | |
| --- | --- |
| enabled | Controls the enabled state. When `false`, `onClick`, and this modifier will appear disabled for accessibility services |
| onClickLabel | semantic / accessibility label for the `onClick` action |
| 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 on the element |




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


```kotlin
fun Modifier.clickable(
    enabled: Boolean = true,
    onClickLabel: String? = null,
    role: Role? = null,
    interactionSource: MutableInteractionSource? = null,
    onClick: () -> Unit,
): Modifier
```


Configure component to receive clicks via input or accessibility "click" event.

Add this modifier to the element to make it clickable within its bounds and show a default
indication when it's pressed.

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 clickable 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 clickable, it is recommended to
instead provide `null` to enable lazy creation. If you need the `Indication` to be created
eagerly, provide a remembered `MutableInteractionSource`.

If you need to support double click or long click alongside the single click, consider using
`combinedClickable`.

***Note*** Any removal operations on Android Views from `clickable` should wrap `onClick` in a
`post { }` block to guarantee the event dispatch completes before executing the removal. (You do
not need to do this when removing a composable because Compose guarantees it completes via the
snapshot state system.)

#### Parameters

| | |
| --- | --- |
| enabled | Controls the enabled state. When `false`, `onClick`, and this modifier will appear disabled for accessibility services |
| onClickLabel | semantic / accessibility label for the `onClick` action |
| 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 clickable is pressed. If `null`, an internal `MutableInteractionSource` will be created if needed. |
| onClick | will be called when user clicks on the element |




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


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


Configure component to receive clicks via input or accessibility "click" event.

Add this modifier to the element to make it clickable within its bounds and show an indication as
specified in `indication` parameter.

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 clickable 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 clickable, 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 clickable.

If you need to support double click or long click alongside the single click, consider using
`combinedClickable`.

***Note*** Any removal operations on Android Views from `clickable` should wrap `onClick` in a
`post { }` block to guarantee the event dispatch completes before executing the removal. (You do
not need to do this when removing a composable because Compose guarantees it completes via the
snapshot state system.)

#### Parameters

| | |
| --- | --- |
| interactionSource | `MutableInteractionSource` that will be used to dispatch `PressInteraction.Press` when this clickable is pressed. If `null`, an internal `MutableInteractionSource` will be created if needed. |
| indication | indication to be shown when modified element is pressed. By default, indication from `LocalIndication` will be used. Pass `null` to show no indication, or current value from `LocalIndication` to show theme default |
| enabled | Controls the enabled state. When `false`, `onClick`, and this modifier will appear disabled for accessibility services |
| onClickLabel | semantic / accessibility label for the `onClick` action |
| 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 on the element |




## Code Examples
### ClickableSample
```kotlin
@Composable
fun ClickableSample() {
    val count = remember { mutableStateOf(0) }
    // content that you want to make clickable
    Text(text = count.value.toString(), modifier = Modifier.clickable { count.value += 1 })
}
```