Android Jetpack Compose cannot change BasicTextField cursor thumb color

Question

Currently I'm working with android jetpack compose BasicTextField. And when I change cursor color, I expect the cursor handle to be changed with the same color as well. But it turns out with a different color. Is this a bug or I did set something wrong?

Here is what I have set

colors = TextFieldDefaults.textFieldColors(
    backgroundColor = Color.Transparent,
    focusedIndicatorColor = colorResource(id = R.color.accent),
    unfocusedIndicatorColor = colorResource(id = R.color.lightest_grey),
    focusedLabelColor = colorResource(id = R.color.secondary_20),
    unfocusedLabelColor = colorResource(id = R.color.light_grey),
    textColor = colorResource(id = R.color.secondary),
    cursorColor = colorResource(id = R.color.secondary),
  )

Answer 1

You have to provide a custom TextSelectionColors.

Something like:

val customTextSelectionColors = TextSelectionColors(
    handleColor = Green,
    backgroundColor = Red
)

CompositionLocalProvider(LocalTextSelectionColors provides customTextSelectionColors) {
    BasicTextField(
        value = text,
        onValueChange = {text = it},
        cursorBrush = SolidColor(Black)
    )
}

Answer 2

CompositionLocalProvider(
    LocalTextSelectionColors provides TextSelectionColors(
        handleColor = /*your custom color*/,
        backgroundColor = /*your custom color*/
    )
) {
//your composable
}