StaveFocusable.kt

package dev.stave.ui.components

import androidx.compose.foundation.border
import androidx.compose.foundation.interaction.MutableInteractionSource
import androidx.compose.foundation.interaction.collectIsFocusedAsState
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.remember
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.unit.dp
import dev.stave.ui.theme.AccentAmber
import dev.stave.ui.theme.SurfaceRaised

/**
 * Adds the Earhorn focus visual: a 2dp amber border when focused, nothing
 * otherwise (the caller paints its own background). Pair with a Modifier that
 * declares focusability (e.g. clickable).
 */
@Composable
fun Modifier.staveFocusable(
    interactionSource: MutableInteractionSource,
    cornerRadiusDp: Int = 8,
): Modifier {
    val focused by interactionSource.collectIsFocusedAsState()
    val shape = remember(cornerRadiusDp) { RoundedCornerShape(cornerRadiusDp.dp) }
    return this
        .clip(shape)
        .then(
            if (focused) {
                Modifier
                    .border(2.dp, AccentAmber, shape)
            } else {
                Modifier
            }
        )
}