HMA-9778-textview-accessibility-invalid-input (#207)

Author: rajesh-1394

components-compose/src/main/java/uk/gov/hmrc/components/compose/molecule/input/CommonInputView.kt

@@ -23,6 +23,7 @@ import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.foundation.text.KeyboardOptions
 import androidx.compose.material3.OutlinedTextField
+import androidx.compose.material3.OutlinedTextFieldDefaults
 import androidx.compose.material3.Text
 import androidx.compose.material3.TextFieldColors
 import androidx.compose.runtime.Composable
@@ -41,6 +42,7 @@ import uk.gov.hmrc.components.compose.atom.text.ErrorText
 import uk.gov.hmrc.components.compose.molecule.input.CommonInputView.CHAR_COUNT_WIDTH
 import uk.gov.hmrc.components.compose.molecule.input.CommonInputView.ERROR_TEXT_WITH_CHAR_COUNT_WIDTH
 import uk.gov.hmrc.components.compose.ui.theme.HmrcTheme
+import uk.gov.hmrc.components.compose.ui.theme.HmrcTheme.colors
 import uk.gov.hmrc.components.compose.ui.theme.HmrcTheme.typography
 
 @Suppress("LongParameterList")
@@ -59,11 +61,19 @@ internal fun TextField(
     colors: TextFieldColors,
     trailingIcon: @Composable() (() -> Unit)? = null,
     textStyle: TextStyle = typography.body,
-    interactionSource: MutableInteractionSource = remember { MutableInteractionSource() }
+    interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
+    isCustomErrorInputHandle: Boolean
 ) {
+    var customIsError = isError
+    val customColors = if (isCustomErrorInputHandle && isError) {
+        customIsError = false
+        customTextInputViewColors(colors, isError)
+    } else {
+        colors
+    }
     OutlinedTextField(
         modifier = modifier.fillMaxWidth(),
-        isError = isError,
+        isError = customIsError,
         value = value,
         onValueChange = onInputValueChange,
         prefix = prefix,
@@ -73,7 +83,7 @@ internal fun TextField(
         singleLine = singleLine,
         keyboardOptions = keyboardOptions,
         textStyle = textStyle,
-        colors = colors,
+        colors = customColors,
         shape = RoundedCornerShape(0),
         visualTransformation = visualTransformation,
         interactionSource = interactionSource,
@@ -157,6 +167,36 @@ internal fun errorTextCounterCombo(
     }
 }
 
+@Composable
+internal fun customTextInputViewColors(textFieldColors: TextFieldColors, isError: Boolean): TextFieldColors {
+    return OutlinedTextFieldDefaults.colors(
+        focusedTextColor = textFieldColors.focusedTextColor,
+        unfocusedTextColor = textFieldColors.unfocusedTextColor,
+        errorTextColor = textFieldColors.errorTextColor,
+        errorLeadingIconColor = textFieldColors.errorLeadingIconColor,
+        focusedTrailingIconColor = textFieldColors.focusedTrailingIconColor,
+        unfocusedTrailingIconColor = textFieldColors.unfocusedTrailingIconColor,
+        errorTrailingIconColor = textFieldColors.errorTrailingIconColor,
+        focusedLabelColor = textFieldColors.focusedLabelColor,
+        unfocusedLabelColor = textFieldColors.unfocusedLabelColor,
+        errorLabelColor = textFieldColors.errorLabelColor,
+        focusedBorderColor = if (isError) {
+            colors.hmrcBlack
+        } else {
+            colors.hmrcBlue
+        },
+        errorBorderColor = colors.hmrcBlack,
+        unfocusedBorderColor = colors.hmrcBlack,
+        focusedPlaceholderColor = textFieldColors.focusedPlaceholderColor,
+        unfocusedPlaceholderColor = textFieldColors.unfocusedPlaceholderColor,
+        errorPlaceholderColor = textFieldColors.errorPlaceholderColor,
+        errorSupportingTextColor = textFieldColors.errorSupportingTextColor,
+        focusedSupportingTextColor = textFieldColors.focusedSupportingTextColor,
+        cursorColor = textFieldColors.cursorColor,
+        errorCursorColor = textFieldColors.errorCursorColor,
+    )
+}
+
 object CommonInputView {
     const val ERROR_TEXT_WITH_CHAR_COUNT_WIDTH = 0.8f
     const val CHAR_COUNT_WIDTH = 0.95f

components-compose/src/main/java/uk/gov/hmrc/components/compose/molecule/input/PasswordInputView.kt

@@ -81,6 +81,7 @@ fun PasswordInputView(
     numericOnly: Boolean = true,
     maxChars: Int? = null,
     requiredSequencesSpacing: Boolean = true,
+    isCustomErrorInputHandle: Boolean = false
 ) {
     // pattern matches a non decimal number
     val nonDecimalPattern = remember { Regex("^([0-9]*)$") }
@@ -110,7 +111,8 @@ fun PasswordInputView(
         passwordTrailingButton = passwordTrailingButton,
         maxChars = maxChars,
         numericOnly = numericOnly,
-        requiredSequencesSpacing = requiredSequencesSpacing
+        requiredSequencesSpacing = requiredSequencesSpacing,
+        isCustomErrorInputHandle = isCustomErrorInputHandle
     )
 }
 
@@ -169,6 +171,7 @@ private fun PasswordTextInputView(
     maxChars: Int? = null,
     requiredSequencesSpacing: Boolean = true,
     interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
+    isCustomErrorInputHandle: Boolean
 ) {
     var hideButtonShown: Boolean by rememberSaveable { mutableStateOf(false) }
 
@@ -277,7 +280,8 @@ private fun PasswordTextInputView(
                         unfocusedBorderColor = HmrcTheme.colors.hmrcTransparent,
                         focusedBorderColor = HmrcTheme.colors.hmrcTransparent
                     ),
-                    interactionSource = interactionSource
+                    interactionSource = interactionSource,
+                    isCustomErrorInputHandle = isCustomErrorInputHandle
                 )
             }
 

components-compose/src/main/java/uk/gov/hmrc/components/compose/molecule/input/TextInputView.kt

@@ -55,7 +55,8 @@ object TextInputView {
         maxChars: Int? = null,
         singleLine: Boolean = false,
         keyboardOptions: KeyboardOptions = KeyboardOptions.Default,
-        requiredSequencesSpacing: Boolean = false
+        requiredSequencesSpacing: Boolean = false,
+        isCustomErrorInputHandle: Boolean = false
     ) {
         var localValue: String by rememberSaveable { mutableStateOf(value.orEmpty()) }
         localValue = value.orEmpty()
@@ -109,7 +110,8 @@ object TextInputView {
                 trailingIcon = clearTrailingIcon,
                 colors = HmrcTheme.textFieldColors,
                 textStyle =
-                if (requiredSequencesSpacing) { HmrcTheme.typography.sequencesBody } else { HmrcTheme.typography.body }
+                if (requiredSequencesSpacing) { HmrcTheme.typography.sequencesBody } else { HmrcTheme.typography.body },
+                isCustomErrorInputHandle = isCustomErrorInputHandle
             )
         }
     }