feat: use Material You colors throughout Thunderbird

app-thunderbird/build.gradle.kts

@@ -222,6 +222,7 @@ val fullBetaImplementation = configurations.create("fullBetaImplementation")
 val fullReleaseImplementation = configurations.create("fullReleaseImplementation")
 
 dependencies {
+    implementation(libs.android.material)
     implementation(projects.appCommon)
     implementation(projects.core.ui.compose.common)
     implementation(projects.core.ui.legacy.theme2.thunderbird)

app-thunderbird/src/main/res/values-v31/colors.xml

@@ -0,0 +1,118 @@
+<?xml version="1.0" encoding="utf-8"?>
+<resources>
+    <!--
+      The legacy inbox still consumes the Thunderbird XML theme. Override its color
+      tokens at the app boundary so views and Compose use the same Android 12+
+      wallpaper palette without changing the shared K-9/Thunderbird theme module.
+    -->
+
+    <!-- Light theme -->
+    <color name="lightPrimary">@color/m3_sys_color_dynamic_light_primary</color>
+    <color name="lightOnPrimary">@color/m3_sys_color_dynamic_light_on_primary</color>
+    <color name="lightPrimaryContainer">@color/m3_sys_color_dynamic_light_primary_container</color>
+    <color name="lightOnPrimaryContainer">@color/m3_sys_color_dynamic_light_on_primary_container</color>
+
+    <color name="lightSecondary">@color/m3_sys_color_dynamic_light_secondary</color>
+    <color name="lightOnSecondary">@color/m3_sys_color_dynamic_light_on_secondary</color>
+    <color name="lightSecondaryContainer">@color/m3_sys_color_dynamic_light_secondary_container</color>
+    <color name="lightOnSecondaryContainer">@color/m3_sys_color_dynamic_light_on_secondary_container</color>
+
+    <color name="lightTertiary">@color/m3_sys_color_dynamic_light_tertiary</color>
+    <color name="lightOnTertiary">@color/m3_sys_color_dynamic_light_on_tertiary</color>
+    <color name="lightTertiaryContainer">@color/m3_sys_color_dynamic_light_tertiary_container</color>
+    <color name="lightOnTertiaryContainer">@color/m3_sys_color_dynamic_light_on_tertiary_container</color>
+
+    <color name="lightError">@color/m3_sys_color_light_error</color>
+    <color name="lightOnError">@color/m3_sys_color_light_on_error</color>
+    <color name="lightErrorContainer">@color/m3_sys_color_light_error_container</color>
+    <color name="lightOnErrorContainer">@color/m3_sys_color_light_on_error_container</color>
+
+    <color name="lightSurfaceDim">@color/m3_sys_color_dynamic_light_surface_dim</color>
+    <color name="lightSurface">@color/m3_sys_color_dynamic_light_surface</color>
+    <color name="lightSurfaceBright">@color/m3_sys_color_dynamic_light_surface_bright</color>
+    <color name="lightOnSurface">@color/m3_sys_color_dynamic_light_on_surface</color>
+    <color name="lightOnSurfaceVariant">@color/m3_sys_color_dynamic_light_on_surface_variant</color>
+
+    <color name="lightSurfaceContainerLowest">@color/m3_sys_color_dynamic_light_surface_container_lowest</color>
+    <color name="lightSurfaceContainerLow">@color/m3_sys_color_dynamic_light_surface_container_low</color>
+    <color name="lightSurfaceContainer">@color/m3_sys_color_dynamic_light_surface_container</color>
+    <color name="lightSurfaceContainerHigh">@color/m3_sys_color_dynamic_light_surface_container_high</color>
+    <color name="lightSurfaceContainerHighest">@color/m3_sys_color_dynamic_light_surface_container_highest</color>
+
+    <color name="lightSurfaceInverse">@color/m3_sys_color_dynamic_light_inverse_surface</color>
+    <color name="lightOnSurfaceInverse">@color/m3_sys_color_dynamic_light_inverse_on_surface</color>
+    <color name="lightPrimaryInverse">@color/m3_sys_color_dynamic_light_inverse_primary</color>
+
+    <color name="lightOutline">@color/m3_sys_color_dynamic_light_outline</color>
+    <color name="lightOutlineVariant">@color/m3_sys_color_dynamic_light_outline_variant</color>
+
+    <color name="lightPrimaryFixed">@color/m3_sys_color_dynamic_primary_fixed</color>
+    <color name="lightOnPrimaryFixed">@color/m3_sys_color_dynamic_on_primary_fixed</color>
+    <color name="lightPrimaryFixedDim">@color/m3_sys_color_dynamic_primary_fixed_dim</color>
+    <color name="lightOnPrimaryFixedVariant">@color/m3_sys_color_dynamic_on_primary_fixed_variant</color>
+
+    <color name="lightSecondaryFixed">@color/m3_sys_color_dynamic_secondary_fixed</color>
+    <color name="lightOnSecondaryFixed">@color/m3_sys_color_dynamic_on_secondary_fixed</color>
+    <color name="lightSecondaryFixedDim">@color/m3_sys_color_dynamic_secondary_fixed_dim</color>
+    <color name="lightOnSecondaryFixedVariant">@color/m3_sys_color_dynamic_on_secondary_fixed_variant</color>
+
+    <color name="lightTertiaryFixed">@color/m3_sys_color_dynamic_tertiary_fixed</color>
+    <color name="lightOnTertiaryFixed">@color/m3_sys_color_dynamic_on_tertiary_fixed</color>
+    <color name="lightTertiaryFixedDim">@color/m3_sys_color_dynamic_tertiary_fixed_dim</color>
+    <color name="lightOnTertiaryFixedVariant">@color/m3_sys_color_dynamic_on_tertiary_fixed_variant</color>
+
+    <!-- Dark theme -->
+    <color name="darkPrimary">@color/m3_sys_color_dynamic_dark_primary</color>
+    <color name="darkOnPrimary">@color/m3_sys_color_dynamic_dark_on_primary</color>
+    <color name="darkPrimaryContainer">@color/m3_sys_color_dynamic_dark_primary_container</color>
+    <color name="darkOnPrimaryContainer">@color/m3_sys_color_dynamic_dark_on_primary_container</color>
+
+    <color name="darkSecondary">@color/m3_sys_color_dynamic_dark_secondary</color>
+    <color name="darkOnSecondary">@color/m3_sys_color_dynamic_dark_on_secondary</color>
+    <color name="darkSecondaryContainer">@color/m3_sys_color_dynamic_dark_secondary_container</color>
+    <color name="darkOnSecondaryContainer">@color/m3_sys_color_dynamic_dark_on_secondary_container</color>
+
+    <color name="darkTertiary">@color/m3_sys_color_dynamic_dark_tertiary</color>
+    <color name="darkOnTertiary">@color/m3_sys_color_dynamic_dark_on_tertiary</color>
+    <color name="darkTertiaryContainer">@color/m3_sys_color_dynamic_dark_tertiary_container</color>
+    <color name="darkOnTertiaryContainer">@color/m3_sys_color_dynamic_dark_on_tertiary_container</color>
+
+    <color name="darkError">@color/m3_sys_color_dark_error</color>
+    <color name="darkOnError">@color/m3_sys_color_dark_on_error</color>
+    <color name="darkErrorContainer">@color/m3_sys_color_dark_error_container</color>
+    <color name="darkOnErrorContainer">@color/m3_sys_color_dark_on_error_container</color>
+
+    <color name="darkSurfaceDim">@color/m3_sys_color_dynamic_dark_surface_dim</color>
+    <color name="darkSurface">@color/m3_sys_color_dynamic_dark_surface</color>
+    <color name="darkSurfaceBright">@color/m3_sys_color_dynamic_dark_surface_bright</color>
+    <color name="darkOnSurface">@color/m3_sys_color_dynamic_dark_on_surface</color>
+    <color name="darkOnSurfaceVariant">@color/m3_sys_color_dynamic_dark_on_surface_variant</color>
+
+    <color name="darkSurfaceContainerLowest">@color/m3_sys_color_dynamic_dark_surface_container_lowest</color>
+    <color name="darkSurfaceContainerLow">@color/m3_sys_color_dynamic_dark_surface_container_low</color>
+    <color name="darkSurfaceContainer">@color/m3_sys_color_dynamic_dark_surface_container</color>
+    <color name="darkSurfaceContainerHigh">@color/m3_sys_color_dynamic_dark_surface_container_high</color>
+    <color name="darkSurfaceContainerHighest">@color/m3_sys_color_dynamic_dark_surface_container_highest</color>
+
+    <color name="darkSurfaceInverse">@color/m3_sys_color_dynamic_dark_inverse_surface</color>
+    <color name="darkOnSurfaceInverse">@color/m3_sys_color_dynamic_dark_inverse_on_surface</color>
+    <color name="darkPrimaryInverse">@color/m3_sys_color_dynamic_dark_inverse_primary</color>
+
+    <color name="darkOutline">@color/m3_sys_color_dynamic_dark_outline</color>
+    <color name="darkOutlineVariant">@color/m3_sys_color_dynamic_dark_outline_variant</color>
+
+    <color name="darkPrimaryFixed">@color/m3_sys_color_dynamic_primary_fixed</color>
+    <color name="darkOnPrimaryFixed">@color/m3_sys_color_dynamic_on_primary_fixed</color>
+    <color name="darkPrimaryFixedDim">@color/m3_sys_color_dynamic_primary_fixed_dim</color>
+    <color name="darkOnPrimaryFixedVariant">@color/m3_sys_color_dynamic_on_primary_fixed_variant</color>
+
+    <color name="darkSecondaryFixed">@color/m3_sys_color_dynamic_secondary_fixed</color>
+    <color name="darkOnSecondaryFixed">@color/m3_sys_color_dynamic_on_secondary_fixed</color>
+    <color name="darkSecondaryFixedDim">@color/m3_sys_color_dynamic_secondary_fixed_dim</color>
+    <color name="darkOnSecondaryFixedVariant">@color/m3_sys_color_dynamic_on_secondary_fixed_variant</color>
+
+    <color name="darkTertiaryFixed">@color/m3_sys_color_dynamic_tertiary_fixed</color>
+    <color name="darkOnTertiaryFixed">@color/m3_sys_color_dynamic_on_tertiary_fixed</color>
+    <color name="darkTertiaryFixedDim">@color/m3_sys_color_dynamic_tertiary_fixed_dim</color>
+    <color name="darkOnTertiaryFixedVariant">@color/m3_sys_color_dynamic_on_tertiary_fixed_variant</color>
+</resources>

components/ui/bolt/src/androidMain/kotlin/net/thunderbird/components/ui/bolt/theme/PlatformColorScheme.android.kt

@@ -0,0 +1,25 @@
+package net.thunderbird.components.ui.bolt.theme
+
+import android.os.Build
+import androidx.compose.material3.dynamicDarkColorScheme
+import androidx.compose.material3.dynamicLightColorScheme
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.platform.LocalContext
+
+@Composable
+internal actual fun platformColorScheme(
+    defaultColorScheme: ThemeColorScheme,
+    darkTheme: Boolean,
+    dynamicColor: Boolean,
+): ThemeColorScheme {
+    if (!dynamicColor || Build.VERSION.SDK_INT < Build.VERSION_CODES.S) return defaultColorScheme
+
+    val context = LocalContext.current
+    val dynamicColorScheme = if (darkTheme) {
+        dynamicDarkColorScheme(context)
+    } else {
+        dynamicLightColorScheme(context)
+    }
+
+    return dynamicColorScheme.toBoltColorScheme(defaultColorScheme)
+}

components/ui/bolt/src/commonMain/kotlin/net/thunderbird/components/ui/bolt/theme/BoltTheme.kt

@@ -11,12 +11,18 @@ import androidx.compose.runtime.ReadOnlyComposable
 fun BoltTheme(
     themeConfig: ThemeConfig,
     darkTheme: Boolean = isSystemInDarkTheme(),
+    dynamicColor: Boolean = false,
     content: @Composable () -> Unit,
 ) {
-    val themeColorScheme = selectThemeColorScheme(
+    val defaultColorScheme = selectThemeColorScheme(
         themeConfig = themeConfig,
         darkTheme = darkTheme,
     )
+    val themeColorScheme = platformColorScheme(
+        defaultColorScheme = defaultColorScheme,
+        darkTheme = darkTheme,
+        dynamicColor = dynamicColor,
+    )
     val themeImages = selectThemeImages(
         themeConfig = themeConfig,
         darkTheme = darkTheme,

components/ui/bolt/src/commonMain/kotlin/net/thunderbird/components/ui/bolt/theme/PlatformColorScheme.kt

@@ -0,0 +1,11 @@
+package net.thunderbird.components.ui.bolt.theme
+
+import androidx.compose.runtime.Composable
+
+/** Uses platform-provided colors when available, otherwise returns [defaultColorScheme]. */
+@Composable
+internal expect fun platformColorScheme(
+    defaultColorScheme: ThemeColorScheme,
+    darkTheme: Boolean,
+    dynamicColor: Boolean,
+): ThemeColorScheme

components/ui/bolt/src/commonMain/kotlin/net/thunderbird/components/ui/bolt/theme/ThemeColorScheme.kt

@@ -77,6 +77,53 @@ data class ThemeColorScheme(
     val onWarningContainer: Color,
 )
 
+/**
+ * Convert a Material 3 [ColorScheme] to a [ThemeColorScheme].
+ *
+ * Bolt's additional semantic colors don't have Material equivalents and are retained from [fallback].
+ */
+internal fun ColorScheme.toBoltColorScheme(fallback: ThemeColorScheme): ThemeColorScheme = fallback.copy(
+    primary = primary,
+    onPrimary = onPrimary,
+    primaryContainer = primaryContainer,
+    onPrimaryContainer = onPrimaryContainer,
+
+    secondary = secondary,
+    onSecondary = onSecondary,
+    secondaryContainer = secondaryContainer,
+    onSecondaryContainer = onSecondaryContainer,
+
+    tertiary = tertiary,
+    onTertiary = onTertiary,
+    tertiaryContainer = tertiaryContainer,
+    onTertiaryContainer = onTertiaryContainer,
+
+    error = error,
+    onError = onError,
+    errorContainer = errorContainer,
+    onErrorContainer = onErrorContainer,
+
+    surfaceDim = surfaceDim,
+    surface = surface,
+    surfaceBright = surfaceBright,
+    onSurface = onSurface,
+    onSurfaceVariant = onSurfaceVariant,
+
+    surfaceContainerLowest = surfaceContainerLowest,
+    surfaceContainerLow = surfaceContainerLow,
+    surfaceContainer = surfaceContainer,
+    surfaceContainerHigh = surfaceContainerHigh,
+    surfaceContainerHighest = surfaceContainerHighest,
+
+    inverseSurface = inverseSurface,
+    inverseOnSurface = inverseOnSurface,
+    inversePrimary = inversePrimary,
+
+    outline = outline,
+    outlineVariant = outlineVariant,
+    scrim = scrim,
+)
+
 /**
  * Convert a [ThemeColorScheme] to a Material 3 [ColorScheme].
  *

components/ui/bolt/src/commonMain/kotlin/net/thunderbird/components/ui/bolt/theme/thunderbird/ThunderbirdBoltTheme.kt

@@ -43,6 +43,7 @@ fun ThunderbirdBoltTheme(
     BoltTheme(
         themeConfig = themeConfig,
         darkTheme = darkTheme,
+        dynamicColor = true,
         content = content,
     )
 }

components/ui/bolt/src/commonTest/kotlin/net/thunderbird/components/ui/bolt/theme/ThemeColorSchemeTest.kt

@@ -0,0 +1,54 @@
+package net.thunderbird.components.ui.bolt.theme
+
+import androidx.compose.material3.darkColorScheme
+import assertk.assertThat
+import assertk.assertions.isEqualTo
+import kotlin.test.Test
+import net.thunderbird.components.ui.bolt.theme.thunderbird.lightThemeColorScheme
+
+class ThemeColorSchemeTest {
+
+    @Test
+    fun `toBoltColorScheme should map Material color roles`() {
+        val fallback = lightThemeColorScheme
+        val materialColorScheme = darkColorScheme()
+        val expected = fallback.copy(
+            primary = materialColorScheme.primary,
+            onPrimary = materialColorScheme.onPrimary,
+            primaryContainer = materialColorScheme.primaryContainer,
+            onPrimaryContainer = materialColorScheme.onPrimaryContainer,
+            secondary = materialColorScheme.secondary,
+            onSecondary = materialColorScheme.onSecondary,
+            secondaryContainer = materialColorScheme.secondaryContainer,
+            onSecondaryContainer = materialColorScheme.onSecondaryContainer,
+            tertiary = materialColorScheme.tertiary,
+            onTertiary = materialColorScheme.onTertiary,
+            tertiaryContainer = materialColorScheme.tertiaryContainer,
+            onTertiaryContainer = materialColorScheme.onTertiaryContainer,
+            error = materialColorScheme.error,
+            onError = materialColorScheme.onError,
+            errorContainer = materialColorScheme.errorContainer,
+            onErrorContainer = materialColorScheme.onErrorContainer,
+            surfaceDim = materialColorScheme.surfaceDim,
+            surface = materialColorScheme.surface,
+            surfaceBright = materialColorScheme.surfaceBright,
+            onSurface = materialColorScheme.onSurface,
+            onSurfaceVariant = materialColorScheme.onSurfaceVariant,
+            surfaceContainerLowest = materialColorScheme.surfaceContainerLowest,
+            surfaceContainerLow = materialColorScheme.surfaceContainerLow,
+            surfaceContainer = materialColorScheme.surfaceContainer,
+            surfaceContainerHigh = materialColorScheme.surfaceContainerHigh,
+            surfaceContainerHighest = materialColorScheme.surfaceContainerHighest,
+            inverseSurface = materialColorScheme.inverseSurface,
+            inverseOnSurface = materialColorScheme.inverseOnSurface,
+            inversePrimary = materialColorScheme.inversePrimary,
+            outline = materialColorScheme.outline,
+            outlineVariant = materialColorScheme.outlineVariant,
+            scrim = materialColorScheme.scrim,
+        )
+
+        val result = materialColorScheme.toBoltColorScheme(fallback)
+
+        assertThat(result).isEqualTo(expected)
+    }
+}

components/ui/bolt/src/jvmMain/kotlin/net/thunderbird/components/ui/bolt/theme/PlatformColorScheme.jvm.kt

@@ -0,0 +1,10 @@
+package net.thunderbird.components.ui.bolt.theme
+
+import androidx.compose.runtime.Composable
+
+@Composable
+internal actual fun platformColorScheme(
+    defaultColorScheme: ThemeColorScheme,
+    darkTheme: Boolean,
+    dynamicColor: Boolean,
+): ThemeColorScheme = defaultColorScheme