feat(authenticator): Add support for Compose autofill

authenticator/src/main/java/com/amplifyframework/ui/authenticator/locals/LocalAuthenticatorStep.kt

@@ -0,0 +1,10 @@
+package com.amplifyframework.ui.authenticator.locals
+
+import androidx.compose.runtime.compositionLocalOf
+import com.amplifyframework.ui.authenticator.enums.AuthenticatorStep
+
+/**
+ * This composition local supplies the current AuthenticatorStep. This allows descendant composables to tailor
+ * their content to specific steps.
+ */
+internal val LocalAuthenticatorStep = compositionLocalOf<AuthenticatorStep> { AuthenticatorStep.Loading }

authenticator/src/main/java/com/amplifyframework/ui/authenticator/ui/Authenticator.kt

@@ -31,6 +31,7 @@
 import androidx.compose.material3.SnackbarHost
 import androidx.compose.material3.SnackbarHostState
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.CompositionLocalProvider
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.remember
 import androidx.compose.ui.Alignment
@@ -56,6 +57,7 @@
 import com.amplifyframework.ui.authenticator.SignedInState
 import com.amplifyframework.ui.authenticator.VerifyUserConfirmState
 import com.amplifyframework.ui.authenticator.VerifyUserState
+import com.amplifyframework.ui.authenticator.locals.LocalAuthenticatorStep
 import com.amplifyframework.ui.authenticator.rememberAuthenticatorState
 import com.amplifyframework.ui.authenticator.util.AuthenticatorMessage
 
@@ -140,31 +142,35 @@
                 Column(
                     modifier = Modifier.verticalScroll(rememberScrollState())
                 ) {
-                    headerContent()
-                    when (targetState) {
-                        is LoadingState -> loadingContent()
-                        is SignInState -> signInContent(targetState)
-                        is SignInConfirmMfaState -> signInConfirmMfaContent(targetState)
-                        is SignInConfirmCustomState -> signInConfirmCustomContent(targetState)
-                        is SignInConfirmNewPasswordState -> signInConfirmNewPasswordContent(
-                            targetState
-                        )
-                        is SignInConfirmTotpCodeState -> signInConfirmTotpCodeContent(targetState)
-                        is SignInContinueWithTotpSetupState -> signInContinueWithTotpSetupContent(targetState)
-                        is SignInContinueWithEmailSetupState -> signInContinueWithEmailSetupContent(targetState)
-                        is SignInContinueWithMfaSetupSelectionState ->
-                            signInContinueWithMfaSetupSelectionContent(targetState)
-                        is SignInContinueWithMfaSelectionState -> signInContinueWithMfaSelectionContent(targetState)
-                        is SignUpState -> signUpContent(targetState)
-                        is PasswordResetState -> passwordResetContent(targetState)
-                        is PasswordResetConfirmState -> passwordResetConfirmContent(targetState)
-                        is ErrorState -> errorContent(targetState)
-                        is SignUpConfirmState -> signUpConfirmContent(targetState)
-                        is VerifyUserState -> verifyUserContent(targetState)
-                        is VerifyUserConfirmState -> verifyUserConfirmContent(targetState)
-                        else -> Unit
+                    CompositionLocalProvider(LocalAuthenticatorStep provides targetState.step) {
+                        headerContent()
+                        when (targetState) {
+                            is LoadingState -> loadingContent()
+                            is SignInState -> signInContent(targetState)
+                            is SignInConfirmMfaState -> signInConfirmMfaContent(targetState)
+                            is SignInConfirmCustomState -> signInConfirmCustomContent(targetState)
+                            is SignInConfirmNewPasswordState -> signInConfirmNewPasswordContent(
+                                targetState
+                            )
+
+                            is SignInConfirmTotpCodeState -> signInConfirmTotpCodeContent(targetState)
+                            is SignInContinueWithTotpSetupState -> signInContinueWithTotpSetupContent(targetState)
+                            is SignInContinueWithEmailSetupState -> signInContinueWithEmailSetupContent(targetState)
+                            is SignInContinueWithMfaSetupSelectionState ->
+                                signInContinueWithMfaSetupSelectionContent(targetState)
+
+                            is SignInContinueWithMfaSelectionState -> signInContinueWithMfaSelectionContent(targetState)
+                            is SignUpState -> signUpContent(targetState)
+                            is PasswordResetState -> passwordResetContent(targetState)
+                            is PasswordResetConfirmState -> passwordResetConfirmContent(targetState)
+                            is ErrorState -> errorContent(targetState)
+                            is SignUpConfirmState -> signUpConfirmContent(targetState)
+                            is VerifyUserState -> verifyUserContent(targetState)
+                            is VerifyUserConfirmState -> verifyUserConfirmContent(targetState)
+                            else -> Unit
+                        }
+                        footerContent()
                     }
-                    footerContent()
                 }
             }
             SnackbarHost(hostState = snackbarState, modifier = Modifier.align(Alignment.BottomCenter))

authenticator/src/main/java/com/amplifyframework/ui/authenticator/ui/AuthenticatorForm.kt

@@ -48,7 +48,7 @@ internal fun AuthenticatorForm(
     ) {
         state.fields.values.forEach { field ->
             AuthenticatorField(
-                modifier = Modifier.fillMaxWidth().testTag(field.config.key.toString()),
+                modifier = Modifier.fillMaxWidth().testTag(field.config.key.testTag),
                 fieldConfig = field.config,
                 fieldState = field.state,
                 formState = state

authenticator/src/main/java/com/amplifyframework/ui/authenticator/ui/AuthenticatorLoading.kt

@@ -40,6 +40,7 @@
 import androidx.compose.ui.draw.clip
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.unit.Dp
+import androidx.compose.ui.unit.IntOffset
 import androidx.compose.ui.unit.dp
 
 /**
@@ -58,10 +59,7 @@
 }
 
 @Composable
-private fun LoadingDot(
-    modifier: Modifier = Modifier,
-    color: Color
-) {
+private fun LoadingDot(modifier: Modifier = Modifier, color: Color) {
     Box(
         modifier = modifier
             .clip(shape = CircleShape)
@@ -101,7 +99,7 @@
                 modifier = Modifier
                     .size(dotSize)
                     .aspectRatio(1f)
-                    .offset(y = offset.dp)
+                    .offset { IntOffset(x = 0, y = offset.dp.roundToPx()) }
             )
         }
     }

authenticator/src/main/java/com/amplifyframework/ui/authenticator/ui/PasswordInputField.kt

@@ -36,6 +36,7 @@ import com.amplifyframework.ui.authenticator.R
 import com.amplifyframework.ui.authenticator.forms.FieldConfig
 import com.amplifyframework.ui.authenticator.forms.MutablePasswordFieldState
 import com.amplifyframework.ui.authenticator.strings.StringResolver
+import com.amplifyframework.ui.authenticator.util.contentTypeForKey
 
 @Composable
 internal fun PasswordInputField(
@@ -55,7 +56,7 @@ internal fun PasswordInputField(
     )
 
     OutlinedTextField(
-        modifier = modifier,
+        modifier = modifier.contentTypeForKey(fieldConfig.key),
         enabled = enabled,
         value = fieldState.content,
         onValueChange = { fieldState.content = it },

authenticator/src/main/java/com/amplifyframework/ui/authenticator/ui/PasswordResetConfirm.kt

@@ -24,6 +24,8 @@ import androidx.compose.runtime.Composable
 import androidx.compose.runtime.rememberCoroutineScope
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.platform.LocalAutofillManager
+import androidx.compose.ui.platform.testTag
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.unit.dp
 import com.amplifyframework.auth.AuthCodeDeliveryDetails
@@ -62,12 +64,18 @@ fun PasswordResetConfirm(
 }
 
 @Composable
-fun PasswordResetConfirmFooter(
-    state: PasswordResetConfirmState,
-    modifier: Modifier = Modifier
-) {
+fun PasswordResetConfirmFooter(state: PasswordResetConfirmState, modifier: Modifier = Modifier) {
+    // If we navigate away from the screen via some reason other that submitting the form then cancel any changes
+    // in autofill manager so that user won't be prompted to update their saved password
+    val autofillManager = LocalAutofillManager.current
     Column(modifier = modifier.fillMaxWidth(), horizontalAlignment = Alignment.CenterHorizontally) {
-        TextButton(onClick = { state.moveTo(AuthenticatorStep.SignIn) }) {
+        TextButton(
+            modifier = Modifier.testTag(TestTags.BackToSignInButton),
+            onClick = {
+                autofillManager?.cancel()
+                state.moveTo(AuthenticatorStep.SignIn)
+            }
+        ) {
             Text(stringResource(R.string.amplify_ui_authenticator_button_back_to_signin))
         }
     }

authenticator/src/main/java/com/amplifyframework/ui/authenticator/ui/PhoneInputField.kt

@@ -64,6 +64,7 @@
 import com.amplifyframework.ui.authenticator.forms.MutableFieldState
 import com.amplifyframework.ui.authenticator.strings.StringResolver
 import com.amplifyframework.ui.authenticator.util.Region
+import com.amplifyframework.ui.authenticator.util.contentTypeForKey
 import com.amplifyframework.ui.authenticator.util.regionList
 import com.amplifyframework.ui.authenticator.util.regionMap
 import java.util.Locale
@@ -102,7 +103,7 @@
     }
 
     OutlinedTextField(
-        modifier = modifier,
+        modifier = modifier.contentTypeForKey(fieldConfig.key),
         enabled = enabled,
         value = state.number,
         onValueChange = { state.number = it },

authenticator/src/main/java/com/amplifyframework/ui/authenticator/ui/SignIn.kt

@@ -25,6 +25,7 @@ import androidx.compose.material3.TextButton
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.rememberCoroutineScope
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.platform.LocalAutofillManager
 import androidx.compose.ui.platform.testTag
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.unit.dp
@@ -61,20 +62,31 @@ fun SignIn(
 }
 
 @Composable
-fun SignInFooter(
-    state: SignInState,
-    modifier: Modifier = Modifier,
-    hideSignUp: Boolean = false
-) {
+fun SignInFooter(state: SignInState, modifier: Modifier = Modifier, hideSignUp: Boolean = false) {
+    // If we navigate away from the screen via some reason other that submitting the form then cancel any changes
+    // in autofill manager so that user won't be prompted to update their saved password
+    val autofillManager = LocalAutofillManager.current
     Row(
         modifier = modifier.fillMaxWidth(),
         horizontalArrangement = Arrangement.SpaceEvenly
     ) {
-        TextButton(onClick = { state.moveTo(AuthenticatorStep.PasswordReset) }) {
+        TextButton(
+            modifier = Modifier.testTag(TestTags.ForgotPasswordButton),
+            onClick = {
+                autofillManager?.cancel()
+                state.moveTo(AuthenticatorStep.PasswordReset)
+            }
+        ) {
             Text(stringResource(R.string.amplify_ui_authenticator_button_forgot_password))
         }
         if (!hideSignUp) {
-            TextButton(onClick = { state.moveTo(AuthenticatorStep.SignUp) }) {
+            TextButton(
+                modifier = Modifier.testTag(TestTags.CreateAccountButton),
+                onClick = {
+                    autofillManager?.cancel()
+                    state.moveTo(AuthenticatorStep.SignUp)
+                }
+            ) {
                 Text(stringResource(R.string.amplify_ui_authenticator_button_signup))
             }
         }

authenticator/src/main/java/com/amplifyframework/ui/authenticator/ui/SignUp.kt

@@ -25,6 +25,7 @@ import androidx.compose.runtime.Composable
 import androidx.compose.runtime.rememberCoroutineScope
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.platform.LocalAutofillManager
 import androidx.compose.ui.platform.testTag
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.unit.dp
@@ -59,12 +60,18 @@ fun SignUp(
 }
 
 @Composable
-fun SignUpFooter(
-    state: SignUpState,
-    modifier: Modifier = Modifier
-) {
+fun SignUpFooter(state: SignUpState, modifier: Modifier = Modifier) {
+    // If we navigate away from the screen via some reason other that submitting the form then cancel any changes
+    // in autofill manager so that user won't be prompted to update their saved password
+    val autofillManager = LocalAutofillManager.current
     Box(modifier = modifier.fillMaxWidth(), contentAlignment = Alignment.Center) {
-        TextButton(onClick = { state.moveTo(AuthenticatorStep.SignIn) }) {
+        TextButton(
+            modifier = Modifier.testTag(TestTags.BackToSignInButton),
+            onClick = {
+                autofillManager?.cancel()
+                state.moveTo(AuthenticatorStep.SignIn)
+            }
+        ) {
             Text(stringResource(R.string.amplify_ui_authenticator_button_back_to_signin))
         }
     }

authenticator/src/main/java/com/amplifyframework/ui/authenticator/ui/TestTags.kt

@@ -15,14 +15,22 @@
 
 package com.amplifyframework.ui.authenticator.ui
 
+import com.amplifyframework.ui.authenticator.forms.FieldKey
+
+@Suppress("ConstPropertyName")
 internal object TestTags {
     const val SignInConfirmButton = "SignInConfirmButton"
     const val BackToSignInButton = "BackToSignInButton"
     const val CopyKeyButton = "CopyKeyButton"
     const val SignInButton = "SignInButton"
     const val SignUpButton = "SignUpButton"
+    const val ForgotPasswordButton = "ForgotPasswordButton"
+    const val CreateAccountButton = "CreateAccountButton"
     const val PasswordResetButton = "PasswordResetButton"
     const val AuthenticatorTitle = "AuthenticatorTitle"
 
     const val ShowPasswordIcon = "ShowPasswordIcon"
 }
+
+internal val FieldKey.testTag: String
+    get() = this.toString()

authenticator/src/main/java/com/amplifyframework/ui/authenticator/ui/TextInputField.kt

@@ -28,6 +28,7 @@ import androidx.compose.ui.text.input.ImeAction
 import com.amplifyframework.ui.authenticator.forms.FieldConfig
 import com.amplifyframework.ui.authenticator.forms.MutableFieldState
 import com.amplifyframework.ui.authenticator.strings.StringResolver
+import com.amplifyframework.ui.authenticator.util.contentTypeForKey
 
 @Composable
 internal fun TextInputField(
@@ -40,8 +41,9 @@ internal fun TextInputField(
 
     val label = StringResolver.label(fieldConfig)
     val hint = StringResolver.hint(fieldConfig)
+
     OutlinedTextField(
-        modifier = modifier,
+        modifier = modifier.contentTypeForKey(fieldConfig.key),
         enabled = enabled,
         value = fieldState.content,
         onValueChange = { fieldState.content = it.take(fieldConfig.maxLength) },

authenticator/src/main/java/com/amplifyframework/ui/authenticator/util/Autofill.kt

@@ -0,0 +1,37 @@
+package com.amplifyframework.ui.authenticator.util
+
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.ReadOnlyComposable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.autofill.ContentType
+import androidx.compose.ui.semantics.contentType
+import androidx.compose.ui.semantics.semantics
+import com.amplifyframework.ui.authenticator.enums.AuthenticatorStep
+import com.amplifyframework.ui.authenticator.forms.FieldKey
+import com.amplifyframework.ui.authenticator.locals.LocalAuthenticatorStep
+
+@Composable
+@ReadOnlyComposable
+internal fun Modifier.contentTypeForKey(key: FieldKey): Modifier {
+    val derivedContentType = key.deriveContentType()
+    return this.semantics { if (derivedContentType != null) contentType = derivedContentType }
+}
+
+@Composable
+@ReadOnlyComposable
+internal fun FieldKey.deriveContentType(): ContentType? {
+    val step = LocalAuthenticatorStep.current
+    return when (this) {
+        is FieldKey.Username -> if (step.isNewUsername()) ContentType.NewUsername else ContentType.Username
+        is FieldKey.Password -> if (step.isNewPassword()) ContentType.NewPassword else ContentType.Password
+        is FieldKey.ConfirmPassword -> ContentType.NewPassword
+        is FieldKey.ConfirmationCode -> ContentType.SmsOtpCode
+        is FieldKey.Email -> ContentType.EmailAddress
+        is FieldKey.PhoneNumber -> ContentType.PhoneNumber
+        else -> null
+    }
+}
+
+private fun AuthenticatorStep.isNewUsername() = this is AuthenticatorStep.SignUp
+private fun AuthenticatorStep.isNewPassword() =
+    this is AuthenticatorStep.SignUp || this is AuthenticatorStep.PasswordResetConfirm

authenticator/src/test/java/com/amplifyframework/ui/authenticator/MockAuthenticatorData.kt

@@ -16,6 +16,7 @@
 package com.amplifyframework.ui.authenticator
 
 import com.amplifyframework.auth.AuthCodeDeliveryDetails
+import com.amplifyframework.auth.AuthCodeDeliveryDetails.DeliveryMedium
 import com.amplifyframework.auth.AuthException
 import com.amplifyframework.auth.AuthFactorType
 import com.amplifyframework.auth.AuthSession
@@ -138,3 +139,13 @@ internal fun mockUserAttributes(vararg attribute: Pair<AuthUserAttributeKey, Str
     attribute.map { AuthUserAttribute(it.first, it.second) }
 
 internal fun mockUser(userId: String = "userId", username: String = "username") = AuthUser(userId, username)
+
+internal fun mockAuthCodeDeliveryDetails(
+    destination: String = "123-123-1234",
+    deliveryMedium: DeliveryMedium = DeliveryMedium.SMS,
+    attributeName: String? = AuthUserAttributeKey.phoneNumber().keyString
+) = AuthCodeDeliveryDetails(
+    destination,
+    deliveryMedium,
+    attributeName
+)