Rename component. No need for `Element` prefix

app/src/main/kotlin/io/element/android/x/component/ShowkaseButton.kt

@@ -23,7 +23,7 @@ import androidx.compose.material.icons.filled.Close
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.unit.dp
-import io.element.android.libraries.designsystem.theme.components.ElementButton
+import io.element.android.libraries.designsystem.theme.components.Button
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.IconButton
 import io.element.android.libraries.designsystem.theme.components.Text
@@ -36,7 +36,7 @@ internal fun ShowkaseButton(
     modifier: Modifier = Modifier,
 ) {
     if (isVisible) {
-        ElementButton(
+        Button(
             modifier = modifier
                 .padding(top = 32.dp, start = 16.dp),
             onClick = onClick

app/src/main/kotlin/io/element/android/x/node/RootFlowNode.kt

@@ -35,7 +35,7 @@ import com.bumble.appyx.navmodel.backstack.operation.push
 import io.element.android.features.rageshake.bugreport.BugReportNode
 import io.element.android.libraries.architecture.animation.rememberDefaultTransitionHandler
 import io.element.android.libraries.architecture.createNode
-import io.element.android.libraries.designsystem.theme.components.ElementCircularProgressIndicator
+import io.element.android.libraries.designsystem.theme.components.CircularProgressIndicator
 import io.element.android.libraries.di.DaggerComponentOwner
 import io.element.android.libraries.matrix.auth.MatrixAuthenticationService
 import io.element.android.libraries.matrix.core.SessionId
@@ -182,7 +182,7 @@ class RootFlowNode(
 
     private fun splashNode(buildContext: BuildContext) = node(buildContext) {
         Box(modifier = it.fillMaxSize(), contentAlignment = Alignment.Center) {
-            ElementCircularProgressIndicator()
+            CircularProgressIndicator()
         }
     }
 }

features/login/src/main/kotlin/io/element/android/features/login/changeserver/ChangeServerView.kt

@@ -51,9 +51,9 @@ import io.element.android.libraries.designsystem.components.form.textFieldState
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
 import io.element.android.libraries.designsystem.theme.ElementTheme
-import io.element.android.libraries.designsystem.theme.components.ElementButton
-import io.element.android.libraries.designsystem.theme.components.ElementCircularProgressIndicator
-import io.element.android.libraries.designsystem.theme.components.ElementOutlinedTextField
+import io.element.android.libraries.designsystem.theme.components.Button
+import io.element.android.libraries.designsystem.theme.components.CircularProgressIndicator
+import io.element.android.libraries.designsystem.theme.components.OutlinedTextField
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.testtags.TestTags
 import io.element.android.libraries.testtags.testTag
@@ -122,7 +122,7 @@ fun ChangeServerView(
                 color = ElementTheme.colors.secondary,
             )
             var homeserverFieldState by textFieldState(stateValue = state.homeserver)
-            ElementOutlinedTextField(
+            OutlinedTextField(
                 value = homeserverFieldState,
                 modifier = Modifier
                     .fillMaxWidth()
@@ -155,7 +155,7 @@ fun ChangeServerView(
                     modifier = Modifier.padding(start = 16.dp)
                 )
             }
-            ElementButton(
+            Button(
                 onClick = { eventSink(ChangeServerEvents.Submit) },
                 enabled = state.submitEnabled,
                 modifier = Modifier
@@ -170,7 +170,7 @@ fun ChangeServerView(
             }
         }
         if (state.changeServerAction is Async.Loading) {
-            ElementCircularProgressIndicator(
+            CircularProgressIndicator(
                 modifier = Modifier.align(Alignment.Center)
             )
         }

features/login/src/main/kotlin/io/element/android/features/login/root/LoginRootScreen.kt

@@ -52,11 +52,11 @@ import io.element.android.libraries.designsystem.components.form.textFieldState
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
 import io.element.android.libraries.designsystem.theme.ElementTheme
-import io.element.android.libraries.designsystem.theme.components.ElementButton
-import io.element.android.libraries.designsystem.theme.components.ElementCircularProgressIndicator
-import io.element.android.libraries.designsystem.theme.components.ElementOutlinedTextField
+import io.element.android.libraries.designsystem.theme.components.Button
+import io.element.android.libraries.designsystem.theme.components.CircularProgressIndicator
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.IconButton
+import io.element.android.libraries.designsystem.theme.components.OutlinedTextField
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.matrix.core.SessionId
 import io.element.android.libraries.testtags.TestTags
@@ -107,7 +107,7 @@ fun LoginRootScreen(
                 Box(
                     modifier = Modifier.fillMaxWidth()
                 ) {
-                    ElementOutlinedTextField(
+                    OutlinedTextField(
                         value = state.homeserver,
                         modifier = Modifier.fillMaxWidth(),
                         onValueChange = { /* no op */ },
@@ -119,7 +119,7 @@ fun LoginRootScreen(
                             keyboardType = KeyboardType.Uri,
                         ),
                     )
-                    ElementButton(
+                    Button(
                         onClick = onChangeServer,
                         modifier = Modifier
                             .align(Alignment.CenterEnd)
@@ -130,7 +130,7 @@ fun LoginRootScreen(
                         }
                     )
                 }
-                ElementOutlinedTextField(
+                OutlinedTextField(
                     value = loginFieldState,
                     modifier = Modifier
                         .fillMaxWidth()
@@ -153,7 +153,7 @@ fun LoginRootScreen(
                     // Ensure password is hidden when user submits the form
                     passwordVisible = false
                 }
-                ElementOutlinedTextField(
+                OutlinedTextField(
                     value = passwordFieldState,
                     modifier = Modifier
                         .fillMaxWidth()
@@ -196,7 +196,7 @@ fun LoginRootScreen(
                 }
             }
             // Submit
-            ElementButton(
+            Button(
                 onClick = { eventSink(LoginRootEvents.Submit) },
                 enabled = state.submitEnabled,
                 modifier = Modifier
@@ -212,7 +212,7 @@ fun LoginRootScreen(
             }
         }
         if (state.loggedInState is LoggedInState.LoggingIn) {
-            ElementCircularProgressIndicator(
+            CircularProgressIndicator(
                 modifier = Modifier.align(Alignment.Center)
             )
         }

features/messages/src/main/kotlin/io/element/android/features/messages/MessagesView.kt

@@ -59,11 +59,11 @@ import io.element.android.features.messages.timeline.TimelineView
 import io.element.android.features.messages.timeline.model.TimelineItem
 import io.element.android.libraries.designsystem.components.avatar.Avatar
 import io.element.android.libraries.designsystem.components.avatar.AvatarData
-import io.element.android.libraries.designsystem.theme.components.ElementScaffold
-import io.element.android.libraries.designsystem.theme.components.ElementTopAppBar
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.IconButton
+import io.element.android.libraries.designsystem.theme.components.Scaffold
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.designsystem.theme.components.TopAppBar
 import io.element.android.libraries.designsystem.utils.LogCompositions
 import kotlinx.coroutines.launch
 import timber.log.Timber
@@ -101,7 +101,7 @@ fun MessagesView(
         state.eventSink(MessagesEvents.HandleAction(action, messageEvent))
     }
 
-    ElementScaffold(
+    Scaffold(
         modifier = modifier,
         contentWindowInsets = WindowInsets.statusBars,
         topBar = {
@@ -172,7 +172,7 @@ fun MessagesViewTopBar(
     modifier: Modifier = Modifier,
     onBackPressed: () -> Unit = {},
 ) {
-    ElementTopAppBar(
+    TopAppBar(
         modifier = modifier,
         navigationIcon = {
             IconButton(onClick = onBackPressed) {

features/messages/src/main/kotlin/io/element/android/features/messages/actionlist/ActionListView.kt

@@ -43,7 +43,7 @@ import io.element.android.features.messages.actionlist.model.TimelineItemAction
 import io.element.android.features.messages.timeline.model.TimelineItem
 import io.element.android.libraries.designsystem.components.VectorIcon
 import io.element.android.libraries.designsystem.theme.ElementTheme
-import io.element.android.libraries.designsystem.theme.components.ElementModalBottomSheetLayout
+import io.element.android.libraries.designsystem.theme.components.ModalBottomSheetLayout
 import kotlinx.coroutines.flow.filter
 import kotlinx.coroutines.launch
 
@@ -73,7 +73,7 @@ fun ActionListView(
         }
     }
 
-    ElementModalBottomSheetLayout(
+    ModalBottomSheetLayout(
         modifier = modifier,
         sheetState = modalBottomSheetState,
         sheetContent = {

features/messages/src/main/kotlin/io/element/android/features/messages/timeline/TimelineView.kt

@@ -77,7 +77,7 @@ import io.element.android.libraries.designsystem.components.avatar.AvatarData
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
 import io.element.android.libraries.designsystem.theme.ElementTheme
-import io.element.android.libraries.designsystem.theme.components.ElementCircularProgressIndicator
+import io.element.android.libraries.designsystem.theme.components.CircularProgressIndicator
 import io.element.android.libraries.designsystem.theme.components.FloatingActionButton
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.Text
@@ -345,7 +345,7 @@ internal fun TimelineLoadingMoreIndicator() {
             .padding(8.dp),
         contentAlignment = Alignment.Center,
     ) {
-        ElementCircularProgressIndicator(
+        CircularProgressIndicator(
             strokeWidth = 2.dp,
             color = ElementTheme.colors.primary
         )

features/messages/src/main/kotlin/io/element/android/features/messages/timeline/components/MessageEventBubble.kt

@@ -30,7 +30,7 @@ import androidx.compose.ui.graphics.Shape
 import androidx.compose.ui.unit.dp
 import io.element.android.features.messages.timeline.model.MessagesItemGroupPosition
 import io.element.android.libraries.designsystem.theme.ElementTheme
-import io.element.android.libraries.designsystem.theme.components.ElementSurface
+import io.element.android.libraries.designsystem.theme.components.Surface
 
 private val BUBBLE_RADIUS = 16.dp
 
@@ -91,7 +91,7 @@ fun MessageEventBubble(
         }
     }
     val bubbleShape = bubbleShape()
-    ElementSurface(
+    Surface(
         modifier = modifier
             .widthIn(min = 80.dp)
             .offsetForItem()

features/messages/src/main/kotlin/io/element/android/features/messages/timeline/components/TimelineItemReactionsView.kt

@@ -32,7 +32,7 @@ import com.google.accompanist.flowlayout.FlowRow
 import io.element.android.features.messages.timeline.model.AggregatedReaction
 import io.element.android.features.messages.timeline.model.TimelineItemReactions
 import io.element.android.libraries.designsystem.theme.ElementTheme
-import io.element.android.libraries.designsystem.theme.components.ElementSurface
+import io.element.android.libraries.designsystem.theme.components.Surface
 import io.element.android.libraries.designsystem.theme.components.Text
 
 @Composable
@@ -54,7 +54,7 @@ fun TimelineItemReactionsView(
 
 @Composable
 fun MessagesReactionButton(reaction: AggregatedReaction, modifier: Modifier = Modifier) {
-    ElementSurface(
+    Surface(
         modifier = modifier,
         color = ElementTheme.colors.surfaceVariant,
         border = BorderStroke(2.dp, ElementTheme.colors.background),

features/messages/src/main/kotlin/io/element/android/features/messages/timeline/components/html/HtmlDocument.kt

@@ -47,7 +47,7 @@ import io.element.android.libraries.designsystem.LinkColor
 import io.element.android.libraries.designsystem.components.ClickableLinkText
 import io.element.android.libraries.designsystem.theme.ElementColors
 import io.element.android.libraries.designsystem.theme.ElementTheme
-import io.element.android.libraries.designsystem.theme.components.ElementSurface
+import io.element.android.libraries.designsystem.theme.components.Surface
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.matrix.permalink.PermalinkData
 import io.element.android.libraries.matrix.permalink.PermalinkParser
@@ -340,7 +340,7 @@ private fun HtmlMxReply(
 ) {
     val blockquote = mxReply.childNodes().firstOrNull() ?: return
     val shape = RoundedCornerShape(12.dp)
-    ElementSurface(
+    Surface(
         modifier = modifier
             .padding(bottom = 4.dp)
             .offset(x = -(8.dp)),

features/onboarding/src/main/kotlin/io/element/android/features/onboarding/OnBoardingScreen.kt

@@ -43,7 +43,7 @@ import com.google.accompanist.pager.ExperimentalPagerApi
 import com.google.accompanist.pager.HorizontalPager
 import com.google.accompanist.pager.HorizontalPagerIndicator
 import com.google.accompanist.pager.rememberPagerState
-import io.element.android.libraries.designsystem.theme.components.ElementButton
+import io.element.android.libraries.designsystem.theme.components.Button
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.testtags.TestTags
 import io.element.android.libraries.testtags.testTag
@@ -100,7 +100,7 @@ fun OnBoardingScreen(
                     .align(CenterHorizontally)
                     .padding(16.dp),
             )
-            ElementButton(
+            Button(
                 onClick = {
                     onSignIn()
                 },

features/rageshake/src/main/kotlin/io/element/android/features/rageshake/bugreport/BugReportView.kt

@@ -50,9 +50,9 @@ import io.element.android.libraries.designsystem.components.form.textFieldState
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
 import io.element.android.libraries.designsystem.theme.ElementTheme
-import io.element.android.libraries.designsystem.theme.components.ElementButton
-import io.element.android.libraries.designsystem.theme.components.ElementCircularProgressIndicator
-import io.element.android.libraries.designsystem.theme.components.ElementOutlinedTextField
+import io.element.android.libraries.designsystem.theme.components.Button
+import io.element.android.libraries.designsystem.theme.components.CircularProgressIndicator
+import io.element.android.libraries.designsystem.theme.components.OutlinedTextField
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.designsystem.utils.LogCompositions
 import io.element.android.libraries.ui.strings.R as StringR
@@ -114,7 +114,7 @@ fun BugReportView(
             Column(
                 // modifier = Modifier.weight(1f),
             ) {
-                ElementOutlinedTextField(
+                OutlinedTextField(
                     value = descriptionFieldState,
                     modifier = Modifier
                         .fillMaxWidth()
@@ -182,7 +182,7 @@ fun BugReportView(
                 }
             }
             // Submit
-            ElementButton(
+            Button(
                 onClick = { eventSink(BugReportEvents.SendBugReport) },
                 enabled = state.submitEnabled,
                 modifier = Modifier
@@ -194,7 +194,7 @@ fun BugReportView(
         }
         when (state.sending) {
             is Async.Loading -> {
-                ElementCircularProgressIndicator(
+                CircularProgressIndicator(
                     progress = state.sendingProgress,
                     modifier = Modifier.align(Alignment.Center)
                 )

features/roomlist/src/main/kotlin/io/element/android/features/roomlist/RoomListView.kt

@@ -42,7 +42,7 @@ import io.element.android.features.roomlist.model.stubbedRoomSummaries
 import io.element.android.libraries.designsystem.components.avatar.AvatarData
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
-import io.element.android.libraries.designsystem.theme.components.ElementScaffold
+import io.element.android.libraries.designsystem.theme.components.Scaffold
 import io.element.android.libraries.designsystem.utils.LogCompositions
 import io.element.android.libraries.matrix.core.RoomId
 import io.element.android.libraries.matrix.core.UserId
@@ -118,7 +118,7 @@ fun RoomListView(
         }
     }
 
-    ElementScaffold(
+    Scaffold(
         modifier = modifier.nestedScroll(scrollBehavior.nestedScrollConnection),
         topBar = {
             RoomListTopBar(

features/roomlist/src/main/kotlin/io/element/android/features/roomlist/components/RoomListTopBar.kt

@@ -38,7 +38,6 @@ import androidx.compose.runtime.setValue
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.focus.FocusRequester
 import androidx.compose.ui.focus.focusRequester
-import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.input.nestedscroll.nestedScroll
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.TextStyle
@@ -47,12 +46,12 @@ import androidx.compose.ui.unit.sp
 import io.element.android.libraries.designsystem.components.avatar.Avatar
 import io.element.android.libraries.designsystem.components.form.textFieldState
 import io.element.android.libraries.designsystem.theme.ElementTheme
-import io.element.android.libraries.designsystem.theme.components.ElementMediumAppBar
-import io.element.android.libraries.designsystem.theme.components.ElementTopAppBar
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.IconButton
+import io.element.android.libraries.designsystem.theme.components.MediumTopAppBar
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.designsystem.theme.components.TextField
+import io.element.android.libraries.designsystem.theme.components.TopAppBar
 import io.element.android.libraries.designsystem.utils.LogCompositions
 import io.element.android.libraries.matrix.ui.model.MatrixUser
 import io.element.android.libraries.ui.strings.R as StringR
@@ -112,7 +111,7 @@ fun SearchRoomListTopBar(
 ) {
     var filterState by textFieldState(stateValue = text)
     val focusRequester = remember { FocusRequester() }
-    ElementTopAppBar(
+    TopAppBar(
         modifier = modifier
             .nestedScroll(scrollBehavior.nestedScrollConnection),
         title = {
@@ -179,7 +178,7 @@ private fun DefaultRoomListTopBar(
     scrollBehavior: TopAppBarScrollBehavior,
     modifier: Modifier = Modifier,
 ) {
-    ElementMediumAppBar(
+    MediumTopAppBar(
         modifier = modifier
             .nestedScroll(scrollBehavior.nestedScrollConnection),
         title = {

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

@@ -25,7 +25,7 @@ import androidx.compose.ui.tooling.preview.Preview
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
 import io.element.android.libraries.designsystem.theme.ElementTheme
-import io.element.android.libraries.designsystem.theme.components.ElementCheckbox
+import io.element.android.libraries.designsystem.theme.components.Checkbox
 import io.element.android.libraries.designsystem.theme.components.Text
 
 @Composable
@@ -40,7 +40,7 @@ fun LabelledCheckbox(
         modifier = modifier.fillMaxWidth(),
         verticalAlignment = Alignment.CenterVertically
     ) {
-        ElementCheckbox(
+        Checkbox(
             checked = checked,
             onCheckedChange = onCheckedChange,
             enabled = enabled,

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

@@ -32,7 +32,7 @@ import androidx.compose.ui.window.DialogProperties
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
 import io.element.android.libraries.designsystem.theme.ElementTheme
-import io.element.android.libraries.designsystem.theme.components.ElementCircularProgressIndicator
+import io.element.android.libraries.designsystem.theme.components.CircularProgressIndicator
 import io.element.android.libraries.designsystem.theme.components.Text
 
 @Composable
@@ -55,7 +55,7 @@ fun ProgressDialog(
                 )
         ) {
             Column(horizontalAlignment = Alignment.CenterHorizontally) {
-                ElementCircularProgressIndicator(
+                CircularProgressIndicator(
                     modifier = Modifier.padding(16.dp),
                     color = ElementTheme.colors.onSurfaceVariant
                 )

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

@@ -34,7 +34,7 @@ import androidx.compose.ui.unit.dp
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
 import io.element.android.libraries.designsystem.theme.ElementTheme
-import io.element.android.libraries.designsystem.theme.components.ElementButton
+import io.element.android.libraries.designsystem.theme.components.Button
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.ui.strings.R as StringR
 
@@ -72,7 +72,7 @@ fun ConfirmationDialog(
                 horizontalArrangement = Arrangement.Center
             ) {
                 Column {
-                    ElementButton(
+                    Button(
                         modifier = Modifier.fillMaxWidth(),
                         onClick = {
                             onCancelClicked()
@@ -80,7 +80,7 @@ fun ConfirmationDialog(
                         Text(cancelText)
                     }
                     if (thirdButtonText != null) {
-                        ElementButton(
+                        Button(
                             modifier = Modifier.fillMaxWidth(),
                             onClick = {
                                 onThirdButtonClicked()
@@ -96,7 +96,7 @@ fun ConfirmationDialog(
                 modifier = Modifier.padding(all = 8.dp),
                 horizontalArrangement = Arrangement.Center
             ) {
-                ElementButton(
+                Button(
                     modifier = Modifier.fillMaxWidth(),
                     onClick = {
                         onSubmitClicked()

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

@@ -33,7 +33,7 @@ import androidx.compose.ui.unit.dp
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
 import io.element.android.libraries.designsystem.theme.ElementTheme
-import io.element.android.libraries.designsystem.theme.components.ElementButton
+import io.element.android.libraries.designsystem.theme.components.Button
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.ui.strings.R as StringR
 
@@ -65,7 +65,7 @@ fun ErrorDialog(
                 modifier = Modifier.padding(all = 8.dp),
                 horizontalArrangement = Arrangement.Center
             ) {
-                ElementButton(
+                Button(
                     modifier = Modifier.fillMaxWidth(),
                     onClick = {
                         onDismiss()

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

@@ -41,11 +41,11 @@ import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.sp
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
-import io.element.android.libraries.designsystem.theme.components.ElementScaffold
-import io.element.android.libraries.designsystem.theme.components.ElementTopAppBar
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.IconButton
+import io.element.android.libraries.designsystem.theme.components.Scaffold
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.designsystem.theme.components.TopAppBar
 
 @OptIn(ExperimentalMaterial3Api::class)
 @Composable
@@ -55,7 +55,7 @@ fun PreferenceView(
     onBackPressed: () -> Unit = {},
     content: @Composable ColumnScope.() -> Unit,
 ) {
-    ElementScaffold(
+    Scaffold(
         modifier = modifier
             .fillMaxSize()
             .systemBarsPadding()
@@ -89,7 +89,7 @@ fun PreferenceTopAppBar(
     modifier: Modifier = Modifier,
     onBackPressed: () -> Unit = {},
 ) {
-    ElementTopAppBar(
+    TopAppBar(
         modifier = modifier,
         navigationIcon = {
             IconButton(onClick = onBackPressed) {

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

@@ -32,7 +32,7 @@ import io.element.android.libraries.designsystem.components.preferences.componen
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
 import io.element.android.libraries.designsystem.theme.ElementTheme
-import io.element.android.libraries.designsystem.theme.components.ElementSlider
+import io.element.android.libraries.designsystem.theme.components.Slider
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.designsystem.toEnabledColor
 
@@ -75,7 +75,7 @@ fun PreferenceSlide(
                         text = summary
                     )
                 }
-                ElementSlider(
+                Slider(
                     value = value,
                     steps = steps,
                     onValueChange = onValueChange,

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

@@ -33,7 +33,7 @@ import io.element.android.libraries.designsystem.components.preferences.componen
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
 import io.element.android.libraries.designsystem.theme.ElementTheme
-import io.element.android.libraries.designsystem.theme.components.ElementCheckbox
+import io.element.android.libraries.designsystem.theme.components.Checkbox
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.designsystem.toEnabledColor
 
@@ -67,7 +67,7 @@ fun PreferenceSwitch(
                 color = enabled.toEnabledColor(),
                 text = title
             )
-            ElementCheckbox(
+            Checkbox(
                 modifier = Modifier.padding(end = preferencePaddingEnd),
                 checked = isChecked,
                 enabled = enabled,

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

@@ -32,7 +32,7 @@ import io.element.android.libraries.designsystem.theme.ElementTheme
 import io.element.android.libraries.designsystem.theme.elementContentColorFor
 
 @Composable
-fun ElementButton(
+fun Button(
     onClick: () -> Unit,
     modifier: Modifier = Modifier,
     enabled: Boolean = true,
@@ -70,19 +70,19 @@ fun ElementButton(
 
 @Preview
 @Composable
-fun ElementButtonsLightPreview() = ElementPreviewLight { ContentToPreview() }
+fun ButtonsLightPreview() = ElementPreviewLight { ContentToPreview() }
 
 @Preview
 @Composable
-fun ElementButtonsDarkPreview() = ElementPreviewDark { ContentToPreview() }
+fun ButtonsDarkPreview() = ElementPreviewDark { ContentToPreview() }
 
 @Composable
 private fun ContentToPreview() {
     Column {
-        ElementButton(onClick = {}, enabled = true) {
+        Button(onClick = {}, enabled = true) {
             Text(text = "Click me! - Enabled")
         }
-        ElementButton(onClick = {}, enabled = false) {
+        Button(onClick = {}, enabled = false) {
             Text(text = "Click me! - Disabled")
         }
     }

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

@@ -30,7 +30,7 @@ import io.element.android.libraries.designsystem.preview.ElementPreviewLight
 import io.element.android.libraries.designsystem.theme.ElementTheme
 
 @Composable
-fun ElementCheckbox(
+fun Checkbox(
     checked: Boolean,
     onCheckedChange: ((Boolean) -> Unit)?,
     modifier: Modifier = Modifier,
@@ -59,18 +59,18 @@ fun ElementCheckbox(
 
 @Preview
 @Composable
-fun ElementCheckboxesLightPreview() = ElementPreviewLight { ContentToPreview() }
+fun CheckboxesLightPreview() = ElementPreviewLight { ContentToPreview() }
 
 @Preview
 @Composable
-fun ElementCheckboxesDarkPreview() = ElementPreviewDark { ContentToPreview() }
+fun CheckboxesDarkPreview() = ElementPreviewDark { ContentToPreview() }
 
 @Composable
 private fun ContentToPreview() {
     Column {
-        ElementCheckbox(onCheckedChange = {}, enabled = true, checked = true)
-        ElementCheckbox(onCheckedChange = {}, enabled = true, checked = false)
-        ElementCheckbox(onCheckedChange = {}, enabled = false, checked = true)
-        ElementCheckbox(onCheckedChange = {}, enabled = false, checked = false)
+        Checkbox(onCheckedChange = {}, enabled = true, checked = true)
+        Checkbox(onCheckedChange = {}, enabled = true, checked = false)
+        Checkbox(onCheckedChange = {}, enabled = false, checked = true)
+        Checkbox(onCheckedChange = {}, enabled = false, checked = false)
     }
 }

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

@@ -24,7 +24,7 @@ import androidx.compose.ui.unit.Dp
 import io.element.android.libraries.designsystem.theme.ElementTheme
 
 @Composable
-fun ElementCircularProgressIndicator(
+fun CircularProgressIndicator(
     progress: Float,
     modifier: Modifier = Modifier,
     color: Color = ProgressIndicatorDefaults.circularColor,
@@ -39,7 +39,7 @@ fun ElementCircularProgressIndicator(
 }
 
 @Composable
-fun ElementCircularProgressIndicator(
+fun CircularProgressIndicator(
     modifier: Modifier = Modifier,
     color: Color = ElementTheme.colors.primary,
     strokeWidth: Dp = ProgressIndicatorDefaults.CircularStrokeWidth,

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

@@ -20,13 +20,17 @@ import androidx.compose.material3.DividerDefaults
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.Dp
+import io.element.android.libraries.designsystem.preview.ElementPreviewDark
+import io.element.android.libraries.designsystem.preview.ElementPreviewLight
+import io.element.android.libraries.designsystem.theme.ElementTheme
 
 @Composable
 fun Divider(
     modifier: Modifier = Modifier,
     thickness: Dp = DividerDefaults.Thickness,
-    color: Color = DividerDefaults.color,
+    color: Color = ElementTheme.colors.onBackground,
 ) {
     androidx.compose.material3.Divider(
         modifier = modifier,
@@ -34,3 +38,16 @@ fun Divider(
         color = color,
     )
 }
+
+@Preview
+@Composable
+fun DividerLightPreview() = ElementPreviewLight { ContentToPreview() }
+
+@Preview
+@Composable
+fun DividerDarkPreview() = ElementPreviewDark { ContentToPreview() }
+
+@Composable
+private fun ContentToPreview() {
+    Divider()
+}

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

@@ -19,7 +19,6 @@ package io.element.android.libraries.designsystem.theme.components
 import androidx.compose.foundation.layout.RowScope
 import androidx.compose.foundation.layout.WindowInsets
 import androidx.compose.material3.ExperimentalMaterial3Api
-import androidx.compose.material3.MediumTopAppBar
 import androidx.compose.material3.TopAppBarColors
 import androidx.compose.material3.TopAppBarDefaults
 import androidx.compose.material3.TopAppBarScrollBehavior
@@ -29,7 +28,7 @@ import io.element.android.libraries.designsystem.theme.ElementTheme
 
 @OptIn(ExperimentalMaterial3Api::class)
 @Composable
-fun ElementMediumAppBar(
+fun MediumTopAppBar(
     title: @Composable () -> Unit,
     modifier: Modifier = Modifier,
     navigationIcon: @Composable () -> Unit = {},
@@ -44,7 +43,7 @@ fun ElementMediumAppBar(
     ),
     scrollBehavior: TopAppBarScrollBehavior? = null
 ) {
-    MediumTopAppBar(
+    androidx.compose.material3.MediumTopAppBar(
         title = title,
         modifier = modifier,
         navigationIcon = navigationIcon,

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

@@ -20,7 +20,6 @@ import androidx.compose.foundation.layout.ColumnScope
 import androidx.compose.material.ExperimentalMaterialApi
 import androidx.compose.material.MaterialTheme
 import androidx.compose.material.ModalBottomSheetDefaults
-import androidx.compose.material.ModalBottomSheetLayout
 import androidx.compose.material.ModalBottomSheetState
 import androidx.compose.material.ModalBottomSheetValue
 import androidx.compose.material.rememberModalBottomSheetState
@@ -29,12 +28,12 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.Shape
 import androidx.compose.ui.unit.Dp
-import io.element.android.libraries.designsystem.theme.elementContentColorFor
 import io.element.android.libraries.designsystem.theme.ElementTheme
+import io.element.android.libraries.designsystem.theme.elementContentColorFor
 
 @OptIn(ExperimentalMaterialApi::class)
 @Composable
-fun ElementModalBottomSheetLayout(
+fun ModalBottomSheetLayout(
     sheetContent: @Composable ColumnScope.() -> Unit,
     modifier: Modifier = Modifier,
     sheetState: ModalBottomSheetState = rememberModalBottomSheetState(ModalBottomSheetValue.Hidden),
@@ -45,7 +44,7 @@ fun ElementModalBottomSheetLayout(
     scrimColor: Color = ElementTheme.colors.onSurfaceVariant.copy(alpha = 0.32f),
     content: @Composable () -> Unit = {}
 ) {
-    ModalBottomSheetLayout(
+    androidx.compose.material.ModalBottomSheetLayout(
         sheetContent = sheetContent,
         modifier = modifier,
         sheetState = sheetState,

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

@@ -39,7 +39,7 @@ import io.element.android.libraries.designsystem.theme.ElementTheme
 
 @OptIn(ExperimentalMaterial3Api::class)
 @Composable
-fun ElementOutlinedTextField(
+fun OutlinedTextField(
     value: String,
     onValueChange: (String) -> Unit,
     modifier: Modifier = Modifier,
@@ -118,22 +118,22 @@ fun ElementOutlinedTextField(
 
 @Preview
 @Composable
-fun ElementOutlinedTextFieldsLightPreview() = ElementPreviewLight { ContentToPreview() }
+fun OutlinedTextFieldsLightPreview() = ElementPreviewLight { ContentToPreview() }
 
 @Preview
 @Composable
-fun ElementOutlinedTextFieldsDarkPreview() = ElementPreviewDark { ContentToPreview() }
+fun OutlinedTextFieldsDarkPreview() = ElementPreviewDark { ContentToPreview() }
 
 @Composable
 private fun ContentToPreview() {
     Column {
-        ElementOutlinedTextField(onValueChange = {}, value = "Content", isError = false, enabled = true, readOnly = true)
-        ElementOutlinedTextField(onValueChange = {}, value = "Content", isError = false, enabled = true, readOnly = false)
-        ElementOutlinedTextField(onValueChange = {}, value = "Content", isError = false, enabled = false, readOnly = true)
-        ElementOutlinedTextField(onValueChange = {}, value = "Content", isError = false, enabled = false, readOnly = false)
-        ElementOutlinedTextField(onValueChange = {}, value = "Content", isError = true, enabled = true, readOnly = true)
-        ElementOutlinedTextField(onValueChange = {}, value = "Content", isError = true, enabled = true, readOnly = false)
-        ElementOutlinedTextField(onValueChange = {}, value = "Content", isError = true, enabled = false, readOnly = true)
-        ElementOutlinedTextField(onValueChange = {}, value = "Content", isError = true, enabled = false, readOnly = false)
+        OutlinedTextField(onValueChange = {}, value = "Content", isError = false, enabled = true, readOnly = true)
+        OutlinedTextField(onValueChange = {}, value = "Content", isError = false, enabled = true, readOnly = false)
+        OutlinedTextField(onValueChange = {}, value = "Content", isError = false, enabled = false, readOnly = true)
+        OutlinedTextField(onValueChange = {}, value = "Content", isError = false, enabled = false, readOnly = false)
+        OutlinedTextField(onValueChange = {}, value = "Content", isError = true, enabled = true, readOnly = true)
+        OutlinedTextField(onValueChange = {}, value = "Content", isError = true, enabled = true, readOnly = false)
+        OutlinedTextField(onValueChange = {}, value = "Content", isError = true, enabled = false, readOnly = true)
+        OutlinedTextField(onValueChange = {}, value = "Content", isError = true, enabled = false, readOnly = false)
     }
 }

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

@@ -24,12 +24,12 @@ import androidx.compose.material3.ScaffoldDefaults
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
-import io.element.android.libraries.designsystem.theme.elementContentColorFor
 import io.element.android.libraries.designsystem.theme.ElementTheme
+import io.element.android.libraries.designsystem.theme.elementContentColorFor
 
 @OptIn(ExperimentalMaterial3Api::class)
 @Composable
-fun ElementScaffold(
+fun Scaffold(
     modifier: Modifier = Modifier,
     topBar: @Composable () -> Unit = {},
     bottomBar: @Composable () -> Unit = {},

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

@@ -29,7 +29,7 @@ import io.element.android.libraries.designsystem.preview.ElementPreviewLight
 import io.element.android.libraries.designsystem.theme.ElementTheme
 
 @Composable
-fun ElementSlider(
+fun Slider(
     value: Float,
     onValueChange: (Float) -> Unit,
     modifier: Modifier = Modifier,
@@ -67,16 +67,16 @@ fun ElementSlider(
 
 @Preview
 @Composable
-fun ElementSlidersLightPreview() = ElementPreviewLight { ContentToPreview() }
+fun SlidersLightPreview() = ElementPreviewLight { ContentToPreview() }
 
 @Preview
 @Composable
-fun ElementSlidersDarkPreview() = ElementPreviewDark { ContentToPreview() }
+fun SlidersDarkPreview() = ElementPreviewDark { ContentToPreview() }
 
 @Composable
 private fun ContentToPreview() {
     Column {
-        ElementSlider(onValueChange = {}, value = 0.33f, enabled = true)
-        ElementSlider(onValueChange = {}, value = 0.33f, enabled = false)
+        Slider(onValueChange = {}, value = 0.33f, enabled = true)
+        Slider(onValueChange = {}, value = 0.33f, enabled = false)
     }
 }

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

@@ -24,11 +24,11 @@ import androidx.compose.ui.graphics.RectangleShape
 import androidx.compose.ui.graphics.Shape
 import androidx.compose.ui.unit.Dp
 import androidx.compose.ui.unit.dp
-import io.element.android.libraries.designsystem.theme.elementContentColorFor
 import io.element.android.libraries.designsystem.theme.ElementTheme
+import io.element.android.libraries.designsystem.theme.elementContentColorFor
 
 @Composable
-fun ElementSurface(
+fun Surface(
     modifier: Modifier = Modifier,
     shape: Shape = RectangleShape,
     color: Color = ElementTheme.colors.surfaceVariant,

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

@@ -28,7 +28,7 @@ import io.element.android.libraries.designsystem.theme.ElementTheme
 
 @OptIn(ExperimentalMaterial3Api::class)
 @Composable
-fun ElementTopAppBar(
+fun TopAppBar(
     title: @Composable () -> Unit,
     modifier: Modifier = Modifier,
     navigationIcon: @Composable () -> Unit = {},

tests/uitests/src/main/kotlin/io/element/android/tests/uitests/ShowkaseButton.kt

@@ -30,7 +30,7 @@ import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
-import io.element.android.libraries.designsystem.theme.components.ElementButton
+import io.element.android.libraries.designsystem.theme.components.Button
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.IconButton
 import io.element.android.libraries.designsystem.theme.components.Text
@@ -43,7 +43,7 @@ fun ShowkaseButton(
     var isShowkaseButtonVisible by remember { mutableStateOf(BuildConfig.DEBUG) }
 
     if (isShowkaseButtonVisible) {
-        ElementButton(
+        Button(
             modifier = modifier
                 .padding(top = 32.dp),
             onClick = onClick