Refactor: Changes in WrapModalBottomSheet.

- Removed `backgroundPaper` color and replaced it with `background`. - Updated the `WrapModalBottomSheet` to use consistent padding values.
eu-digital-identity-wallet · Sep 26, 2024 · 898ce3e · 898ce3e
1 parent beaf94c
commit 898ce3e
Show file tree

Hide file tree

Showing 10 changed files with 26 additions and 52 deletions.
diff --git a/login-feature/src/main/java/eu/europa/ec/loginfeature/ui/welcome/WelcomeScreen.kt b/login-feature/src/main/java/eu/europa/ec/loginfeature/ui/welcome/WelcomeScreen.kt
@@ -42,7 +42,6 @@ import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.unit.dp
 import androidx.navigation.NavController
 import eu.europa.ec.resourceslogic.R
-import eu.europa.ec.resourceslogic.theme.values.backgroundPaper
 import eu.europa.ec.resourceslogic.theme.values.bottomCorneredShapeSmall
 import eu.europa.ec.uilogic.component.AppIcons
 import eu.europa.ec.uilogic.component.preview.PreviewTheme
@@ -106,7 +105,7 @@ private fun Content(
                 .fillMaxWidth()
                 .fillMaxHeight(animatedWeight)
                 .background(
-                    color = MaterialTheme.colorScheme.backgroundPaper,
+                    color = MaterialTheme.colorScheme.background,
                     shape = MaterialTheme.shapes.bottomCorneredShapeSmall
                 ),
             contentAlignment = Alignment.Center

diff --git a/...es-logic/src/main/java/eu/europa/ec/resourceslogic/theme/templates/ThemeColorsTemplate.kt b/...es-logic/src/main/java/eu/europa/ec/resourceslogic/theme/templates/ThemeColorsTemplate.kt
@@ -90,7 +90,7 @@ data class ThemeColorsTemplate(
             surfaceContainer = Color.Unspecified,
             surfaceContainerHigh = Color.Unspecified,
             surfaceContainerHighest = Color.Unspecified,
-            surfaceContainerLow = Color.Unspecified,
+            surfaceContainerLow = Color(background),
             surfaceContainerLowest = Color.Unspecified
         )
     }

diff --git a/resources-logic/src/main/java/eu/europa/ec/resourceslogic/theme/values/ThemeColors.kt b/resources-logic/src/main/java/eu/europa/ec/resourceslogic/theme/values/ThemeColors.kt
@@ -55,7 +55,6 @@ class ThemeColors {
         internal const val eudiw_theme_light_textDisabledDark: Long = 0x61000000
         internal const val eudiw_theme_light_dividerDark: Long = 0x1F000000
         internal const val eudiw_theme_light_backgroundDefault: Long = 0xFFF5F5F5
-        const val eudiw_theme_light_backgroundPaper: Long = 0xFFFFFFFF
         internal const val eudiw_theme_light_textSecondaryLight: Long = 0xB3FFFFFF
         internal const val eudiw_theme_light_textDisabledLight: Long = 0x80FFFFFF
 
@@ -64,7 +63,6 @@ class ThemeColors {
         internal const val eudiw_theme_dark_textDisabledDark: Long = 0xFF646670
         internal const val eudiw_theme_dark_dividerDark: Long = 0x1FFFFFFF
         internal const val eudiw_theme_dark_backgroundDefault: Long = 0xFF44474F
-        const val eudiw_theme_dark_backgroundPaper: Long = 0xFF000000
         internal const val eudiw_theme_dark_textSecondaryLight: Long = 0xB3000000
         internal const val eudiw_theme_dark_textDisabledLight: Long = 0x80000000
 
@@ -85,7 +83,7 @@ class ThemeColors {
         private const val eudiw_theme_light_errorContainer: Long = 0xFFFFDAD5
         private const val eudiw_theme_light_onError: Long = white
         private const val eudiw_theme_light_onErrorContainer: Long = 0xFF410002
-        private const val eudiw_theme_light_background: Long = white
+        const val eudiw_theme_light_background: Long = white
         private const val eudiw_theme_light_onBackground: Long = black
         private const val eudiw_theme_light_surface: Long = white
         private const val eudiw_theme_light_onSurface: Long = black
@@ -116,7 +114,7 @@ class ThemeColors {
         private const val eudiw_theme_dark_errorContainer: Long = 0xFF930009
         private const val eudiw_theme_dark_onError: Long = 0xFF690004
         private const val eudiw_theme_dark_onErrorContainer: Long = 0xFFFFDAD5
-        private const val eudiw_theme_dark_background: Long = black
+        const val eudiw_theme_dark_background: Long = black
         private const val eudiw_theme_dark_onBackground: Long = white
         private const val eudiw_theme_dark_surface: Long = black
         private const val eudiw_theme_dark_onSurface: Long = white
@@ -278,13 +276,6 @@ class ThemeColors {
                 Color(eudiw_theme_light_backgroundDefault)
             }
 
-        val backgroundPaper: Color
-            get() = if (isInDarkMode) {
-                Color(eudiw_theme_dark_backgroundPaper)
-            } else {
-                Color(eudiw_theme_light_backgroundPaper)
-            }
-
         val textSecondaryLight: Color
             get() = if (isInDarkMode) {
                 Color(eudiw_theme_dark_textSecondaryLight)
@@ -338,13 +329,6 @@ val ColorScheme.backgroundDefault: Color
         Color(ThemeColors.eudiw_theme_light_backgroundDefault)
     }
 
-val ColorScheme.backgroundPaper: Color
-    @Composable get() = if (isSystemInDarkTheme()) {
-        Color(ThemeColors.eudiw_theme_dark_backgroundPaper)
-    } else {
-        Color(ThemeColors.eudiw_theme_light_backgroundPaper)
-    }
-
 val ColorScheme.textSecondaryLight: Color
     @Composable get() = if (isSystemInDarkTheme()) {
         Color(ThemeColors.eudiw_theme_dark_textSecondaryLight)

diff --git a/startup-feature/src/main/java/eu/europa/ec/startupfeature/ui/splash/SplashScreen.kt b/startup-feature/src/main/java/eu/europa/ec/startupfeature/ui/splash/SplashScreen.kt
@@ -33,7 +33,6 @@ import androidx.compose.runtime.remember
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.navigation.NavController
-import eu.europa.ec.resourceslogic.theme.values.backgroundPaper
 import eu.europa.ec.uilogic.component.AppIcons
 import eu.europa.ec.uilogic.component.utils.OneTimeLaunchedEffect
 import eu.europa.ec.uilogic.component.wrap.WrapImage
@@ -89,7 +88,7 @@ private fun Content(
             Modifier
                 .fillMaxSize()
                 .padding(paddingValues)
-                .background(MaterialTheme.colorScheme.backgroundPaper),
+                .background(MaterialTheme.colorScheme.background),
             contentAlignment = Alignment.Center
         ) {
             AnimatedVisibility(

diff --git a/ui-logic/src/main/java/eu/europa/ec/uilogic/component/ActionTopBar.kt b/ui-logic/src/main/java/eu/europa/ec/uilogic/component/ActionTopBar.kt
@@ -22,7 +22,6 @@ import androidx.compose.material3.TopAppBar
 import androidx.compose.material3.TopAppBarDefaults
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.graphics.Color
-import eu.europa.ec.resourceslogic.theme.values.backgroundPaper
 import eu.europa.ec.uilogic.component.content.ToolBarActions
 import eu.europa.ec.uilogic.component.content.ToolbarAction
 import eu.europa.ec.uilogic.component.preview.PreviewTheme
@@ -59,7 +58,7 @@ fun ActionTopBar(
 private fun TopBarPreview() {
     PreviewTheme {
         ActionTopBar(
-            contentColor = MaterialTheme.colorScheme.backgroundPaper,
+            contentColor = MaterialTheme.colorScheme.background,
             iconColor = MaterialTheme.colorScheme.primary,
             iconData = AppIcons.Close
         ) {}

diff --git a/ui-logic/src/main/java/eu/europa/ec/uilogic/component/content/ContentGradient.kt b/ui-logic/src/main/java/eu/europa/ec/uilogic/component/content/ContentGradient.kt
@@ -30,7 +30,6 @@ import androidx.compose.ui.graphics.Brush
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.unit.Dp
 import androidx.compose.ui.unit.dp
-import eu.europa.ec.resourceslogic.theme.values.backgroundPaper
 import eu.europa.ec.uilogic.component.preview.PreviewTheme
 import eu.europa.ec.uilogic.component.preview.ThemeModePreviews
 import eu.europa.ec.uilogic.component.utils.SIZE_EXTRA_LARGE
@@ -42,7 +41,7 @@ enum class GradientEdge {
 @Composable
 fun ContentGradient(
     modifier: Modifier,
-    gradientStartColor: Color = MaterialTheme.colorScheme.backgroundPaper,
+    gradientStartColor: Color = MaterialTheme.colorScheme.background,
     gradientEndColor: Color = Color.Transparent,
     gradientEdge: GradientEdge = GradientEdge.BOTTOM,
     height: Dp = SIZE_EXTRA_LARGE.dp,
@@ -139,7 +138,7 @@ private fun ContentGradientColoredPreview() {
             Box(
                 modifier = Modifier
                     .fillMaxSize()
-                    .background(MaterialTheme.colorScheme.backgroundPaper)
+                    .background(MaterialTheme.colorScheme.background)
             )
         }
     }

diff --git a/ui-logic/src/main/java/eu/europa/ec/uilogic/component/preview/ThemePreviews.kt b/ui-logic/src/main/java/eu/europa/ec/uilogic/component/preview/ThemePreviews.kt
@@ -26,10 +26,10 @@ import eu.europa.ec.resourceslogic.theme.values.ThemeColors
  * */
 @Preview(
     name = "Light Mode", showBackground = true, uiMode = UI_MODE_NIGHT_NO,
-    backgroundColor = ThemeColors.eudiw_theme_light_backgroundPaper
+    backgroundColor = ThemeColors.eudiw_theme_light_background
 )
 @Preview(
     name = "Dark Mode", showBackground = true, uiMode = UI_MODE_NIGHT_YES,
-    backgroundColor = ThemeColors.eudiw_theme_dark_backgroundPaper
+    backgroundColor = ThemeColors.eudiw_theme_dark_background
 )
 annotation class ThemeModePreviews
diff --git a/ui-logic/src/main/java/eu/europa/ec/uilogic/component/wrap/WrapButton.kt b/ui-logic/src/main/java/eu/europa/ec/uilogic/component/wrap/WrapButton.kt
@@ -29,7 +29,6 @@ import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.unit.dp
-import eu.europa.ec.resourceslogic.theme.values.backgroundPaper
 import eu.europa.ec.resourceslogic.theme.values.dividerDark
 import eu.europa.ec.resourceslogic.theme.values.textDisabledDark
 import eu.europa.ec.resourceslogic.theme.values.textPrimaryDark
@@ -49,7 +48,7 @@ fun WrapPrimaryButton(
     val textColor = if (isSystemInDarkTheme()) {
         Color.White
     } else {
-        MaterialTheme.colorScheme.backgroundPaper
+        MaterialTheme.colorScheme.background
     }
 
     Button(
@@ -81,9 +80,9 @@ fun WrapSecondaryButton(
         onClick = onClick,
         shape = buttonsShape,
         colors = ButtonDefaults.outlinedButtonColors(
-            containerColor = MaterialTheme.colorScheme.backgroundPaper,
+            containerColor = MaterialTheme.colorScheme.background,
             contentColor = MaterialTheme.colorScheme.textPrimaryDark,
-            disabledContainerColor = MaterialTheme.colorScheme.backgroundPaper,
+            disabledContainerColor = MaterialTheme.colorScheme.background,
             disabledContentColor = MaterialTheme.colorScheme.textDisabledDark,
         ),
         border = BorderStroke(

diff --git a/ui-logic/src/main/java/eu/europa/ec/uilogic/component/wrap/WrapFab.kt b/ui-logic/src/main/java/eu/europa/ec/uilogic/component/wrap/WrapFab.kt
@@ -25,7 +25,6 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.Shape
 import eu.europa.ec.resourceslogic.theme.values.allCorneredShapeLarge
-import eu.europa.ec.resourceslogic.theme.values.backgroundPaper
 import eu.europa.ec.resourceslogic.theme.values.textPrimaryDark
 import eu.europa.ec.uilogic.component.AppIcons
 import eu.europa.ec.uilogic.component.preview.PreviewTheme
@@ -41,14 +40,14 @@ private val primaryFabContentColor: Color
     @Composable get() = if (isSystemInDarkTheme()) {
         Color.White
     } else {
-        MaterialTheme.colorScheme.backgroundPaper
+        MaterialTheme.colorScheme.background
     }
 
 private val secondaryFabContainerColor: Color
     @Composable get() = if (isSystemInDarkTheme()) {
         Color.DarkGray
     } else {
-        MaterialTheme.colorScheme.backgroundPaper
+        MaterialTheme.colorScheme.background
     }
 
 private val secondaryFabContentColor: Color

diff --git a/ui-logic/src/main/java/eu/europa/ec/uilogic/component/wrap/WrapModalBottomSheet.kt b/ui-logic/src/main/java/eu/europa/ec/uilogic/component/wrap/WrapModalBottomSheet.kt
@@ -20,8 +20,8 @@ import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.ColumnScope
+import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.Row
-import androidx.compose.foundation.layout.WindowInsets
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.wrapContentHeight
@@ -41,21 +41,23 @@ import androidx.compose.ui.draw.clip
 import androidx.compose.ui.graphics.Shape
 import androidx.compose.ui.unit.dp
 import eu.europa.ec.resourceslogic.theme.values.backgroundDefault
-import eu.europa.ec.resourceslogic.theme.values.backgroundPaper
 import eu.europa.ec.resourceslogic.theme.values.textPrimaryDark
 import eu.europa.ec.resourceslogic.theme.values.textSecondaryDark
 import eu.europa.ec.uilogic.component.ModalOptionUi
 import eu.europa.ec.uilogic.component.preview.PreviewTheme
 import eu.europa.ec.uilogic.component.preview.ThemeModePreviews
 import eu.europa.ec.uilogic.component.utils.SIZE_SMALL
-import eu.europa.ec.uilogic.component.utils.SPACING_EXTRA_LARGE
 import eu.europa.ec.uilogic.component.utils.SPACING_LARGE
 import eu.europa.ec.uilogic.component.utils.SPACING_MEDIUM
 import eu.europa.ec.uilogic.component.utils.SPACING_SMALL
 import eu.europa.ec.uilogic.component.utils.VSpacer
 import eu.europa.ec.uilogic.extension.throttledClickable
 import eu.europa.ec.uilogic.mvi.ViewEvent
 
+private val defaultBottomSheetPadding: PaddingValues = PaddingValues(
+    all = SPACING_LARGE.dp
+)
+
 @OptIn(ExperimentalMaterial3Api::class)
 @Composable
 fun WrapModalBottomSheet(
@@ -73,7 +75,6 @@ fun WrapModalBottomSheet(
         shape = shape,
         dragHandle = dragHandle,
         content = sheetContent,
-        contentWindowInsets = { WindowInsets(0, 0, 0, 0) }
     )
 }
 
@@ -85,9 +86,9 @@ fun GenericBaseSheetContent(
     Column(
         modifier = Modifier
             .wrapContentHeight()
-            .background(color = MaterialTheme.colorScheme.backgroundPaper)
+            .background(color = MaterialTheme.colorScheme.background)
             .fillMaxWidth()
-            .padding(horizontal = 32.dp, vertical = 48.dp)
+            .padding(defaultBottomSheetPadding)
     ) {
         Text(
             text = title,
@@ -108,14 +109,9 @@ fun GenericBaseSheetContent(
     Column(
         modifier = Modifier
             .wrapContentHeight()
-            .background(color = MaterialTheme.colorScheme.backgroundPaper)
+            .background(color = MaterialTheme.colorScheme.background)
             .fillMaxWidth()
-            .padding(
-                start = SPACING_LARGE.dp,
-                top = SPACING_LARGE.dp,
-                end = SPACING_LARGE.dp,
-                bottom = SPACING_EXTRA_LARGE.dp
-            )
+            .padding(defaultBottomSheetPadding)
     ) {
         titleContent()
         VSpacer.Large()
@@ -204,7 +200,7 @@ fun <T : ViewEvent> BottomSheetWithOptionsList(
 }
 
 @Composable
-fun <T : ViewEvent> OptionsList(
+private fun <T : ViewEvent> OptionsList(
     optionItems: List<ModalOptionUi<T>>,
     itemSelected: (T) -> Unit
 ) {
@@ -221,7 +217,7 @@ fun <T : ViewEvent> OptionsList(
 }
 
 @Composable
-fun <T : ViewEvent> OptionListItem(
+private fun <T : ViewEvent> OptionListItem(
     item: ModalOptionUi<T>,
     itemSelected: (T) -> Unit
 ) {