How can bring the cross button above the box? The Text & Icon are being defined inside a box which is managing stroke & background color as well as shape. I tried putting cross button in parent box and with zIndex of this child box less than the icon’s but didn’t work. Do I need to write custom layout for this?

Code?

Box - alignment TopEnd, and Modifier. padding(4.dp) for the center shape

cc: @Denis

@Kshitij Patil, I tried to insert your code like

@Preview
@Composable
fun CrossButtonPreview() {
    /* Your code */
}

but there were too many errors. It would be nice to have a self-contained example, so we can collaborate easily. Have you solved the problem?

Instead of putting the icon in the box with the border, you could use a container and make them siblings inside it

Try offset

@Denis will share a self contained example tomorrow, I was in bit hurry so just shared a snippet that's responsible for Box & Icon. @Afzal Najam I tried that way but how can I know the dimensions of box so that I can correctly place the icon on it's topRight edge.