Upgrade compose-material3 to 1.2.0-alpha05 version (#1011)

Co-authored-by: ElementBot <benoitm+elementbot@element.io>

Also upgrade compileSdk to 34.

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/ClickableLinkText.kt

@@ -109,7 +109,7 @@ private fun ContentToPreview() {
         linkAnnotationTag = "",
         onClick = {},
         onLongClick = {},
-        interactionSource = MutableInteractionSource(),
+        interactionSource = remember { MutableInteractionSource() },
     )
 }
 

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/avatar/Avatar.kt

@@ -31,6 +31,7 @@ import androidx.compose.ui.layout.ContentScale
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.tooling.preview.PreviewParameter
 import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
 import coil.compose.AsyncImage
 import io.element.android.libraries.designsystem.preview.ElementThemedPreview
 import io.element.android.libraries.designsystem.preview.PreviewGroup
@@ -91,10 +92,14 @@ private fun InitialsAvatar(
     Box(
         modifier.background(color = avatarColor),
     ) {
+        val fontSize = avatarData.size.dp.toSp() / 2
+        val originalFont = ElementTheme.typography.fontBodyMdRegular
+        val ratio = fontSize.value / originalFont.fontSize.value
+        val lineHeight = originalFont.lineHeight * ratio
         Text(
             modifier = Modifier.align(Alignment.Center),
             text = avatarData.initial,
-            style = ElementTheme.typography.fontBodyMdRegular.copy(fontSize = avatarData.size.dp.toSp() / 2),
+            style = originalFont.copy(fontSize = fontSize, lineHeight = lineHeight, letterSpacing = 0.sp),
             color = Color.White,
         )
     }

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/button/MainActionButton.kt

@@ -30,6 +30,7 @@ import androidx.compose.material.ripple.rememberRipple
 import androidx.compose.material3.LocalContentColor
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.remember
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.vector.ImageVector
@@ -51,7 +52,7 @@ fun MainActionButton(
     contentDescription: String = title,
 ) {
     val ripple = rememberRipple(bounded = false)
-    val interactionSource = MutableInteractionSource()
+    val interactionSource = remember { MutableInteractionSource() }
     Column(
         modifier.clickable(
             enabled = enabled,

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/preferences/PreferenceDivider.kt

@@ -21,14 +21,14 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.tooling.preview.Preview
 import io.element.android.libraries.designsystem.preview.ElementThemedPreview
 import io.element.android.libraries.designsystem.preview.PreviewGroup
-import io.element.android.libraries.designsystem.theme.components.Divider
+import io.element.android.libraries.designsystem.theme.components.HorizontalDivider
 import io.element.android.libraries.theme.ElementTheme
 
 @Composable
 fun PreferenceDivider(
     modifier: Modifier = Modifier,
 ) {
-    Divider(
+    HorizontalDivider(
         modifier = modifier,
         color = ElementTheme.colors.borderDisabled,
     )

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/preview/SheetState.kt

@@ -19,9 +19,13 @@ package io.element.android.libraries.designsystem.preview
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.SheetState
 import androidx.compose.material3.SheetValue
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.platform.LocalDensity
 
 @OptIn(ExperimentalMaterial3Api::class)
-val sheetStateForPreview = SheetState(
+@Composable
+fun sheetStateForPreview() = SheetState(
     skipPartiallyExpanded = true,
     initialValue = SheetValue.Expanded,
+    density = LocalDensity.current,
 )

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/theme/components/DropdownMenuItem.kt

@@ -90,7 +90,7 @@ private fun ContentToPreview() {
             onClick = {},
             trailingIcon = { Icon(Icons.Default.ArrowRight, contentDescription = null) },
         )
-        Divider()
+        HorizontalDivider()
         DropdownMenuItem(
             text = { Text(text = "Item") },
             onClick = {},
@@ -109,7 +109,7 @@ private fun ContentToPreview() {
             leadingIcon = { Icon(Icons.Default.BugReport, contentDescription = null) },
             trailingIcon = { Icon(Icons.Default.ArrowRight, contentDescription = null) },
         )
-        Divider()
+        HorizontalDivider()
         DropdownMenuItem(
             text = { Text(text = "Multiline\nItem") },
             onClick = {},

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/theme/components/HorizontalDivider.kt

@@ -30,12 +30,12 @@ import io.element.android.libraries.designsystem.preview.ElementThemedPreview
 import io.element.android.libraries.designsystem.preview.PreviewGroup
 
 @Composable
-fun Divider(
+fun HorizontalDivider(
     modifier: Modifier = Modifier,
     thickness: Dp = ElementDividerDefaults.thickness,
     color: Color = DividerDefaults.color,
 ) {
-    androidx.compose.material3.Divider(
+    androidx.compose.material3.HorizontalDivider(
         modifier = modifier,
         thickness = thickness,
         color = color,
@@ -48,7 +48,7 @@ object ElementDividerDefaults {
 
 @Preview(group = PreviewGroup.Dividers)
 @Composable
-internal fun DividerPreview() = ElementThemedPreview {
+internal fun HorizontalDividerPreview() = ElementThemedPreview {
     Box(Modifier.padding(vertical = 10.dp), contentAlignment = Alignment.Center) {
         ContentToPreview()
     }
@@ -56,5 +56,5 @@ internal fun DividerPreview() = ElementThemedPreview {
 
 @Composable
 private fun ContentToPreview() {
-    Divider()
+    HorizontalDivider()
 }

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/theme/components/ModalBottomSheet.kt

@@ -100,7 +100,7 @@ private fun ContentToPreview() {
     ) {
         ModalBottomSheet(
             onDismissRequest = {},
-            sheetState = sheetStateForPreview,
+            sheetState = sheetStateForPreview(),
         ) {
             Text(
                 text = "Sheet Content",

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/theme/components/ModalBottomSheetLayout.kt

@@ -14,6 +14,9 @@
  * limitations under the License.
  */
 
+// This is actually expected, as we should remove this component soon and use ModalBottomSheet instead
+@file:Suppress("UsingMaterialAndMaterial3Libraries")
+
 package io.element.android.libraries.designsystem.theme.components
 
 import androidx.compose.foundation.background
@@ -40,6 +43,7 @@ import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.Shape
+import androidx.compose.ui.platform.LocalDensity
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.Dp
 import androidx.compose.ui.unit.dp
@@ -111,7 +115,7 @@ private fun ContentToPreview() {
     ModalBottomSheetLayout(
         modifier = Modifier.height(140.dp),
         displayHandle = true,
-        sheetState = ModalBottomSheetState(ModalBottomSheetValue.Expanded),
+        sheetState = ModalBottomSheetState(ModalBottomSheetValue.Expanded, density = LocalDensity.current),
         sheetContent = {
             Text(text = "Sheet Content", modifier = Modifier
                 .padding(start = 16.dp, end = 16.dp, bottom = 20.dp)

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/theme/components/SearchBar.kt

@@ -62,7 +62,7 @@ fun <T> SearchBar(
     showBackButton: Boolean = true,
     resultState: SearchBarResultState<T> = SearchBarResultState.NotSearching(),
     shape: Shape = SearchBarDefaults.inputFieldShape,
-    tonalElevation: Dp = SearchBarDefaults.Elevation,
+    tonalElevation: Dp = SearchBarDefaults.TonalElevation,
     windowInsets: WindowInsets = SearchBarDefaults.windowInsets,
     interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
     inactiveColors: SearchBarColors = ElementSearchBarDefaults.inactiveColors(),