How to exclude a clickable element from the tab order

Question

With Jetpack Compose for Desktop, we can make pretty much any element clickable:

Text("I'm clickable", Modifier.clickable { onClick() })

This causes the element to be included in the tab order, and most of the time that's what you want. But in my case, the interaction that happens on click is also available in another way, so I don't want to force the user to tab through a lot of useless Texts.

How can I exclude the clickable element from the tab order?

Answer 1

Modifier.clickable is a high-level API, you can use a lower-level API to get more flexibility.

To detect tap you can use Modifier.pointerInput with detectTapGestures:

Modifier
    .pointerInput(Unit) {
        detectTapGestures {
            onClick()
        }
    }

Many of the things clickable does won't be added in this case. For example, see this answer on how to add a ripple effect. See Modifier.clickable source code for other things you may need to add.