Remove ElementTextStyles. Only ElementTheme.typography.* styles must be used now.

2023-07-10 16:15:19 +02:00
parent 9b042cf056
commit 7be0e3ea4b
22 changed files with 96 additions and 312 deletions
--- a/features/analytics/impl/src/main/kotlin/io/element/android/features/analytics/impl/AnalyticsOptInView.kt
+++ b/features/analytics/impl/src/main/kotlin/io/element/android/features/analytics/impl/AnalyticsOptInView.kt
@@ -48,7 +48,6 @@ import androidx.compose.ui.tooling.preview.PreviewParameter
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
 import io.element.android.features.analytics.api.AnalyticsOptInEvents
-import io.element.android.libraries.designsystem.ElementTextStyles
 import io.element.android.libraries.designsystem.atomic.molecules.ButtonColumnMolecule
 import io.element.android.libraries.designsystem.atomic.molecules.IconTitleSubtitleMolecule
 import io.element.android.libraries.designsystem.atomic.pages.HeaderFooterPage
@@ -109,7 +108,7 @@ private fun AnalyticsOptInHeader(
                .clip(shape = RoundedCornerShape(8.dp))
                .clickable { onClickTerms() }
                .padding(8.dp),
-            style = ElementTextStyles.Regular.subheadline,
+            style = ElementTheme.typography.fontBodyMdRegular,
            textAlign = TextAlign.Center,
            color = MaterialTheme.colorScheme.secondary,
        )
--- a/features/invitelist/impl/src/main/kotlin/io/element/android/features/invitelist/impl/components/InviteSummaryRow.kt
+++ b/features/invitelist/impl/src/main/kotlin/io/element/android/features/invitelist/impl/components/InviteSummaryRow.kt
@@ -46,7 +46,6 @@ import io.element.android.features.invitelist.impl.R
 import io.element.android.features.invitelist.impl.model.InviteListInviteSummary
 import io.element.android.features.invitelist.impl.model.InviteListInviteSummaryProvider
 import io.element.android.features.invitelist.impl.model.InviteSender
-import io.element.android.libraries.designsystem.ElementTextStyles
 import io.element.android.libraries.designsystem.atomic.atoms.UnreadIndicatorAtom
 import io.element.android.libraries.designsystem.components.avatar.Avatar
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
@@ -55,6 +54,7 @@ import io.element.android.libraries.designsystem.theme.components.Button
 import io.element.android.libraries.designsystem.theme.components.OutlinedButton
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.designsystem.theme.noFontPadding
+import io.element.android.libraries.theme.ElementTheme
 import io.element.android.libraries.ui.strings.CommonStrings

 private val minHeight = 72.dp
@@ -137,7 +137,7 @@ internal fun DefaultInviteSummaryRow(
            // CTAs
            Row(Modifier.padding(top = 12.dp)) {
                OutlinedButton(
-                    content = { Text(stringResource(CommonStrings.action_decline), style = ElementTextStyles.Button) },
+                    content = { Text(stringResource(CommonStrings.action_decline), style = ElementTheme.typography.fontBodyLgMedium) },
                    onClick = onDeclineClicked,
                    modifier = Modifier
                        .weight(1f)
@@ -148,7 +148,7 @@ internal fun DefaultInviteSummaryRow(
                Spacer(modifier = Modifier.width(12.dp))

                Button(
-                    content = { Text(stringResource(CommonStrings.action_accept), style = ElementTextStyles.Button) },
+                    content = { Text(stringResource(CommonStrings.action_accept), style = ElementTheme.typography.fontBodyLgMedium) },
                    onClick = onAcceptClicked,
                    modifier = Modifier
                        .weight(1f)
--- a/features/login/impl/src/main/kotlin/io/element/android/features/login/impl/accountprovider/AccountProviderView.kt
+++ b/features/login/impl/src/main/kotlin/io/element/android/features/login/impl/accountprovider/AccountProviderView.kt
@@ -35,7 +35,6 @@ import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.tooling.preview.PreviewParameter
 import androidx.compose.ui.unit.dp
 import io.element.android.features.login.impl.R
-import io.element.android.libraries.designsystem.ElementTextStyles
 import io.element.android.libraries.designsystem.atomic.atoms.RoundedIconAtom
 import io.element.android.libraries.designsystem.atomic.atoms.RoundedIconAtomSize
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
@@ -43,6 +42,7 @@ import io.element.android.libraries.designsystem.preview.ElementPreviewLight
 import io.element.android.libraries.designsystem.theme.components.Divider
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.theme.ElementTheme

 /**
 * https://www.figma.com/file/o9p34zmiuEpZRyvZXJZAYL/FTUE?type=design&node-id=604-60817
@@ -86,7 +86,7 @@ fun AccountProviderView(
                        .padding(start = 16.dp)
                        .weight(1f),
                    text = item.title,
-                    style = ElementTextStyles.Regular.headline.copy(textAlign = TextAlign.Start),
+                    style = ElementTheme.typography.fontBodyLgMedium,
                    color = MaterialTheme.colorScheme.primary,
                )
                if (item.isPublic) {
@@ -105,7 +105,7 @@ fun AccountProviderView(
                    modifier = Modifier
                        .padding(start = 46.dp, bottom = 12.dp, end = 26.dp),
                    text = item.subtitle,
-                    style = ElementTextStyles.Regular.subheadline.copy(textAlign = TextAlign.Start),
+                    style = ElementTheme.typography.fontBodyMdRegular,
                    color = MaterialTheme.colorScheme.secondary,
                )
            }
--- a/features/login/impl/src/main/kotlin/io/element/android/features/login/impl/screens/loginpassword/LoginPasswordView.kt
+++ b/features/login/impl/src/main/kotlin/io/element/android/features/login/impl/screens/loginpassword/LoginPasswordView.kt
@@ -58,7 +58,6 @@ import io.element.android.features.login.impl.R
 import io.element.android.features.login.impl.error.isWaitListError
 import io.element.android.features.login.impl.error.loginError
 import io.element.android.libraries.architecture.Async
-import io.element.android.libraries.designsystem.ElementTextStyles
 import io.element.android.libraries.designsystem.atomic.molecules.IconTitleSubtitleMolecule
 import io.element.android.libraries.designsystem.components.button.BackButton
 import io.element.android.libraries.designsystem.components.button.ButtonWithProgress
@@ -76,6 +75,7 @@ import io.element.android.libraries.designsystem.theme.components.autofill
 import io.element.android.libraries.designsystem.theme.components.onTabOrEnterKeyFocusNext
 import io.element.android.libraries.testtags.TestTags
 import io.element.android.libraries.testtags.testTag
+import io.element.android.libraries.theme.ElementTheme
 import io.element.android.libraries.ui.strings.CommonStrings

@OptIn(ExperimentalMaterial3Api::class, ExperimentalLayoutApi::class)
@@ -186,7 +186,7 @@ internal fun LoginForm(
        Text(
            text = stringResource(R.string.screen_login_form_header),
            modifier = Modifier.padding(start = 16.dp),
-            style = ElementTextStyles.Regular.formHeader
+            style = ElementTheme.typography.fontBodyMdRegular,
        )

        Spacer(modifier = Modifier.height(8.dp))
--- a/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/actionlist/ActionListView.kt
+++ b/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/actionlist/ActionListView.kt
@@ -66,12 +66,10 @@ import io.element.android.features.messages.impl.timeline.model.event.TimelineIt
 import io.element.android.features.messages.impl.timeline.model.event.TimelineItemUnknownContent
 import io.element.android.features.messages.impl.timeline.model.event.TimelineItemVideoContent
 import io.element.android.features.messages.impl.utils.messagesummary.MessageSummaryFormatterImpl
-import io.element.android.libraries.designsystem.ElementTextStyles
 import io.element.android.libraries.designsystem.components.avatar.Avatar
 import io.element.android.libraries.designsystem.components.avatar.AvatarSize
 import io.element.android.libraries.designsystem.preview.DayNightPreviews
 import io.element.android.libraries.designsystem.preview.ElementPreview
-import io.element.android.libraries.designsystem.preview.ElementPreviewLight
 import io.element.android.libraries.designsystem.text.toSp
 import io.element.android.libraries.designsystem.theme.components.Divider
 import io.element.android.libraries.designsystem.theme.components.Icon
@@ -221,7 +219,7 @@ private fun SheetContent(
 private fun MessageSummary(event: TimelineItem.Event, modifier: Modifier = Modifier) {
    val content: @Composable () -> Unit
    var icon: @Composable () -> Unit = { Avatar(avatarData = event.senderAvatar.copy(size = AvatarSize.MessageActionSender)) }
-    val contentStyle = ElementTextStyles.Regular.bodyMD.copy(color = MaterialTheme.colorScheme.secondary)
+    val contentStyle = ElementTheme.typography.fontBodyMdRegular.copy(color = MaterialTheme.colorScheme.secondary)
    val imageModifier = Modifier
        .size(AvatarSize.MessageActionSender.dp)
        .clip(RoundedCornerShape(9.dp))
@@ -306,7 +304,7 @@ private fun MessageSummary(event: TimelineItem.Event, modifier: Modifier = Modif
                if (event.senderDisplayName != null) {
                    Text(
                        text = event.senderDisplayName,
-                        style = ElementTextStyles.Bold.caption1,
+                        style = ElementTheme.typography.fontBodySmMedium,
                        color = MaterialTheme.colorScheme.primary
                    )
                }
@@ -316,7 +314,7 @@ private fun MessageSummary(event: TimelineItem.Event, modifier: Modifier = Modif
        Spacer(modifier = Modifier.width(16.dp))
        Text(
            event.sentTime,
-            style = ElementTextStyles.Regular.caption2,
+            style = ElementTheme.typography.fontBodyXsRegular,
            color = MaterialTheme.colorScheme.secondary,
            textAlign = TextAlign.End,
        )
--- a/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/forward/ForwardMessagesView.kt
+++ b/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/forward/ForwardMessagesView.kt
@@ -44,7 +44,6 @@ 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 io.element.android.libraries.designsystem.ElementTextStyles
 import io.element.android.libraries.designsystem.components.ProgressDialog
 import io.element.android.libraries.designsystem.components.avatar.Avatar
 import io.element.android.libraries.designsystem.components.avatar.AvatarData
@@ -67,6 +66,7 @@ import io.element.android.libraries.designsystem.theme.roomListRoomName
 import io.element.android.libraries.matrix.api.core.RoomId
 import io.element.android.libraries.matrix.api.room.RoomSummaryDetails
 import io.element.android.libraries.matrix.ui.components.SelectedRoom
+import io.element.android.libraries.theme.ElementTheme
 import io.element.android.libraries.ui.strings.CommonStrings
 import kotlinx.collections.immutable.ImmutableList

@@ -112,7 +112,12 @@ fun ForwardMessagesView(
        modifier = modifier,
        topBar = {
            TopAppBar(
-                title = { Text(stringResource(CommonStrings.common_forward_message), style = ElementTextStyles.Bold.callout) },
+                title = {
+                    Text(
+                        text = stringResource(CommonStrings.common_forward_message),
+                        style = ElementTheme.typography.fontHeadingSmMedium
+                    )
+                },
                navigationIcon = {
                    BackButton(onClick = { onBackButton(state) })
                },
--- a/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/report/ReportMessageView.kt
+++ b/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/report/ReportMessageView.kt
@@ -38,13 +38,11 @@ import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.platform.LocalFocusManager
 import androidx.compose.ui.res.stringResource
-import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.tooling.preview.PreviewParameter
 import androidx.compose.ui.unit.dp
 import io.element.android.libraries.architecture.Async
-import io.element.android.libraries.designsystem.ElementTextStyles
 import io.element.android.libraries.designsystem.components.button.BackButton
 import io.element.android.libraries.designsystem.components.button.ButtonWithProgress
 import io.element.android.libraries.designsystem.components.dialogs.ErrorDialog
@@ -54,6 +52,7 @@ import io.element.android.libraries.designsystem.theme.components.OutlinedTextFi
 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.theme.ElementTheme
 import io.element.android.libraries.ui.strings.CommonStrings

@OptIn(ExperimentalMaterial3Api::class, ExperimentalLayoutApi::class)
@@ -87,8 +86,7 @@ fun ReportMessageView(
                title = {
                    Text(
                        stringResource(CommonStrings.action_report_content),
-                        style = ElementTextStyles.Regular.callout,
-                        fontWeight = FontWeight.Medium,
+                        style = ElementTheme.typography.fontHeadingSmMedium,
                    )
                },
                navigationIcon = {
@@ -120,7 +118,7 @@ fun ReportMessageView(
            )
            Text(
                text = stringResource(CommonStrings.report_content_explanation),
-                style = ElementTextStyles.Regular.caption1,
+                style = ElementTheme.typography.fontBodySmRegular,
                color = MaterialTheme.colorScheme.secondary,
                textAlign = TextAlign.Start,
                modifier = Modifier.padding(top = 4.dp, bottom = 24.dp, start = 16.dp, end = 16.dp)
@@ -134,11 +132,11 @@ fun ReportMessageView(
                Column(modifier = Modifier.weight(1f), verticalArrangement = Arrangement.spacedBy(4.dp)) {
                    Text(
                        text = stringResource(CommonStrings.screen_report_content_block_user),
-                        style = ElementTextStyles.Regular.callout,
+                        style = ElementTheme.typography.fontBodyLgRegular,
                    )
                    Text(
                        text = stringResource(CommonStrings.screen_report_content_block_user_hint),
-                        style = ElementTextStyles.Regular.bodyMD,
+                        style = ElementTheme.typography.fontBodyMdRegular,
                        color = MaterialTheme.colorScheme.secondary,
                    )
                }
--- a/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/MessagesReactionButton.kt
+++ b/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/MessagesReactionButton.kt
@@ -45,7 +45,6 @@ import io.element.android.features.messages.impl.R
 import io.element.android.features.messages.impl.timeline.model.AggregatedReaction
 import io.element.android.features.messages.impl.timeline.model.AggregatedReactionProvider
 import io.element.android.features.messages.impl.timeline.model.aTimelineItemReactions
-import io.element.android.libraries.designsystem.ElementTextStyles
 import io.element.android.libraries.designsystem.preview.DayNightPreviews
 import io.element.android.libraries.designsystem.preview.ElementPreview
 import io.element.android.libraries.designsystem.text.toDp
@@ -117,7 +116,7 @@ private fun TextContent(
    modifier = modifier
        .height(reactionEmojiLineHeight.toDp()),
    text = text,
-    style = ElementTextStyles.Regular.bodyMD
+    style = ElementTheme.typography.fontBodyMdRegular,
 )

@Composable
--- a/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/TimelineEventTimestampView.kt
+++ b/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/TimelineEventTimestampView.kt
@@ -38,12 +38,12 @@ import androidx.compose.ui.unit.dp
 import io.element.android.features.messages.impl.timeline.model.TimelineItem
 import io.element.android.features.messages.impl.timeline.model.event.TimelineItemTextBasedContent
 import io.element.android.libraries.core.bool.orFalse
-import io.element.android.libraries.designsystem.ElementTextStyles
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.matrix.api.timeline.item.event.LocalEventSendState
+import io.element.android.libraries.theme.ElementTheme
 import io.element.android.libraries.ui.strings.CommonStrings

@OptIn(ExperimentalFoundationApi::class)
@@ -78,14 +78,14 @@ fun TimelineEventTimestampView(
        if (isMessageEdited) {
            Text(
                stringResource(CommonStrings.common_edited_suffix),
-                style = ElementTextStyles.Regular.caption2,
+                style = ElementTheme.typography.fontBodyXsRegular,
                color = tint ?: MaterialTheme.colorScheme.secondary,
            )
            Spacer(modifier = Modifier.width(4.dp))
        }
        Text(
            formattedTime,
-            style = ElementTextStyles.Regular.caption2,
+            style = ElementTheme.typography.fontBodyXsRegular,
            color = tint ?: MaterialTheme.colorScheme.secondary,
        )
        if (hasMessageSendingFailed && tint != null) {
--- a/features/networkmonitor/api/src/main/kotlin/io/element/android/features/networkmonitor/api/ui/ConnectivityIndicatorView.kt
+++ b/features/networkmonitor/api/src/main/kotlin/io/element/android/features/networkmonitor/api/ui/ConnectivityIndicatorView.kt
@@ -45,9 +45,9 @@ import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
-import io.element.android.libraries.designsystem.ElementTextStyles
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
+import io.element.android.libraries.theme.ElementTheme
 import io.element.android.libraries.ui.strings.CommonStrings

@Composable
@@ -98,7 +98,7 @@ private fun Indicator(modifier: Modifier = Modifier) {
        Spacer(modifier = Modifier.width(8.dp))
        Text(
            text = stringResource(CommonStrings.common_offline),
-            style = ElementTextStyles.Regular.bodyMD.copy(fontWeight = FontWeight.Medium),
+            style = ElementTheme.typography.fontBodyMdMedium,
            color = tint,
        )
    }
--- a/features/roomdetails/impl/src/main/kotlin/io/element/android/features/roomdetails/impl/RoomDetailsView.kt
+++ b/features/roomdetails/impl/src/main/kotlin/io/element/android/features/roomdetails/impl/RoomDetailsView.kt
@@ -57,7 +57,6 @@ import io.element.android.features.roomdetails.impl.blockuser.BlockUserDialogs
 import io.element.android.features.roomdetails.impl.blockuser.BlockUserSection
 import io.element.android.features.roomdetails.impl.members.details.RoomMemberHeaderSection
 import io.element.android.features.roomdetails.impl.members.details.RoomMemberMainActionsSection
-import io.element.android.libraries.designsystem.ElementTextStyles
 import io.element.android.libraries.designsystem.components.avatar.Avatar
 import io.element.android.libraries.designsystem.components.avatar.AvatarData
 import io.element.android.libraries.designsystem.components.avatar.AvatarSize
@@ -77,6 +76,7 @@ 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.matrix.api.room.RoomMember
+import io.element.android.libraries.theme.ElementTheme
 import io.element.android.libraries.ui.strings.CommonStrings

@OptIn(ExperimentalLayoutApi::class)
@@ -234,10 +234,10 @@ internal fun RoomHeaderSection(
            )
        }
        Spacer(modifier = Modifier.height(24.dp))
-        Text(roomName, style = ElementTextStyles.Bold.title1)
+        Text(roomName, style = ElementTheme.typography.fontHeadingLgBold)
        if (roomAlias != null) {
            Spacer(modifier = Modifier.height(6.dp))
-            Text(roomAlias, style = ElementTextStyles.Regular.body, color = MaterialTheme.colorScheme.secondary)
+            Text(roomAlias, style = ElementTheme.typography.fontBodyLgRegular, color = MaterialTheme.colorScheme.secondary)
        }
        Spacer(Modifier.height(32.dp))
    }
--- a/features/roomdetails/impl/src/main/kotlin/io/element/android/features/roomdetails/impl/members/RoomMemberListView.kt
+++ b/features/roomdetails/impl/src/main/kotlin/io/element/android/features/roomdetails/impl/members/RoomMemberListView.kt
@@ -44,7 +44,6 @@ import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
 import io.element.android.features.roomdetails.impl.R
 import io.element.android.libraries.architecture.Async
-import io.element.android.libraries.designsystem.ElementTextStyles
 import io.element.android.libraries.designsystem.components.avatar.AvatarSize
 import io.element.android.libraries.designsystem.components.button.BackButton
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
@@ -60,6 +59,7 @@ import io.element.android.libraries.matrix.api.core.UserId
 import io.element.android.libraries.matrix.api.room.RoomMember
 import io.element.android.libraries.matrix.api.user.MatrixUser
 import io.element.android.libraries.matrix.ui.components.MatrixUserRow
+import io.element.android.libraries.theme.ElementTheme
 import io.element.android.libraries.ui.strings.CommonStrings
 import kotlinx.collections.immutable.ImmutableList

@@ -163,10 +163,8 @@ private fun LazyListScope.roomMemberListSection(
        Text(
            modifier = Modifier.padding(horizontal = 16.dp, vertical = 12.dp),
            text = headerText(),
-            fontSize = 16.sp,
-            style = ElementTextStyles.Regular.callout,
+            style = ElementTheme.typography.fontBodyLgRegular,
            color = MaterialTheme.colorScheme.secondary,
-            textAlign = TextAlign.Start,
        )
    }
    items(members) { matrixUser ->
--- a/features/roomdetails/impl/src/main/kotlin/io/element/android/features/roomdetails/impl/members/details/RoomMemberDetailsView.kt
+++ b/features/roomdetails/impl/src/main/kotlin/io/element/android/features/roomdetails/impl/members/details/RoomMemberDetailsView.kt
@@ -43,7 +43,6 @@ import androidx.compose.ui.tooling.preview.PreviewParameter
 import androidx.compose.ui.unit.dp
 import io.element.android.features.roomdetails.impl.blockuser.BlockUserDialogs
 import io.element.android.features.roomdetails.impl.blockuser.BlockUserSection
-import io.element.android.libraries.designsystem.ElementTextStyles
 import io.element.android.libraries.designsystem.components.avatar.Avatar
 import io.element.android.libraries.designsystem.components.avatar.AvatarData
 import io.element.android.libraries.designsystem.components.avatar.AvatarSize
@@ -57,6 +56,7 @@ import io.element.android.libraries.designsystem.preview.LargeHeightPreview
 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.theme.ElementTheme
 import io.element.android.libraries.ui.strings.CommonStrings

@OptIn(ExperimentalMaterial3Api::class, ExperimentalLayoutApi::class)
@@ -118,10 +118,10 @@ internal fun RoomMemberHeaderSection(
        }
        Spacer(modifier = Modifier.height(24.dp))
        if (userName != null) {
-            Text(userName, style = ElementTextStyles.Bold.title1)
+            Text(userName, style = ElementTheme.typography.fontHeadingLgBold)
            Spacer(modifier = Modifier.height(6.dp))
        }
-        Text(userId, style = ElementTextStyles.Regular.body, color = MaterialTheme.colorScheme.secondary)
+        Text(userId, style = ElementTheme.typography.fontBodyLgRegular, color = MaterialTheme.colorScheme.secondary)
        Spacer(Modifier.height(40.dp))
    }
 }
--- a/features/roomlist/impl/src/main/kotlin/io/element/android/features/roomlist/impl/components/RequestVerificationHeader.kt
+++ b/features/roomlist/impl/src/main/kotlin/io/element/android/features/roomlist/impl/components/RequestVerificationHeader.kt
@@ -35,13 +35,13 @@ import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import io.element.android.features.roomlist.impl.R
-import io.element.android.libraries.designsystem.ElementTextStyles
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
 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.Surface
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.theme.ElementTheme
 import io.element.android.libraries.ui.strings.CommonStrings

@Composable
@@ -65,7 +65,7 @@ internal fun RequestVerificationHeader(
                    Text(
                        stringResource(R.string.session_verification_banner_title),
                        modifier = Modifier.weight(1f),
-                        style = ElementTextStyles.Bold.body,
+                        style = ElementTheme.typography.fontBodyLgMedium,
                        color = MaterialTheme.colorScheme.primary,
                        textAlign = TextAlign.Start,
                    )
@@ -78,7 +78,7 @@ internal fun RequestVerificationHeader(
                Spacer(modifier = Modifier.height(4.dp))
                Text(
                    stringResource(R.string.session_verification_banner_message),
-                    style = ElementTextStyles.Regular.bodyMD
+                    style = ElementTheme.typography.fontBodyMdRegular,
                )
                Spacer(modifier = Modifier.height(12.dp))
                Button(
@@ -88,7 +88,7 @@ internal fun RequestVerificationHeader(
                ) {
                    Text(
                        stringResource(CommonStrings.action_continue),
-                        style = ElementTextStyles.Button
+                        style = ElementTheme.typography.fontBodyLgMedium
                    )
                }
            }
--- a/features/verifysession/impl/src/main/kotlin/io/element/android/features/verifysession/impl/VerifySelfSessionView.kt
+++ b/features/verifysession/impl/src/main/kotlin/io/element/android/features/verifysession/impl/VerifySelfSessionView.kt
@@ -41,7 +41,6 @@ import androidx.compose.ui.tooling.preview.PreviewParameter
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
 import io.element.android.libraries.architecture.Async
-import io.element.android.libraries.designsystem.ElementTextStyles
 import io.element.android.libraries.designsystem.atomic.molecules.ButtonColumnMolecule
 import io.element.android.libraries.designsystem.atomic.molecules.IconTitleSubtitleMolecule
 import io.element.android.libraries.designsystem.atomic.pages.HeaderFooterPage
@@ -51,6 +50,7 @@ import io.element.android.libraries.designsystem.preview.ElementPreviewLight
 import io.element.android.libraries.designsystem.theme.components.CircularProgressIndicator
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.matrix.api.verification.VerificationEmoji
+import io.element.android.libraries.theme.ElementTheme
 import io.element.android.libraries.ui.strings.CommonStrings
 import io.element.android.features.verifysession.impl.VerifySelfSessionState.VerificationStep as FlowStep

@@ -162,7 +162,7 @@ internal fun EmojiItemView(emoji: VerificationEmoji, modifier: Modifier = Modifi
        Spacer(modifier = Modifier.height(16.dp))
        Text(
            emoji.name,
-            style = ElementTextStyles.Regular.bodyMD,
+            style = ElementTheme.typography.fontBodyMdRegular,
            color = MaterialTheme.colorScheme.secondary,
            maxLines = 1,
            overflow = TextOverflow.Ellipsis,
--- a/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/ElementTextStyles.kt
+++ b/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/ElementTextStyles.kt
@@ -1,234 +0,0 @@
-/*
- * Copyright (c) 2023 New Vector Ltd
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-package io.element.android.libraries.designsystem
-
-import androidx.compose.ui.text.PlatformTextStyle
-import androidx.compose.ui.text.TextStyle
-import androidx.compose.ui.text.font.FontStyle
-import androidx.compose.ui.text.font.FontWeight
-import androidx.compose.ui.text.style.TextAlign
-import androidx.compose.ui.unit.sp
-
-// TODO Remove
-object ElementTextStyles {
-
-    @Suppress("DEPRECATION")
-    val Button = TextStyle(
-        fontSize = 16.sp,
-        fontWeight = FontWeight.Medium,
-        lineHeight = 22.sp,
-        fontStyle = FontStyle.Normal,
-        textAlign = TextAlign.Center,
-        platformStyle = PlatformTextStyle(includeFontPadding = false)
-    )
-
-    object Bold {
-        val largeTitle = TextStyle(
-            fontSize = 34.sp,
-            fontWeight = FontWeight.Bold,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 41.sp,
-            textAlign = TextAlign.Center
-        )
-
-        val title1 = TextStyle(
-            fontSize = 28.sp,
-            fontWeight = FontWeight.Bold,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 34.sp,
-            textAlign = TextAlign.Center
-        )
-
-        val title2 = TextStyle(
-            fontSize = 22.sp,
-            fontWeight = FontWeight.Bold,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 28.sp,
-            textAlign = TextAlign.Center
-        )
-
-        val title3 = TextStyle(
-            fontSize = 20.sp,
-            fontWeight = FontWeight.SemiBold,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 25.sp,
-            textAlign = TextAlign.Center
-        )
-
-        val headline = TextStyle(
-            fontSize = 17.sp,
-            fontWeight = FontWeight.SemiBold,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 22.sp,
-            textAlign = TextAlign.Center
-        )
-
-        val body = TextStyle(
-            fontSize = 17.sp,
-            fontWeight = FontWeight.SemiBold,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 22.sp,
-            textAlign = TextAlign.Center
-        )
-
-        val callout = TextStyle(
-            fontSize = 16.sp,
-            fontWeight = FontWeight.SemiBold,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 21.sp,
-            textAlign = TextAlign.Center
-        )
-
-        val subheadline = TextStyle(
-            fontSize = 15.sp,
-            fontWeight = FontWeight.SemiBold,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 20.sp,
-            textAlign = TextAlign.Center
-        )
-
-        val footnote = TextStyle(
-            fontSize = 13.sp,
-            fontWeight = FontWeight.SemiBold,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 18.sp,
-            textAlign = TextAlign.Center
-        )
-
-        val caption1 = TextStyle(
-            fontSize = 12.sp,
-            fontWeight = FontWeight.Medium,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 16.sp,
-            textAlign = TextAlign.Center
-        )
-
-        val caption2 = TextStyle(
-            fontSize = 11.sp,
-            fontWeight = FontWeight.Medium,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 13.sp,
-            textAlign = TextAlign.Center
-        )
-    }
-
-    object Regular {
-        val largeTitle = TextStyle(
-            fontSize = 34.sp,
-            fontWeight = FontWeight.Normal,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 41.sp,
-            textAlign = TextAlign.Center
-        )
-
-        val title1 = TextStyle(
-            fontSize = 28.sp,
-            fontWeight = FontWeight.Normal,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 34.sp,
-            textAlign = TextAlign.Center
-        )
-
-        val title2 = TextStyle(
-            fontSize = 22.sp,
-            fontWeight = FontWeight.Normal,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 28.sp,
-            textAlign = TextAlign.Center
-        )
-
-        val title3 = TextStyle(
-            fontSize = 20.sp,
-            fontWeight = FontWeight.Normal,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 25.sp,
-            textAlign = TextAlign.Center
-        )
-
-        val headline = TextStyle(
-            fontSize = 17.sp,
-            fontWeight = FontWeight.SemiBold,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 22.sp,
-            textAlign = TextAlign.Center
-        )
-
-        val body = TextStyle(
-            fontSize = 17.sp,
-            fontWeight = FontWeight.Normal,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 22.sp,
-            textAlign = TextAlign.Center
-        )
-
-        val callout = TextStyle(
-            fontSize = 16.sp,
-            fontWeight = FontWeight.Normal,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 21.sp,
-            textAlign = TextAlign.Center
-        )
-
-        val subheadline = TextStyle(
-            fontSize = 15.sp,
-            fontWeight = FontWeight.Normal,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 20.sp,
-            textAlign = TextAlign.Center
-        )
-
-        val formHeader = TextStyle(
-            fontSize = 14.sp,
-            fontWeight = FontWeight.Normal,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 20.sp,
-            textAlign = TextAlign.Start
-        )
-
-        val bodyMD = TextStyle(
-            fontSize = 14.sp,
-            fontWeight = FontWeight.Normal,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 20.sp,
-            textAlign = TextAlign.Start
-        )
-
-        val footnote = TextStyle(
-            fontSize = 13.sp,
-            fontWeight = FontWeight.Normal,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 18.sp,
-            textAlign = TextAlign.Center
-        )
-
-        val caption1 = TextStyle(
-            fontSize = 12.sp,
-            fontWeight = FontWeight.Normal,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 16.sp,
-            textAlign = TextAlign.Center
-        )
-
-        val caption2 = TextStyle(
-            fontSize = 11.sp,
-            fontWeight = FontWeight.Normal,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 13.sp,
-            textAlign = TextAlign.Center
-        )
-    }
-}
--- a/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/atomic/molecules/IconTitleSubtitleMolecule.kt
+++ b/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/atomic/molecules/IconTitleSubtitleMolecule.kt
@@ -29,13 +29,13 @@ import androidx.compose.ui.graphics.vector.ImageVector
 import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
-import io.element.android.libraries.designsystem.ElementTextStyles
 import io.element.android.libraries.designsystem.R
 import io.element.android.libraries.designsystem.atomic.atoms.RoundedIconAtom
 import io.element.android.libraries.designsystem.atomic.atoms.RoundedIconAtomSize
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.theme.ElementTheme

 /**
 * IconTitleSubtitleMolecule is a molecule which displays an icon, a title and a subtitle.
@@ -71,7 +71,7 @@ fun IconTitleSubtitleMolecule(
            modifier = Modifier
                .fillMaxWidth(),
            textAlign = TextAlign.Center,
-            style = ElementTextStyles.Bold.title2,
+            style = ElementTheme.typography.fontHeadingMdBold,
            color = MaterialTheme.colorScheme.primary,
        )
        Spacer(Modifier.height(8.dp))
@@ -79,7 +79,7 @@ fun IconTitleSubtitleMolecule(
            text = subTitle,
            modifier = Modifier.fillMaxWidth(),
            textAlign = TextAlign.Center,
-            style = ElementTextStyles.Regular.subheadline,
+            style = ElementTheme.typography.fontBodyMdRegular,
            color = MaterialTheme.colorScheme.secondary,
        )
    }
--- a/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/button/ButtonWithProgress.kt
+++ b/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/button/ButtonWithProgress.kt
@@ -32,13 +32,13 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Shape
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
-import io.element.android.libraries.designsystem.ElementTextStyles
 import io.element.android.libraries.designsystem.preview.ElementThemedPreview
 import io.element.android.libraries.designsystem.preview.PreviewGroup
 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.ElementButtonDefaults
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.theme.ElementTheme

 /**
 * A component that will display a button with an indeterminate circular progressbar.
@@ -64,7 +64,9 @@ fun ButtonWithProgress(
 ) {
    Button(
        onClick = {
-            if (!showProgress) { onClick() }
+            if (!showProgress) {
+                onClick()
+            }
        },
        modifier = modifier,
        enabled = enabled,
@@ -85,10 +87,10 @@ fun ButtonWithProgress(
            )
            if (progressText != null) {
                Spacer(Modifier.width(10.dp))
-                Text(progressText, style = ElementTextStyles.Button)
+                Text(progressText, style = ElementTheme.typography.fontBodyLgMedium)
            }
        } else if (text != null) {
-            Text(text, style = ElementTextStyles.Button)
+            Text(text, style = ElementTheme.typography.fontBodyLgMedium)
        }
    }
 }
--- a/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/button/MainActionButton.kt
+++ b/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/button/MainActionButton.kt
@@ -33,14 +33,13 @@ import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.vector.ImageVector
-import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
-import io.element.android.libraries.designsystem.ElementTextStyles
 import io.element.android.libraries.designsystem.preview.ElementThemedPreview
 import io.element.android.libraries.designsystem.preview.PreviewGroup
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.theme.ElementTheme

@Composable
 fun MainActionButton(
@@ -71,7 +70,7 @@ fun MainActionButton(
        Spacer(modifier = Modifier.height(14.dp))
        Text(
            title,
-            style = ElementTextStyles.Regular.bodyMD.copy(fontWeight = FontWeight.Medium),
+            style = ElementTheme.typography.fontBodyMdMedium,
            color = tintColor,
        )
    }
--- a/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/dialogs/AlertDialogContent.kt
+++ b/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/dialogs/AlertDialogContent.kt
@@ -38,8 +38,8 @@ import androidx.compose.ui.layout.Layout
 import androidx.compose.ui.layout.Placeable
 import androidx.compose.ui.unit.Dp
 import androidx.compose.ui.unit.dp
-import io.element.android.libraries.designsystem.ElementTextStyles
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.theme.ElementTheme
 import kotlin.math.max

@Composable
@@ -72,24 +72,26 @@ internal fun SimpleAlertDialogContent(
                    // If there is a 3rd item it should be at the end of the dialog
                    // Having this 3rd action is discouraged, see https://m3.material.io/components/dialogs/guidelines#e13b68f5-e367-4275-ad6f-c552ee8e358f
                    TextButton(onClick = onThirdButtonClicked) {
-                        Text(thirdButtonText)
+                        Text(
+                            text = thirdButtonText,
+                            style = ElementTheme.typography.fontBodyMdRegular,
+                        )
                    }
                }
                TextButton(onClick = onCancelClicked) {
-                    Text(cancelText)
+                    Text(
+                        text = cancelText,
+                        style = ElementTheme.typography.fontBodyMdRegular,
+                    )
                }
                if (submitText != null) {
-                    TextButton(
-                        onClick = {
-                            onSubmitClicked()
-                        },
-                    ) {
+                    TextButton(onClick = onSubmitClicked) {
                        Text(
-                            submitText,
+                            text = submitText,
                            style = if (emphasizeSubmitButton) {
-                                ElementTextStyles.Bold.subheadline
+                                ElementTheme.typography.fontBodyMdMedium
                            } else {
-                                MaterialTheme.typography.labelLarge
+                                ElementTheme.typography.fontBodyMdRegular
                            }
                        )
                    }
@@ -98,10 +100,18 @@ internal fun SimpleAlertDialogContent(
        },
        modifier = modifier,
        title = {
-            if (title != null) { Text(text = title) }
+            if (title != null) {
+                Text(
+                    text = title,
+                    style = ElementTheme.typography.fontHeadingSmRegular,
+                )
+            }
        },
        text = {
-            Text(content)
+            Text(
+                text = content,
+                style = ElementTheme.typography.fontBodyMdRegular,
+            )
        },
        shape = shape,
        containerColor = containerColor,
--- a/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/dialogs/RetryDialog.kt
+++ b/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/dialogs/RetryDialog.kt
@@ -29,6 +29,7 @@ import androidx.compose.ui.unit.Dp
 import io.element.android.libraries.designsystem.preview.ElementThemedPreview
 import io.element.android.libraries.designsystem.preview.PreviewGroup
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.theme.ElementTheme
 import io.element.android.libraries.ui.strings.CommonStrings

@Composable
@@ -51,19 +52,31 @@ fun RetryDialog(
        modifier = modifier,
        onDismissRequest = onDismiss,
        title = {
-            Text(title)
+            Text(
+                text = title,
+                style = ElementTheme.typography.fontHeadingSmRegular,
+            )
        },
        text = {
-            Text(content)
+            Text(
+                text = content,
+                style = ElementTheme.typography.fontBodyMdRegular,
+            )
        },
        confirmButton = {
            TextButton(onClick = onRetry) {
-                Text(retryText)
+                Text(
+                    text = retryText,
+                    style = ElementTheme.typography.fontBodyMdRegular,
+                )
            }
        },
        dismissButton = {
            TextButton(onClick = onDismiss) {
-                Text(dismissText)
+                Text(
+                    text = dismissText,
+                    style = ElementTheme.typography.fontBodyMdRegular,
+                )
            }
        },
        shape = shape,
--- a/libraries/textcomposer/src/main/kotlin/io/element/android/libraries/textcomposer/TextComposer.kt
+++ b/libraries/textcomposer/src/main/kotlin/io/element/android/libraries/textcomposer/TextComposer.kt
@@ -68,14 +68,11 @@ import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.input.VisualTransformation
 import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.text.style.TextOverflow
-import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
-import io.element.android.libraries.designsystem.ElementTextStyles
 import io.element.android.libraries.designsystem.VectorIcons
 import io.element.android.libraries.designsystem.modifiers.applyIf
 import io.element.android.libraries.designsystem.preview.DayNightPreviews
 import io.element.android.libraries.designsystem.preview.ElementPreview
-import io.element.android.libraries.designsystem.preview.ElementPreviewLight
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.Surface
 import io.element.android.libraries.designsystem.theme.components.Text
@@ -141,7 +138,7 @@ fun TextComposer(
            if (composerMode is MessageComposerMode.Special) {
                ComposerModeView(composerMode = composerMode, onResetComposerMode = onResetComposerMode)
            }
-            val defaultTypography = ElementTextStyles.Regular.callout.copy(textAlign = TextAlign.Start)
+            val defaultTypography = ElementTheme.typography.fontBodyLgRegular
            Box {
                BasicTextField(
                    modifier = Modifier