diff --git a/kmp/src/commonMain/kotlin/org/tasks/compose/components/AnimatedBanner.kt b/kmp/src/commonMain/kotlin/org/tasks/compose/components/AnimatedBanner.kt index 3420db9cd..4a73c7221 100644 --- a/kmp/src/commonMain/kotlin/org/tasks/compose/components/AnimatedBanner.kt +++ b/kmp/src/commonMain/kotlin/org/tasks/compose/components/AnimatedBanner.kt @@ -1,19 +1,16 @@ -@file:OptIn(ExperimentalAnimationApi::class) - package org.tasks.compose.components import androidx.compose.animation.AnimatedVisibility -import androidx.compose.animation.ExperimentalAnimationApi import androidx.compose.animation.expandVertically import androidx.compose.animation.shrinkVertically import androidx.compose.foundation.layout.Arrangement +import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.Row -import androidx.compose.foundation.layout.Spacer import androidx.compose.foundation.layout.fillMaxWidth -import androidx.compose.foundation.layout.height import androidx.compose.foundation.layout.padding -import androidx.compose.material3.Card +import androidx.compose.material3.Button import androidx.compose.material3.MaterialTheme +import androidx.compose.material3.Surface import androidx.compose.material3.Text import androidx.compose.material3.TextButton import androidx.compose.runtime.Composable @@ -56,63 +53,41 @@ fun Banner( action: String, onAction: () -> Unit, ) { - Banner( - content = { + Surface( + modifier = Modifier + .fillMaxWidth() + .padding(16.dp), + shape = MaterialTheme.shapes.extraLarge, + color = MaterialTheme.colorScheme.surfaceContainerHigh, + tonalElevation = 6.dp, + ) { + Column( + modifier = Modifier.padding(24.dp), + verticalArrangement = Arrangement.spacedBy(16.dp), + ) { Text( text = title, - style = MaterialTheme.typography.bodyLarge, - modifier = Modifier.padding(horizontal = 16.dp), + style = MaterialTheme.typography.headlineSmall, color = MaterialTheme.colorScheme.onSurface, ) - Spacer(modifier = Modifier.height(4.dp)) Text( text = body, style = MaterialTheme.typography.bodyMedium, - modifier = Modifier.padding(horizontal = 16.dp), - color = MaterialTheme.colorScheme.onSurface, + color = MaterialTheme.colorScheme.onSurfaceVariant, ) - }, - buttons = { - dismissText?.let { - BannerTextButton(text = it, onDismiss) + Row( + modifier = Modifier.align(Alignment.End), + horizontalArrangement = Arrangement.spacedBy(8.dp), + ) { + dismissText?.let { + TextButton(onClick = onDismiss) { + Text(text = it) + } + } + Button(onClick = onAction) { + Text(text = action) + } } - BannerTextButton(text = action, onAction) - } - ) -} - -@ExperimentalAnimationApi -@Composable -private fun Banner( - content: @Composable () -> Unit, - buttons: @Composable () -> Unit, -) { - Card( - modifier = Modifier - .fillMaxWidth() - .padding(16.dp) - ) { - Spacer(modifier = Modifier.height(16.dp)) - content() - Row( - modifier = Modifier - .padding(vertical = 8.dp, horizontal = 16.dp) - .align(Alignment.End), - horizontalArrangement = Arrangement.spacedBy(8.dp) - ) { - buttons() } } } - -@Composable -fun BannerTextButton(text: String, onClick: () -> Unit) { - TextButton(onClick = onClick) { - Text( - text = text, - style = MaterialTheme.typography.labelLarge.copy( - color = MaterialTheme.colorScheme.onSurface - ), - ) - } -}