Charts
Installation
caveui components are copy-paste Jetpack Compose built entirely on Material 3 — there's no caveui dependency to add. Make sure Material 3 is on your classpath (it ships with the Compose BOM), then copy the Usage snippet below into your project.
kotlin
// build.gradle.kts (module)
dependencies {
implementation(platform("androidx.compose:compose-bom:2025.06.00"))
implementation("androidx.compose.material3:material3")
}Usage
kotlin
@Composable
fun ArcDiagram(
count: Int = 6,
links: List<Pair<Int, Int>> = listOf(0 to 2, 1 to 4, 2 to 5, 0 to 3, 3 to 5),
accent: Color = Color(0xFF8B5CF6),
modifier: Modifier = Modifier,
) {
val draw = remember { Animatable(0f) }
LaunchedEffect(Unit) { draw.animateTo(1f, tween(1100, easing = EaseInOutCubic)) }
Canvas(modifier.fillMaxWidth().height(110.dp)) {
val baseline = size.height - 14.dp.toPx()
val step = size.width / count
fun x(i: Int) = step * i + step / 2
links.forEachIndexed { idx, (a, b) ->
val r = abs(x(b) - x(a)) / 2
val cx = (x(a) + x(b)) / 2
val path = Path().apply {
moveTo(x(a), baseline)
arcTo(Rect(cx - r, baseline - r, cx + r, baseline + r), 180f, 180f, false)
}
val m = PathMeasure().apply { setPath(path, false) }
drawPath(
Path().also { m.getSegment(0f, m.length * draw.value, it, true) },
accent.copy(alpha = 0.7f),
style = Stroke(2.dp.toPx(), cap = StrokeCap.Round),
)
}
repeat(count) { i -> drawCircle(accent, 4.dp.toPx(), Offset(x(i), baseline)) }
}
}