[PPSDK-292] UI glitches on CI Android SDK v 3.0

UI-SDK/src/main/java/com/cookieinformation/mobileconsents/sdk/ui/ConsentsUISDK.kt

@@ -43,7 +43,7 @@ object ConsentsUISDK {
         CustomUI.setCustomUi(
             customLightColorScheme?.toLightColorScheme(),
             customDarkColorScheme?.toDarkColorScheme(),
-            customTypography?.toTypography()
+            customTypography
         )
     }
 

UI-SDK/src/main/java/com/cookieinformation/mobileconsents/sdk/ui/CustomColorScheme.kt

@@ -4,6 +4,8 @@ import androidx.compose.material3.ColorScheme
 import androidx.compose.material3.darkColorScheme
 import androidx.compose.material3.lightColorScheme
 import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.graphics.toArgb
+import com.cookieinformation.mobileconsents.sdk.ui.ui.MaterialColorSchemeWithCustom
 
 /**
  * Customizable colors (based as much as possible on component colors from https://m3.material.io/components)
@@ -17,6 +19,14 @@ import androidx.compose.ui.graphics.Color
  * outline
  * outlineVariant
  * primaryContainer
+ *
+//// Additional  ////
+ * primaryButton
+ * secondaryButton
+ * topBar
+ * divider
+ * checkboxes
+ * readMore
  */
 
 data class CustomColorScheme(
@@ -28,59 +38,82 @@ data class CustomColorScheme(
     val onSurfaceVariantColorCode: Int? = null,
     val surfaceVariantColorCode: Int? = null,
     val outlineColorCode: Int? = null,
-    val outlineVariantColorCode: Int? = null
-)
-
-internal fun CustomColorScheme.toLightColorScheme(): ColorScheme {
-    val lcm = lightColorScheme()
-
-    val pc = if (primaryColorCode != null) Color(primaryColorCode) else lcm.primary
-    val opc = if (onPrimaryColorCode != null) Color(onPrimaryColorCode) else lcm.onPrimary
-    val pcc = if (primaryContainerColorCode != null) Color(primaryContainerColorCode) else lcm.primaryContainer
-    val sc = if (surfaceColorCode != null) Color(surfaceColorCode) else lcm.surface
-    val osc = if (onSurfaceColorCode != null) Color(onSurfaceColorCode) else lcm.onSurface
-    val osvc = if (onSurfaceVariantColorCode != null) Color(onSurfaceVariantColorCode) else lcm.onSurfaceVariant
-    val svc = if (surfaceVariantColorCode != null) Color(surfaceVariantColorCode) else lcm.surfaceVariant
-    val oc = if (outlineColorCode != null) Color(outlineColorCode) else lcm.outline
-    val ovc = if (outlineVariantColorCode != null) Color(outlineVariantColorCode) else lcm.outlineVariant
-
-    return lightColorScheme(
-        primary = pc,
-        onPrimary = opc,
-        primaryContainer = pcc,
-        surface = sc,
-        onSurface = osc,
-        onSurfaceVariant = osvc,
-        surfaceVariant = svc,
-        outline = oc,
-        outlineVariant = ovc
+    val outlineVariantColorCode: Int? = null,
+    val primaryButton: Int? = null,
+    val secondaryButton: Int? = null,
+    val topBar: Int? = null,
+    val divider: Int? = null,
+    val checkboxes: Int? = null,
+    val readMore: Int? = null,
+) {
+    constructor(
+        primaryColor: Color? = null,
+        onPrimaryColor: Color? = null,
+        primaryContainerColor: Color? = null,
+        surfaceColor: Color? = null,
+        onSurfaceColor: Color? = null,
+        onSurfaceVariantColor: Color? = null,
+        surfaceVariantColor: Color? = null,
+        outlineColor: Color? = null,
+        outlineVariantColor: Color? = null,
+        primaryButton: Color? = null,
+        secondaryButton: Color? = null,
+        topBar: Color? = null,
+        divider: Color? = null,
+        checkbox: Color? = null,
+        readMore: Color? = null
+    ) : this(
+        primaryColorCode = primaryColor?.toArgb(),
+        onPrimaryColorCode = onPrimaryColor?.toArgb(),
+        primaryContainerColorCode = primaryContainerColor?.toArgb(),
+        surfaceColorCode = surfaceColor?.toArgb(),
+        onSurfaceColorCode = onSurfaceColor?.toArgb(),
+        onSurfaceVariantColorCode = onSurfaceVariantColor?.toArgb(),
+        surfaceVariantColorCode = surfaceVariantColor?.toArgb(),
+        outlineColorCode = outlineColor?.toArgb(),
+        outlineVariantColorCode = outlineVariantColor?.toArgb(),
+        primaryButton = primaryButton?.toArgb(),
+        secondaryButton = secondaryButton?.toArgb(),
+        topBar = topBar?.toArgb(),
+        divider = divider?.toArgb(),
+        checkboxes = checkbox?.toArgb(),
+        readMore = readMore?.toArgb()
     )
-
 }
 
-internal fun CustomColorScheme.toDarkColorScheme(): ColorScheme {
-    val dcm = darkColorScheme()
-
-    val pc = if (primaryColorCode != null) Color(primaryColorCode) else dcm.primary
-    val opc = if (onPrimaryColorCode != null) Color(onPrimaryColorCode) else dcm.onPrimary
-    val pcc = if (primaryContainerColorCode != null) Color(primaryContainerColorCode) else dcm.primaryContainer
-    val sc = if (surfaceColorCode != null) Color(surfaceColorCode) else dcm.surface
-    val osc = if (onSurfaceColorCode != null) Color(onSurfaceColorCode) else dcm.onSurface
-    val osvc = if (onSurfaceVariantColorCode != null) Color(onSurfaceVariantColorCode) else dcm.onSurfaceVariant
-    val svc = if (surfaceVariantColorCode != null) Color(surfaceVariantColorCode) else dcm.surfaceVariant
-    val oc = if (outlineColorCode != null) Color(outlineColorCode) else dcm.outline
-    val ovc = if (outlineVariantColorCode != null) Color(outlineVariantColorCode) else dcm.outlineVariant
+private fun CustomColorScheme.toMaterialColorScheme(baseScheme: ColorScheme): MaterialColorSchemeWithCustom {
+    val primary = primaryColorCode.toColorOrDefault(baseScheme.primary)
+    val onPrimary = onPrimaryColorCode.toColorOrDefault(baseScheme.onPrimary)
+    val primaryContainer = primaryContainerColorCode.toColorOrDefault(baseScheme.primaryContainer)
+    val surface = surfaceColorCode.toColorOrDefault(baseScheme.surface)
+    val onSurface = onSurfaceColorCode.toColorOrDefault(baseScheme.onSurface)
+    val onSurfaceVariant = onSurfaceVariantColorCode.toColorOrDefault(baseScheme.onSurfaceVariant)
+    val surfaceVariant = surfaceVariantColorCode.toColorOrDefault(baseScheme.surfaceVariant)
+    val outline = outlineColorCode.toColorOrDefault(baseScheme.outline)
+    val outlineVariant = outlineVariantColorCode.toColorOrDefault(baseScheme.outlineVariant)
 
-    return darkColorScheme(
-        primary = pc,
-        onPrimary = opc,
-        primaryContainer = pcc,
-        surface = sc,
-        onSurface = osc,
-        onSurfaceVariant = osvc,
-        surfaceVariant = svc,
-        outline = oc,
-        outlineVariant = ovc
+    return MaterialColorSchemeWithCustom(
+        materialColorScheme = baseScheme.copy(
+            primary = primary,
+            onPrimary = onPrimary,
+            primaryContainer = primaryContainer,
+            surface = surface,
+            onSurface = onSurface,
+            onSurfaceVariant = onSurfaceVariant,
+            surfaceVariant = surfaceVariant,
+            outline = outline,
+            outlineVariant = outlineVariant
+        ),
+        primaryButton = primaryButton.toColorOrDefault(primary),
+        secondaryButton = secondaryButton.toColorOrDefault(primary),
+        topBar = topBar.toColorOrDefault(primary),
+        divider = divider.toColorOrDefault(outline),
+        checkbox = checkboxes.toColorOrDefault(primary),
+        readMore = readMore.toColorOrDefault(primary)
     )
+}
+
+internal fun CustomColorScheme.toLightColorScheme() = toMaterialColorScheme(lightColorScheme())
+internal fun CustomColorScheme.toDarkColorScheme() = toMaterialColorScheme(darkColorScheme())
+fun Int?.toColorOrDefault(default: Color) = this?.let { Color(it) } ?: default
 
-}

UI-SDK/src/main/java/com/cookieinformation/mobileconsents/sdk/ui/CustomTypography.kt

@@ -1,28 +1,80 @@
 package com.cookieinformation.mobileconsents.sdk.ui
 
-import android.content.Context
-import androidx.annotation.FontRes
 import androidx.compose.material3.Typography
-import androidx.compose.ui.text.font.Font
-import androidx.compose.ui.text.font.FontFamily
+import androidx.compose.ui.text.TextStyle
+
 
 /**
  * Customizable typography
  *
- * headlineSmall (Privacy policy headline)
- * titleMedium (Privacy policy short, header section text, consent item tile)
- * bodyMedium (consent item body (when no html), privacy policy body (when no html))
- * labelLarge - Read more, Bottom bar button texts
- * labelSmall - Powered by Cookie Information, Device identifier
+ * Core Material3 mappings:
+ * headlineSmall       - Privacy Policy headline
+ * titleMedium         - Privacy Policy short, header section text, consent item title
+ * bodyMedium          - Consent item body (when no HTML), Privacy Policy body (when no HTML)
+ * labelLarge          - "Read more", Bottom bar button texts
+ * labelSmall          - "Powered by Cookie Information", Device identifier
+ *
+ * Additional custom fields:
+ *
+ * readMore
+ *     - Optional override for "Read more" button/label text style.
+ *     - If provided, it replaces `bodyMedium` for "Read more" text.
+ *
+ * requiredTitle
+ *     - Optional override for the "Required" .
+ *     - If provided, it **replaces `titleMedium`**.
+ *
+ * requiredSectionTitle
+ *     - Optional override for the header of the required consents section.
+ *     - If provided, it **replaces `titleMedium`** in SectionHeader for required section.
+ *
+ * requiredSectionBody
+ *     - Optional override for the body text of the required consents section.
+ *     - If provided, it **replaces `bodyMedium`** for the section body.
+ *
+ * optionalTitle
+ *     - Optional override for the "Optional".
+ *     - If provided, it **replaces `titleMedium`** .
+ *
+ * optionalSectionTitle
+ *     - Optional override for the header of the optional consents section.
+ *     - If provided, it **replaces `titleMedium`** in SectionHeader for optional section.
+ *
+ * optionalSectionBody
+ *     - Optional override for the body text of the optional consents section.
+ *     - If provided, it **replaces `bodyMedium`** for the section body.
  */
 
 data class CustomTypography(
     val headlineSmall: CustomTextStyle? = null,
     val titleMedium: CustomTextStyle? = null,
     val bodyMedium: CustomTextStyle? = null,
     val labelLarge: CustomTextStyle? = null,
-    val labelSmall: CustomTextStyle? = null
-)
+    val labelSmall: CustomTextStyle? = null,
+    //additional
+    val readMore: CustomTextStyle? = null,
+    val requiredTitle: CustomTextStyle? = null,
+    val requiredSectionTitle: CustomTextStyle? = null,
+    val requiredSectionBody: CustomTextStyle? = null,
+    val optionalTitle: CustomTextStyle? = null,
+    val optionalSectionTitle: CustomTextStyle? = null,
+    val optionalSectionBody: CustomTextStyle? = null
+) {
+
+    fun itemTitleStyle(isRequired: Boolean): TextStyle? =
+        if (isRequired) requiredTitle?.toTextStyle()
+        else optionalTitle?.toTextStyle()
+
+    fun sectionHeaderStyle(isRequired: Boolean): TextStyle? =
+        if (isRequired) requiredSectionTitle?.toTextStyle()
+        else optionalSectionTitle?.toTextStyle()
+
+    fun sectionBodyStyle(isRequired: Boolean): TextStyle? =
+        if (isRequired) requiredSectionBody?.toTextStyle()
+        else optionalSectionBody?.toTextStyle()
+
+    fun readMoreStyle(): TextStyle? = readMore?.toTextStyle()
+}
 
 internal fun CustomTypography.toTypography(): Typography {
     val defaultTypography = Typography()
@@ -35,7 +87,7 @@ internal fun CustomTypography.toTypography(): Typography {
 
     return Typography(
         headlineSmall = hs,
-        titleMedium =  tm,
+        titleMedium = tm,
         bodyMedium = bm,
         labelLarge = ll,
         labelSmall = ls

UI-SDK/src/main/java/com/cookieinformation/mobileconsents/sdk/ui/ui/ConsentsActivity.kt

@@ -21,12 +21,15 @@ class ConsentsActivity : ComponentActivity() {
 
         setContent {
             AndroidUiSDKTheme(
-                customerLightColorScheme = CustomUI.lightColorScheme,
-                customerDarkColorScheme = CustomUI.darkColorScheme,
+                additionalLightColors = CustomUI.lightColorSchemeWithCustom,
+                additionalDarkColors = CustomUI.darkColorSchemeWithCustom,
                 typography = CustomUI.typography
             ) {
                 ConsentsWrappingScreen(
                     viewModel = ConsentsViewModel(application),
+                    additionalLightColors = CustomUI.lightColorSchemeWithCustom,
+                    additionalDarkColors = CustomUI.darkColorSchemeWithCustom,
+                    additionalTypography = CustomUI.additionalTypography,
                     userId = userId
                 )
             }