Jetsurvey components converted to m3

This converts all Jetsurvey components like Button or Text to their m3
versions and updates all theming to be m3. There is still a lot of
visual work to be done as well as fixing the custom content alphas and
various colors throughout, but now it's functional.

Jetsurvey/app/src/main/java/com/example/compose/jetsurvey/signinsignup/SignInFragment.kt

@@ -26,7 +26,7 @@ import androidx.fragment.app.viewModels
 import com.example.compose.jetsurvey.R
 import com.example.compose.jetsurvey.Screen
 import com.example.compose.jetsurvey.navigate
-import com.example.compose.jetsurvey.theme.JetsurveyThemeOld
+import com.example.compose.jetsurvey.theme.JetsurveyTheme
 
 /**
  * Fragment containing the sign in UI.
@@ -55,7 +55,7 @@ class SignInFragment : Fragment() {
                 ViewGroup.LayoutParams.MATCH_PARENT
             )
             setContent {
-                JetsurveyThemeOld {
+                JetsurveyTheme {
                     SignIn(
                         onNavigationEvent = { event ->
                             when (event) {

Jetsurvey/app/src/main/java/com/example/compose/jetsurvey/signinsignup/SignInScreen.kt

@@ -16,6 +16,8 @@
 
 package com.example.compose.jetsurvey.signinsignup
 
+import android.content.res.Configuration.UI_MODE_NIGHT_NO
+import android.content.res.Configuration.UI_MODE_NIGHT_YES
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Spacer
@@ -24,15 +26,15 @@ import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.wrapContentHeight
-import androidx.compose.material.Button
-import androidx.compose.material.ExperimentalMaterialApi
-import androidx.compose.material.MaterialTheme
-import androidx.compose.material.Scaffold
-import androidx.compose.material.Snackbar
-import androidx.compose.material.SnackbarHost
-import androidx.compose.material.SnackbarHostState
-import androidx.compose.material.Text
-import androidx.compose.material.TextButton
+import androidx.compose.material3.Button
+import androidx.compose.material3.ExperimentalMaterial3Api
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.Scaffold
+import androidx.compose.material3.Snackbar
+import androidx.compose.material3.SnackbarHost
+import androidx.compose.material3.SnackbarHostState
+import androidx.compose.material3.Text
+import androidx.compose.material3.TextButton
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
@@ -47,8 +49,7 @@ import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import com.example.compose.jetsurvey.R
-import com.example.compose.jetsurvey.theme.JetsurveyThemeOld
-import com.example.compose.jetsurvey.theme.snackbarAction
+import com.example.compose.jetsurvey.theme.JetsurveyTheme
 import com.example.compose.jetsurvey.util.supportWideScreen
 import kotlinx.coroutines.launch
 
@@ -59,7 +60,7 @@ sealed class SignInEvent {
     object NavigateBack : SignInEvent()
 }
 
-@OptIn(ExperimentalMaterialApi::class)
+@OptIn(ExperimentalMaterial3Api::class) // Scaffold is experimental in m3
 @Composable
 fun SignIn(onNavigationEvent: (SignInEvent) -> Unit) {
 
@@ -157,7 +158,6 @@ fun SignInContent(
     }
 }
 
-@OptIn(ExperimentalMaterialApi::class)
 @Composable
 fun ErrorSnackbar(
     snackbarHostState: SnackbarHostState,
@@ -171,16 +171,16 @@ fun ErrorSnackbar(
                 modifier = Modifier.padding(16.dp),
                 content = {
                     Text(
-                        text = data.message,
-                        style = MaterialTheme.typography.body2
+                        text = data.visuals.message,
+                        style = MaterialTheme.typography.bodyMedium,
                     )
                 },
                 action = {
-                    data.actionLabel?.let {
+                    data.visuals.actionLabel?.let {
                         TextButton(onClick = onDismiss) {
                             Text(
                                 text = stringResource(id = R.string.dismiss),
-                                color = MaterialTheme.colors.snackbarAction
+                                //color = MaterialTheme.colorScheme.snackbarAction
                             )
                         }
                     }
@@ -193,18 +193,11 @@ fun ErrorSnackbar(
     )
 }
 
-@Preview(name = "Sign in light theme")
+@Preview(name = "Sign in light theme", uiMode = UI_MODE_NIGHT_NO)
+@Preview(name = "Sign in dark theme", uiMode = UI_MODE_NIGHT_YES)
 @Composable
 fun SignInPreview() {
-    JetsurveyThemeOld {
+    JetsurveyTheme {
         SignIn {}
     }
-}
-
-@Preview(name = "Sign in dark theme")
-@Composable
-fun SignInPreviewDark() {
-    JetsurveyThemeOld(darkTheme = true) {
-        SignIn {}
-    }
-}
+}

Jetsurvey/app/src/main/java/com/example/compose/jetsurvey/signinsignup/SignInSignUp.kt

@@ -32,21 +32,19 @@ import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.foundation.text.KeyboardActions
 import androidx.compose.foundation.text.KeyboardOptions
 import androidx.compose.material.ContentAlpha
-import androidx.compose.material.Icon
-import androidx.compose.material.IconButton
 import androidx.compose.material.LocalContentAlpha
-import androidx.compose.material.LocalTextStyle
-import androidx.compose.material.MaterialTheme
-import androidx.compose.material.OutlinedButton
-import androidx.compose.material.OutlinedTextField
-import androidx.compose.material.Surface
-import androidx.compose.material.Text
-import androidx.compose.material.TextField
-import androidx.compose.material.TopAppBar
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.ChevronLeft
 import androidx.compose.material.icons.filled.Visibility
 import androidx.compose.material.icons.filled.VisibilityOff
+import androidx.compose.material3.ExperimentalMaterial3Api
+import androidx.compose.material3.Icon
+import androidx.compose.material3.IconButton
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.OutlinedButton
+import androidx.compose.material3.OutlinedTextField
+import androidx.compose.material3.SmallTopAppBar
+import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.CompositionLocalProvider
 import androidx.compose.runtime.mutableStateOf
@@ -64,13 +62,14 @@ import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import com.example.compose.jetsurvey.R
+import com.example.compose.jetsurvey.theme.JetsurveyTheme
 
 @Composable
 fun SignInSignUpScreen(
     onSignedInAsGuest: () -> Unit,
     modifier: Modifier = Modifier,
     contentPadding: PaddingValues = PaddingValues(),
-    content: @Composable() () -> Unit
+    content: @Composable () -> Unit
 ) {
     LazyColumn(
         modifier = modifier,
@@ -96,9 +95,10 @@ fun SignInSignUpScreen(
     }
 }
 
+@OptIn(ExperimentalMaterial3Api::class) // SmallTopAppBar is experimental in m3
 @Composable
 fun SignInSignUpTopAppBar(topAppBarText: String, onBackPressed: () -> Unit) {
-    TopAppBar(
+    SmallTopAppBar(
         title = {
             Text(
                 text = topAppBarText,
@@ -120,11 +120,10 @@ fun SignInSignUpTopAppBar(topAppBarText: String, onBackPressed: () -> Unit) {
         actions = {
             Spacer(modifier = Modifier.width(68.dp))
         },
-        backgroundColor = MaterialTheme.colors.surface,
-        elevation = 0.dp
     )
 }
 
+@OptIn(ExperimentalMaterial3Api::class) // OutlinedTextField is experimental in m3
 @Composable
 fun Email(
     emailState: TextFieldState = remember { EmailState() },
@@ -140,7 +139,7 @@ fun Email(
             CompositionLocalProvider(LocalContentAlpha provides ContentAlpha.medium) {
                 Text(
                     text = stringResource(id = R.string.email),
-                    style = MaterialTheme.typography.body2
+                    style = MaterialTheme.typography.bodyMedium
                 )
             }
         },
@@ -152,7 +151,7 @@ fun Email(
                     emailState.enableShowErrors()
                 }
             },
-        textStyle = MaterialTheme.typography.body2,
+        textStyle = MaterialTheme.typography.bodyMedium,
         isError = emailState.showErrors(),
         keyboardOptions = KeyboardOptions.Default.copy(
             imeAction = imeAction,
@@ -168,6 +167,7 @@ fun Email(
     emailState.getError()?.let { error -> TextFieldError(textError = error) }
 }
 
+@OptIn(ExperimentalMaterial3Api::class) // OutlinedTextField is experimental in m3
 @Composable
 fun Password(
     label: String,
@@ -191,12 +191,12 @@ fun Password(
                     passwordState.enableShowErrors()
                 }
             },
-        textStyle = MaterialTheme.typography.body2,
+        textStyle = MaterialTheme.typography.bodyMedium,
         label = {
             CompositionLocalProvider(LocalContentAlpha provides ContentAlpha.medium) {
                 Text(
                     text = label,
-                    style = MaterialTheme.typography.body2
+                    style = MaterialTheme.typography.bodyMedium
                 )
             }
         },
@@ -247,7 +247,7 @@ fun TextFieldError(textError: String) {
         Text(
             text = textError,
             modifier = Modifier.fillMaxWidth(),
-            style = LocalTextStyle.current.copy(color = MaterialTheme.colors.error)
+            color = MaterialTheme.colorScheme.error
         )
     }
 }
@@ -261,14 +261,12 @@ fun OrSignInAsGuest(
         modifier = modifier,
         horizontalAlignment = Alignment.CenterHorizontally
     ) {
-        Surface {
-            CompositionLocalProvider(LocalContentAlpha provides ContentAlpha.medium) {
-                Text(
-                    text = stringResource(id = R.string.or),
-                    style = MaterialTheme.typography.subtitle2,
-                    modifier = Modifier.paddingFromBaseline(top = 25.dp)
-                )
-            }
+        CompositionLocalProvider(LocalContentAlpha provides ContentAlpha.medium) {
+            Text(
+                text = stringResource(id = R.string.or),
+                style = MaterialTheme.typography.titleSmall,
+                modifier = Modifier.paddingFromBaseline(top = 25.dp)
+            )
         }
         OutlinedButton(
             onClick = onSignedInAsGuest,
@@ -284,8 +282,10 @@ fun OrSignInAsGuest(
 @Preview
 @Composable
 fun SignInSignUpScreenPreview() {
-    SignInSignUpScreen(
-        onSignedInAsGuest = {},
-        content = {}
-    )
+    JetsurveyTheme {
+        SignInSignUpScreen(
+            onSignedInAsGuest = {},
+            content = {}
+        )
+    }
 }

Jetsurvey/app/src/main/java/com/example/compose/jetsurvey/signinsignup/SignUpFragment.kt

@@ -26,7 +26,7 @@ import androidx.fragment.app.viewModels
 import com.example.compose.jetsurvey.R
 import com.example.compose.jetsurvey.Screen
 import com.example.compose.jetsurvey.navigate
-import com.example.compose.jetsurvey.theme.JetsurveyThemeOld
+import com.example.compose.jetsurvey.theme.JetsurveyTheme
 
 /**
  * Fragment containing the sign up UI
@@ -55,7 +55,7 @@ class SignUpFragment : Fragment() {
                 ViewGroup.LayoutParams.MATCH_PARENT
             )
             setContent {
-                JetsurveyThemeOld {
+                JetsurveyTheme {
                     SignUp(
                         onNavigationEvent = { event ->
                             when (event) {

Jetsurvey/app/src/main/java/com/example/compose/jetsurvey/signinsignup/SignUpScreen.kt

@@ -20,12 +20,13 @@ import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
-import androidx.compose.material.Button
 import androidx.compose.material.ContentAlpha
 import androidx.compose.material.LocalContentAlpha
-import androidx.compose.material.MaterialTheme
-import androidx.compose.material.Scaffold
-import androidx.compose.material.Text
+import androidx.compose.material3.Button
+import androidx.compose.material3.ExperimentalMaterial3Api
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.Scaffold
+import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.CompositionLocalProvider
 import androidx.compose.runtime.remember
@@ -37,7 +38,7 @@ import androidx.compose.ui.text.input.ImeAction
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import com.example.compose.jetsurvey.R
-import com.example.compose.jetsurvey.theme.JetsurveyThemeOld
+import com.example.compose.jetsurvey.theme.JetsurveyTheme
 import com.example.compose.jetsurvey.util.supportWideScreen
 
 sealed class SignUpEvent {
@@ -47,6 +48,7 @@ sealed class SignUpEvent {
     object NavigateBack : SignUpEvent()
 }
 
+@OptIn(ExperimentalMaterial3Api::class) // Scaffold is experimental in m3
 @Composable
 fun SignUp(onNavigationEvent: (SignUpEvent) -> Unit) {
     Scaffold(
@@ -107,7 +109,7 @@ fun SignUpContent(
         CompositionLocalProvider(LocalContentAlpha provides ContentAlpha.medium) {
             Text(
                 text = stringResource(id = R.string.terms_and_conditions),
-                style = MaterialTheme.typography.caption
+                style = MaterialTheme.typography.bodySmall
             )
         }
 
@@ -126,7 +128,7 @@ fun SignUpContent(
 @Preview(widthDp = 1024)
 @Composable
 fun SignUpPreview() {
-    JetsurveyThemeOld {
+    JetsurveyTheme {
         SignUp {}
     }
 }

Jetsurvey/app/src/main/java/com/example/compose/jetsurvey/signinsignup/WelcomeScreen.kt

@@ -16,7 +16,8 @@
 
 package com.example.compose.jetsurvey.signinsignup
 
-import android.content.res.Configuration
+import android.content.res.Configuration.UI_MODE_NIGHT_NO
+import android.content.res.Configuration.UI_MODE_NIGHT_YES
 import androidx.compose.animation.AnimatedVisibility
 import androidx.compose.animation.animateContentSize
 import androidx.compose.foundation.Image
@@ -182,8 +183,8 @@ private fun SignInCreateAccount(
     }
 }
 
-@Preview(name = "Welcome light theme", uiMode = Configuration.UI_MODE_NIGHT_YES)
-@Preview(name = "Welcome dark theme", uiMode = Configuration.UI_MODE_NIGHT_NO)
+@Preview(name = "Welcome light theme", uiMode = UI_MODE_NIGHT_YES)
+@Preview(name = "Welcome dark theme", uiMode = UI_MODE_NIGHT_NO)
 @Composable
 fun WelcomeScreenPreview() {
     JetsurveyTheme {

Jetsurvey/app/src/main/java/com/example/compose/jetsurvey/survey/SurveyFragment.kt

@@ -33,7 +33,7 @@ import androidx.compose.ui.platform.ComposeView
 import androidx.fragment.app.Fragment
 import androidx.fragment.app.viewModels
 import com.example.compose.jetsurvey.R
-import com.example.compose.jetsurvey.theme.JetsurveyThemeOld
+import com.example.compose.jetsurvey.theme.JetsurveyTheme
 import com.google.android.material.datepicker.MaterialDatePicker
 
 class SurveyFragment : Fragment() {
@@ -63,8 +63,8 @@ class SurveyFragment : Fragment() {
                 ViewGroup.LayoutParams.MATCH_PARENT
             )
             setContent {
-                JetsurveyThemeOld {
-                    val state = viewModel.uiState.observeAsState().value ?: return@JetsurveyThemeOld
+                JetsurveyTheme {
+                    val state = viewModel.uiState.observeAsState().value ?: return@JetsurveyTheme
                     AnimatedContent(
                         targetState = state,
                         transitionSpec = {