feat: update alert message, inline alert, button, checkbox item, radio button item, switch item, suggestion chip, filter chip, link, tag and text input to allow the use of fixed images

NOTICE.txt

@@ -49,6 +49,7 @@ app/src/main/res/drawable/ic_sosh_tips_and_tricks.xml
 app/src/main/res/drawable/ic_typography.xml
 app/src/main/res/drawable/ic_ui_dark_mode.xml
 app/src/main/res/drawable/ic_ui_light_mode.xml
+app/src/main/res/drawable/ic_untinted_icon.png
 app/src/main/res/drawable/ic_wireframe_avatar.xml
 app/src/main/res/drawable/ic_wireframe_call.xml
 app/src/main/res/drawable/ic_wireframe_filters.xml

app/src/main/java/com/orange/ouds/app/ui/components/ComponentCode.kt

@@ -17,6 +17,7 @@ import androidx.annotation.PluralsRes
 import androidx.annotation.StringRes
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.toArgb
+import com.orange.ouds.app.R
 import com.orange.ouds.app.ui.utilities.Code
 import com.orange.ouds.app.ui.utilities.FunctionCall
 import com.orange.ouds.core.component.OudsColoredBoxColor
@@ -34,6 +35,19 @@ fun Code.Builder.coloredBoxCall(onColoredBox: Boolean, content: Code.Builder.()
     }
 }
 
+inline fun <reified T> FunctionCall.Builder.iconArgument(
+    name: String,
+    @DrawableRes resId: Int,
+    @StringRes contentDescriptionResId: Int? = null,
+    tinted: Boolean = true
+) {
+    constructorCallArgument<T>(name) {
+        painterArgument(if (tinted) resId else R.drawable.ic_untinted_icon)
+        contentDescriptionResId?.let { contentDescriptionArgument(it) }
+        if (!tinted) tintedArgument(tinted)
+    }
+}
+
 fun FunctionCall.Builder.painterArgument(@DrawableRes resId: Int) {
     functionCallArgument(Argument.Painter, "painterResource") {
         typedArgument(Argument.Id, resId)
@@ -61,6 +75,8 @@ fun FunctionCall.Builder.contentDescriptionArgument(@PluralsRes resId: Int, coun
 
 fun FunctionCall.Builder.enabledArgument(value: Boolean) = typedArgument(Argument.Enabled, value)
 
+fun FunctionCall.Builder.tintedArgument(value: Boolean) = typedArgument(Argument.Tinted, value)
+
 fun FunctionCall.Builder.errorArgument(message: String) {
     constructorCallArgument<OudsError>(Argument.Error) {
         typedArgument("message", message)
@@ -93,4 +109,5 @@ private object Argument {
     const val OnClick = "onClick"
     const val Painter = "painter"
     const val ReadOnly = "readOnly"
+    const val Tinted = "tinted"
 }

app/src/main/java/com/orange/ouds/app/ui/components/alert/AlertMessageDemoScreen.kt

@@ -23,8 +23,9 @@ import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.tooling.preview.PreviewLightDark
 import com.orange.ouds.app.R
 import com.orange.ouds.app.ui.components.alert.AlertMessageDemoState.Companion.MaxBulletCount
+import com.orange.ouds.app.ui.components.iconArgument
 import com.orange.ouds.app.ui.components.labelArgument
-import com.orange.ouds.app.ui.components.painterArgument
+import com.orange.ouds.app.ui.components.onClickArgument
 import com.orange.ouds.app.ui.utilities.Code
 import com.orange.ouds.app.ui.utilities.LocalThemeDrawableResources
 import com.orange.ouds.app.ui.utilities.ThemeDrawableResources
@@ -37,12 +38,13 @@ import com.orange.ouds.app.ui.utilities.composable.CustomizationSwitchItem
 import com.orange.ouds.app.ui.utilities.composable.CustomizationTextInput
 import com.orange.ouds.app.ui.utilities.composable.DemoScreen
 import com.orange.ouds.app.ui.utilities.nestedName
-import com.orange.ouds.app.ui.utilities.toSentenceCase
+import com.orange.ouds.app.ui.utilities.rememberUntintedIconPainter
 import com.orange.ouds.core.component.OudsAlertIcon
 import com.orange.ouds.core.component.OudsAlertMessage
 import com.orange.ouds.core.component.OudsAlertMessageActionLink
 import com.orange.ouds.core.component.OudsAlertMessageActionLinkPosition
 import com.orange.ouds.core.component.OudsAlertMessageStatus
+import com.orange.ouds.foundation.extensions.toSentenceCase
 import com.orange.ouds.foundation.extensions.tryOrNull
 import com.orange.ouds.theme.OudsVersion
 import kotlin.reflect.full.createInstance
@@ -100,10 +102,16 @@ private fun AlertMessageDemoBottomSheetContent(state: AlertMessageDemoState) {
             onSelectionChange = { status = statuses[it] }
         )
         CustomizationSwitchItem(
-            label = stringResource(R.string.app_components_alert_alertMessage_statusIcon_tech),
-            checked = hasStatusIcon,
-            onCheckedChange = { hasStatusIcon = it },
-            enabled = statusIconSwitchEnabled
+            label = stringResource(R.string.app_components_common_icon_tech),
+            checked = hasIcon,
+            onCheckedChange = { hasIcon = it },
+            enabled = iconSwitchEnabled
+        )
+        CustomizationSwitchItem(
+            label = stringResource(R.string.app_components_common_tintedIcon_tech),
+            checked = tintedIcon,
+            onCheckedChange = { tintedIcon = it },
+            enabled = tintedIconSwitchEnabled
         )
         CustomizationSwitchItem(
             label = stringResource(R.string.app_components_alert_alertMessage_closeButton_tech),
@@ -155,14 +163,19 @@ private fun AlertMessageDemoBottomSheetContent(state: AlertMessageDemoState) {
 
 @Composable
 private fun AlertMessageDemoContent(state: AlertMessageDemoState) {
-    val icon = OudsAlertIcon(painter = painterResource(LocalThemeDrawableResources.current.tipsAndTricks))
     with(state) {
+        val painter = if (tintedIcon) {
+            painterResource(LocalThemeDrawableResources.current.tipsAndTricks)
+        } else {
+            rememberUntintedIconPainter()
+        }
+        val icon = OudsAlertIcon(painter = painter, tinted = tintedIcon)
         OudsAlertMessage(
             label = label,
             description = description,
             status = when (status) {
-                is OudsAlertMessageStatus.Accent -> OudsAlertMessageStatus.Accent(if (hasStatusIcon) icon else null)
-                is OudsAlertMessageStatus.Neutral -> OudsAlertMessageStatus.Neutral(if (hasStatusIcon) icon else null)
+                is OudsAlertMessageStatus.Accent -> OudsAlertMessageStatus.Accent(if (hasIcon) icon else null)
+                is OudsAlertMessageStatus.Neutral -> OudsAlertMessageStatus.Neutral(if (hasIcon) icon else null)
                 is OudsAlertMessageStatus.Info -> OudsAlertMessageStatus.Info
                 is OudsAlertMessageStatus.Negative -> OudsAlertMessageStatus.Negative
                 is OudsAlertMessageStatus.Positive -> OudsAlertMessageStatus.Positive
@@ -189,10 +202,8 @@ private fun Code.Builder.alertMessageDemoCodeSnippet(state: AlertMessageDemoStat
                 is OudsAlertMessageStatus.Accent,
                 is OudsAlertMessageStatus.Neutral -> {
                     functionCallArgument(statusParameterName, status::class.java.nestedName) {
-                        if (hasStatusIcon) {
-                            constructorCallArgument<OudsAlertIcon>("icon") {
-                                painterArgument(themeDrawableResources.tipsAndTricks)
-                            }
+                        if (hasIcon) {
+                            iconArgument<OudsAlertIcon>("icon", themeDrawableResources.tipsAndTricks, tinted = tintedIcon)
                         }
                     }
                 }
@@ -211,9 +222,9 @@ private fun Code.Builder.alertMessageDemoCodeSnippet(state: AlertMessageDemoStat
                 }
             }
             if (!actionLink.isNullOrEmpty()) {
-                functionCallArgument("actionLink", OudsAlertMessageActionLink::class.java.simpleName) {
+                constructorCallArgument<OudsAlertMessageActionLink>("actionLink") {
                     labelArgument(actionLink)
-                    lambdaArgument("onClick") {
+                    onClickArgument {
                         comment("Implement click")
                     }
                     typedArgument("position", actionLinkPosition)

app/src/main/java/com/orange/ouds/app/ui/components/alert/AlertMessageDemoState.kt

@@ -28,36 +28,39 @@ import kotlin.reflect.full.createInstance
 @Composable
 fun rememberAlertMessageDemoState(
     status: OudsAlertMessageStatus = OudsAlertMessageDefaults.Status,
-    hasStatusIcon: Boolean = true,
+    hasIcon: Boolean = true,
     hasCloseButton: Boolean = false,
     label: String = stringResource(id = R.string.app_components_common_label_label),
     description: String? = null,
     actionLink: String? = null,
     actionLinkPosition: OudsAlertMessageActionLinkPosition = OudsAlertMessageDefaults.ActionLinkPosition,
-    bulletList: Map<Int, String>? = null
+    bulletList: Map<Int, String>? = null,
+    tintedIcon: Boolean = true
 ) = rememberSaveable(
     status,
-    hasStatusIcon,
+    hasIcon,
     hasCloseButton,
     label,
     description,
     actionLink,
     actionLinkPosition,
     bulletList,
+    tintedIcon,
     saver = AlertMessageDemoState.Saver
 ) {
-    AlertMessageDemoState(status, hasStatusIcon, hasCloseButton, label, description, actionLink, actionLinkPosition, bulletList)
+    AlertMessageDemoState(status, hasIcon, hasCloseButton, label, description, actionLink, actionLinkPosition, bulletList, tintedIcon)
 }
 
 class AlertMessageDemoState(
     status: OudsAlertMessageStatus,
-    hasStatusIcon: Boolean,
+    hasIcon: Boolean,
     hasCloseButton: Boolean,
     label: String,
     description: String?,
     actionLink: String?,
     actionLinkPosition: OudsAlertMessageActionLinkPosition,
-    bulletList: Map<Int, String>?
+    bulletList: Map<Int, String>?,
+    tintedIcon: Boolean
 ) {
 
     @Suppress("UNCHECKED_CAST")
@@ -76,13 +79,14 @@ class AlertMessageDemoState(
                 with(state) {
                     listOf(
                         status::class.java.name,
-                        hasStatusIcon,
+                        hasIcon,
                         hasCloseButton,
                         label,
                         description,
                         actionLink,
                         actionLinkPosition,
-                        bulletList
+                        bulletList,
+                        tintedIcon
                     )
                 }
             },
@@ -98,7 +102,8 @@ class AlertMessageDemoState(
                     list[4] as String?,
                     list[5] as String?,
                     list[6] as OudsAlertMessageActionLinkPosition,
-                    list[7] as Map<Int, String>?
+                    list[7] as Map<Int, String>?,
+                    list[8] as Boolean
                 )
             }
         )
@@ -110,11 +115,12 @@ class AlertMessageDemoState(
         set(value) {
             _status = value
             if (status in FunctionalStatuses) {
-                hasStatusIcon = true
+                hasIcon = true
+                tintedIcon = true
             }
         }
 
-    var hasStatusIcon: Boolean by mutableStateOf(hasStatusIcon)
+    var hasIcon: Boolean by mutableStateOf(hasIcon)
 
     var hasCloseButton: Boolean by mutableStateOf(hasCloseButton)
 
@@ -126,11 +132,16 @@ class AlertMessageDemoState(
 
     var actionLinkPosition: OudsAlertMessageActionLinkPosition by mutableStateOf(actionLinkPosition)
 
-    val statusIconSwitchEnabled: Boolean
+    val iconSwitchEnabled: Boolean
         get() = status !in FunctionalStatuses
 
     val actionLinkPositionChipsEnabled: Boolean
         get() = !actionLink.isNullOrEmpty()
 
     var bulletList: Map<Int, String>? by mutableStateOf(bulletList)
+
+    var tintedIcon: Boolean by mutableStateOf(tintedIcon)
+
+    val tintedIconSwitchEnabled: Boolean
+        get() = status !in FunctionalStatuses && hasIcon
 }

app/src/main/java/com/orange/ouds/app/ui/components/alert/InlineAlertDemoScreen.kt

@@ -23,22 +23,24 @@ import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.tooling.preview.PreviewLightDark
 import com.orange.ouds.app.R
+import com.orange.ouds.app.ui.components.iconArgument
 import com.orange.ouds.app.ui.components.labelArgument
-import com.orange.ouds.app.ui.components.painterArgument
 import com.orange.ouds.app.ui.utilities.Code
 import com.orange.ouds.app.ui.utilities.LocalThemeDrawableResources
 import com.orange.ouds.app.ui.utilities.ThemeDrawableResources
 import com.orange.ouds.app.ui.utilities.composable.AppPreview
 import com.orange.ouds.app.ui.utilities.composable.CustomizationDropdownMenu
 import com.orange.ouds.app.ui.utilities.composable.CustomizationDropdownMenuItem
+import com.orange.ouds.app.ui.utilities.composable.CustomizationSwitchItem
 import com.orange.ouds.app.ui.utilities.composable.CustomizationTextInput
 import com.orange.ouds.app.ui.utilities.composable.DemoScreen
 import com.orange.ouds.app.ui.utilities.nestedName
-import com.orange.ouds.app.ui.utilities.toSentenceCase
+import com.orange.ouds.app.ui.utilities.rememberUntintedIconPainter
 import com.orange.ouds.core.component.OudsAlertIcon
 import com.orange.ouds.core.component.OudsInlineAlert
 import com.orange.ouds.core.component.OudsInlineAlertStatus
 import com.orange.ouds.foundation.extensions.orElse
+import com.orange.ouds.foundation.extensions.toSentenceCase
 import com.orange.ouds.foundation.extensions.tryOrNull
 import com.orange.ouds.theme.OudsVersion
 
@@ -98,6 +100,12 @@ private fun InlineAlertDemoBottomSheetContent(state: InlineAlertDemoState) {
             selectedItemIndex = statuses.indexOfFirst { it::class.qualifiedName == status::class.qualifiedName },
             onSelectionChange = { status = statuses[it] }
         )
+        CustomizationSwitchItem(
+            label = stringResource(R.string.app_components_common_tintedIcon_tech),
+            checked = tintedIcon,
+            onCheckedChange = { tintedIcon = it },
+            enabled = tintedIconSwitchEnabled
+        )
         CustomizationTextInput(
             applyTopPadding = true,
             label = stringResource(R.string.app_components_common_label_label),
@@ -109,8 +117,13 @@ private fun InlineAlertDemoBottomSheetContent(state: InlineAlertDemoState) {
 
 @Composable
 private fun InlineAlertDemoContent(state: InlineAlertDemoState) {
-    val icon = OudsAlertIcon(painter = painterResource(LocalThemeDrawableResources.current.tipsAndTricks))
     with(state) {
+        val painter = if (tintedIcon) {
+            painterResource(LocalThemeDrawableResources.current.tipsAndTricks)
+        } else {
+            rememberUntintedIconPainter()
+        }
+        val icon = OudsAlertIcon(painter = painter, tinted = tintedIcon)
         OudsInlineAlert(
             label = label,
             status = when (status) {
@@ -133,9 +146,7 @@ private fun Code.Builder.inlineAlertDemoCodeSnippet(state: InlineAlertDemoState,
                 is OudsInlineAlertStatus.Accent,
                 is OudsInlineAlertStatus.Neutral -> {
                     functionCallArgument(statusParameterName, status::class.java.nestedName) {
-                        constructorCallArgument<OudsAlertIcon>("icon") {
-                            painterArgument(themeDrawableResources.tipsAndTricks)
-                        }
+                        iconArgument<OudsAlertIcon>("icon", themeDrawableResources.tipsAndTricks, tinted = tintedIcon)
                     }
                 }
                 OudsInlineAlertStatus.Info,

app/src/main/java/com/orange/ouds/app/ui/components/alert/InlineAlertDemoState.kt

@@ -28,26 +28,38 @@ import com.orange.ouds.core.component.OudsInlineAlertStatus
 fun rememberInlineAlertDemoState(
     label: String = stringResource(id = R.string.app_components_common_label_label),
     status: OudsInlineAlertStatus = OudsInlineAlertDefaults.Status,
+    tintedIcon: Boolean = true
 ) = rememberSaveable(
     label,
     status,
+    tintedIcon,
     saver = InlineAlertDemoState.Saver
 ) {
-    InlineAlertDemoState(label, status)
+    InlineAlertDemoState(label, status, tintedIcon)
 }
 
 class InlineAlertDemoState(
     label: String,
-    status: OudsInlineAlertStatus
+    status: OudsInlineAlertStatus,
+    tintedIcon: Boolean
 ) {
 
     companion object {
+
+        private val FunctionalStatuses = listOf(
+            OudsInlineAlertStatus.Info,
+            OudsInlineAlertStatus.Negative,
+            OudsInlineAlertStatus.Positive,
+            OudsInlineAlertStatus.Warning
+        )
+
         val Saver = listSaver(
             save = { state ->
                 with(state) {
                     listOf(
                         label,
-                        status::class.java.name
+                        status::class.java.name,
+                        tintedIcon
                     )
                 }
             },
@@ -61,13 +73,27 @@ class InlineAlertDemoState(
 
                 InlineAlertDemoState(
                     list[0] as String,
-                    status
+                    status,
+                    list[2] as Boolean
                 )
             }
         )
     }
 
-    var status: OudsInlineAlertStatus by mutableStateOf(status)
+    private var _status: OudsInlineAlertStatus by mutableStateOf(status)
+    var status: OudsInlineAlertStatus
+        get() = _status
+        set(value) {
+            _status = value
+            if (status in FunctionalStatuses) {
+                tintedIcon = true
+            }
+        }
 
     var label: String by mutableStateOf(label)
+
+    var tintedIcon: Boolean by mutableStateOf(tintedIcon)
+
+    val tintedIconSwitchEnabled: Boolean
+        get() = status !in FunctionalStatuses
 }