Improve high contrast management for chips

Author: paulinea

core/src/main/java/com/orange/ouds/core/component/OudsChip.kt

@@ -49,6 +49,7 @@ import com.orange.ouds.core.component.content.OudsComponentContent
 import com.orange.ouds.core.component.content.OudsComponentIcon
 import com.orange.ouds.core.extensions.InteractionState
 import com.orange.ouds.core.extensions.collectInteractionStateAsState
+import com.orange.ouds.core.extensions.isTransparent
 import com.orange.ouds.core.theme.LocalHighContrastModeEnabled
 import com.orange.ouds.core.theme.OudsTheme
 import com.orange.ouds.core.theme.takeUnlessHairline
@@ -217,12 +218,7 @@ private fun borderWidth(state: OudsChipState, selected: Boolean): Dp? {
 private fun borderColor(state: OudsChipState, selected: Boolean): Color {
     return with(OudsTheme.componentsTokens.chip) {
         when (state) {
-            OudsChipState.Enabled -> when {
-                // In order to reach the a11y AAA level, when high contrast mode is enabled, the enabled chip border color must use `color.content.default` token
-                LocalHighContrastModeEnabled.current -> OudsTheme.colorScheme.content.default
-                selected -> colorBorderSelectedEnabled.value
-                else -> colorBorderUnselectedEnabled.value
-            }
+            OudsChipState.Enabled -> if (selected) colorBorderSelectedEnabled.value.highContrasted() else colorBorderUnselectedEnabled.value
             OudsChipState.Focused -> if (selected) colorBorderSelectedFocus.value else colorBorderUnselectedFocus.value
             OudsChipState.Hovered -> if (selected) colorBorderSelectedHover.value else colorBorderUnselectedHover.value
             OudsChipState.Pressed -> if (selected) colorBorderSelectedPressed.value else colorBorderUnselectedPressed.value
@@ -235,25 +231,29 @@ private fun borderColor(state: OudsChipState, selected: Boolean): Color {
 private fun backgroundColor(state: OudsChipState, selected: Boolean): Color {
     return with(OudsTheme.componentsTokens.chip) {
         when (state) {
-            OudsChipState.Enabled -> if (selected) colorBgSelectedEnabled else colorBgUnselectedEnabled
-            OudsChipState.Focused -> if (selected) colorBgSelectedFocus else colorBgUnselectedFocus
-            OudsChipState.Hovered -> if (selected) colorBgSelectedHover else colorBgUnselectedHover
-            OudsChipState.Pressed -> if (selected) colorBgSelectedPressed else colorBgUnselectedPressed
-            OudsChipState.Disabled -> if (selected) colorBgSelectedDisabled else colorBgUnselectedDisabled
-        }.value
+            OudsChipState.Enabled -> if (selected) colorBgSelectedEnabled.value.highContrasted() else colorBgUnselectedEnabled.value
+            OudsChipState.Focused -> if (selected) colorBgSelectedFocus.value else colorBgUnselectedFocus.value
+            OudsChipState.Hovered -> if (selected) colorBgSelectedHover.value else colorBgUnselectedHover.value
+            OudsChipState.Pressed -> if (selected) colorBgSelectedPressed.value else colorBgUnselectedPressed.value
+            OudsChipState.Disabled -> if (selected) colorBgSelectedDisabled.value else colorBgUnselectedDisabled.value
+        }
     }
 }
 
 @Composable
 private fun contentColor(state: OudsChipState, selected: Boolean): Color {
     return with(OudsTheme.componentsTokens.chip) {
         when (state) {
-            OudsChipState.Enabled -> if (selected) colorContentSelectedEnabled else colorContentUnselectedEnabled
-            OudsChipState.Focused -> if (selected) colorContentSelectedFocus else colorContentUnselectedFocus
-            OudsChipState.Hovered -> if (selected) colorContentSelectedHover else colorContentUnselectedHover
-            OudsChipState.Pressed -> if (selected) colorContentSelectedPressed else colorContentUnselectedPressed
-            OudsChipState.Disabled -> if (selected) colorContentSelectedDisabled else colorContentUnselectedDisabled
-        }.value
+            OudsChipState.Enabled -> if (selected) {
+                colorContentSelectedEnabled.value.highContrasted(onBackground = colorBgSelectedEnabled.value)
+            } else {
+                colorContentUnselectedEnabled.value
+            }
+            OudsChipState.Focused -> if (selected) colorContentSelectedFocus.value else colorContentUnselectedFocus.value
+            OudsChipState.Hovered -> if (selected) colorContentSelectedHover.value else colorContentUnselectedHover.value
+            OudsChipState.Pressed -> if (selected) colorContentSelectedPressed.value else colorContentUnselectedPressed.value
+            OudsChipState.Disabled -> if (selected) colorContentSelectedDisabled.value else colorContentUnselectedDisabled.value
+        }
     }
 }
 
@@ -262,7 +262,7 @@ private fun tickColor(state: OudsChipState, selected: Boolean): Color? {
     return with(OudsTheme.componentsTokens.chip) {
         if (selected) {
             when (state) {
-                OudsChipState.Enabled -> if (LocalHighContrastModeEnabled.current) OudsTheme.colorScheme.content.default else colorContentSelectedTickEnabled.value
+                OudsChipState.Enabled -> colorContentSelectedTickEnabled.value.highContrasted(onBackground = colorBgSelectedEnabled.value)
                 OudsChipState.Focused -> colorContentSelectedFocus.value
                 OudsChipState.Hovered -> colorContentSelectedHover.value
                 OudsChipState.Pressed -> colorContentSelectedPressed.value
@@ -298,6 +298,31 @@ private fun contentPadding(label: String?, icon: OudsChipIcon?, iconPosition: Ou
     }
 }
 
+/**
+ * Returns a high contrast color when high contrast mode is enabled.
+ *
+ * This extension replaces the current color with appropriate high contrast alternatives from the theme's color scheme:
+ * - If [onBackground] is provided (color used on a background):
+ *   - Returns `background.primary` if the current color is opaque
+ *   - Returns `content.default` if the current color is transparent
+ * - If [onBackground] is null (color not on a background):
+ *   - Returns `content.default` if the current color is opaque
+ *   - Returns the current color unchanged if it is transparent
+ *
+ * When high contrast mode is disabled, the current color is returned unchanged.
+ *
+ * @param onBackground The background color on which this color will be displayed, or `null` if not applicable.
+ * @return The high contrast color when enabled, or the current color otherwise.
+ */
+@Composable
+private fun Color.highContrasted(onBackground: Color? = null): Color = when {
+    !LocalHighContrastModeEnabled.current -> this
+    onBackground != null && isTransparent() -> OudsTheme.colorScheme.content.default
+    onBackground != null -> OudsTheme.colorScheme.background.primary
+    isTransparent() -> this
+    else -> OudsTheme.colorScheme.content.default
+}
+
 /**
  * An icon in an [OudsFilterChip] or an [OudsSuggestionChip].
  * This icon is not clickable.

core/src/main/java/com/orange/ouds/core/extensions/ColorExt.kt

@@ -0,0 +1,17 @@
+/*
+ * Software Name: OUDS Android
+ * SPDX-FileCopyrightText: Copyright (c) Orange SA
+ * SPDX-License-Identifier: MIT
+ *
+ * This software is distributed under the MIT license,
+ * the text of which is available at https://opensource.org/license/MIT/
+ * or see the "LICENSE" file for more details.
+ *
+ * Software description: Android library of reusable graphical components
+ */
+
+package com.orange.ouds.core.extensions
+
+import androidx.compose.ui.graphics.Color
+
+fun Color.isTransparent() = this.alpha == 0f