Cards
Cards

Weekly Activity

Seven-day active-minutes bar chart highlighting today with an accent bar.

Active Minutes
M
T
W
T
F
S
S

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 WeeklyActivityCard() {
  val days = listOf("M","T","W","T","F","S","S")
  val vals = listOf(40, 65, 30, 80, 55, 90, 45)
  val today = 5
  OutlinedCard(Modifier.fillMaxWidth()) {
    Column(Modifier.padding(20.dp)) {
      Text(
        "Active Minutes",
        style = MaterialTheme.typography.titleMedium
      )
      Spacer(Modifier.height(16.dp))
      Row(
        Modifier.fillMaxWidth().height(90.dp),
        horizontalArrangement = Arrangement.SpaceBetween,
        verticalAlignment = Alignment.Bottom
      ) {
        vals.forEachIndexed { i, v ->
          Column(
            horizontalAlignment =
              Alignment.CenterHorizontally
          ) {
            Box(
              Modifier
                .width(16.dp)
                .height((v * 0.8).dp)
                .background(
                  if (i == today)
                    MaterialTheme.colorScheme.primary
                  else MaterialTheme.colorScheme
                    .primary.copy(alpha = 0.3f),
                  RoundedCornerShape(6.dp)
                )
            )
            Spacer(Modifier.height(6.dp))
            Text(
              days[i],
              style = MaterialTheme.typography.labelSmall
            )
          }
        }
      }
    }
  }
}