Updated on 2026-08-14

2023-09-11 10:33:31 +03:00 · 2023-09-11 10:33:31 +03:00 · be02ae3fa3
commit be02ae3fa3
parent 1b3d5ca620 5b16fdc96e
91 changed files with 577 additions and 296 deletions
--- a/core/ui/src/main/java/com/tangem/core/ui/components/buttons/common/TangemButton.kt
+++ b/core/ui/src/main/java/com/tangem/core/ui/components/buttons/common/TangemButton.kt
@ -1,12 +1,20 @@
 package com.tangem.core.ui.components.buttons.common

-import androidx.compose.foundation.layout.*
+import androidx.compose.foundation.layout.RowScope
+import androidx.compose.foundation.layout.heightIn
+import androidx.compose.foundation.layout.requiredSizeIn
 import androidx.compose.material.*
 import androidx.compose.runtime.Composable
-import androidx.compose.ui.Alignment
+import androidx.compose.runtime.remember
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.composed
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.text.TextStyle
+import androidx.compose.ui.text.style.TextAlign
+import androidx.compose.ui.text.style.TextOverflow
+import androidx.compose.ui.unit.Dp
+import androidx.compose.ui.unit.dp
+import com.tangem.core.ui.components.SpacerW
 import com.tangem.core.ui.res.TangemTheme

@Suppress("LongParameterList")
@ -30,67 +38,77 @@ fun TangemButton(
        elevation = elevation,
        shape = size.toShape(),
        colors = colors,
-        contentPadding = if (showProgress) ButtonDefaults.ContentPadding else size.toContentPadding(icon = icon),
+        contentPadding = size.toContentPadding(icon = icon),
    ) {
-        ButtonContent(
-            text = text,
-            textStyle = textStyle,
+        ButtonContentContainer(
            buttonIcon = icon,
-            colors = colors,
+            iconPadding = size.toIconPadding(),
            showProgress = showProgress,
-            enabled = enabled,
-            size = size,
+            progressIndicator = {
+                CircularProgressIndicator(
+                    modifier = Modifier.buttonContentSize(textStyle),
+                    color = colors.contentColor(enabled = enabled).value,
+                    strokeWidth = TangemTheme.dimens.size4,
+                )
+            },
+            text = {
+                Text(
+                    modifier = Modifier.alignByBaseline(),
+                    text = text,
+                    style = textStyle,
+                    color = colors.contentColor(enabled = enabled).value,
+                    textAlign = TextAlign.Center,
+                    maxLines = 1,
+                    overflow = TextOverflow.Ellipsis,
+                )
+            },
+            icon = { iconResId ->
+                Icon(
+                    modifier = Modifier.buttonContentSize(textStyle),
+                    painter = painterResource(id = iconResId),
+                    tint = colors.contentColor(enabled = enabled).value,
+                    contentDescription = null,
+                )
+            },
        )
    }
 }

@Suppress("LongParameterList")
@Composable
-private fun ButtonContent(
-    text: String,
-    textStyle: TextStyle,
+private inline fun RowScope.ButtonContentContainer(
    buttonIcon: TangemButtonIconPosition,
-    colors: ButtonColors,
-    size: TangemButtonSize,
-    enabled: Boolean,
+    iconPadding: Dp,
    showProgress: Boolean,
+    progressIndicator: @Composable RowScope.() -> Unit,
+    text: @Composable RowScope.() -> Unit,
+    icon: @Composable RowScope.(Int) -> Unit,
 ) {
-    val icon = @Composable { iconResId: Int ->
-        Icon(
-            modifier = Modifier.size(TangemTheme.dimens.size20),
-            painter = painterResource(id = iconResId),
-            tint = colors.contentColor(enabled = enabled).value,
-            contentDescription = null,
-        )
+    if (showProgress) {
+        progressIndicator()
+    } else {
+        if (buttonIcon is TangemButtonIconPosition.Start) {
+            icon(buttonIcon.iconResId)
+            SpacerW(width = iconPadding)
+        }
+        text()
+        if (buttonIcon is TangemButtonIconPosition.End) {
+            SpacerW(width = iconPadding)
+            icon(buttonIcon.iconResId)
+        }
+    }
+}
+
+private fun Modifier.buttonContentSize(buttonTextStyle: TextStyle): Modifier = composed {
+    val minContentElementSize = TangemTheme.dimens.size20
+    val maxContentElementSize = remember(key1 = buttonTextStyle.lineHeight) {
+        buttonTextStyle.lineHeight.value.dp + 4.dp
    }

-    if (showProgress) {
-        Box(modifier = Modifier.wrapContentSize()) {
-            CircularProgressIndicator(
-                modifier = Modifier
-                    .align(Alignment.Center)
-                    .size(TangemTheme.dimens.size24),
-                color = colors.contentColor(enabled = enabled).value,
-                strokeWidth = TangemTheme.dimens.size4,
-            )
-        }
-    } else {
-        Row(
-            verticalAlignment = Alignment.CenterVertically,
-            horizontalArrangement = Arrangement.spacedBy(size.toIconPadding()),
-        ) {
-            if (buttonIcon is TangemButtonIconPosition.Start) {
-                icon(buttonIcon.iconResId)
-            }
-            Text(
-                text = text,
-                style = textStyle,
-                color = colors.contentColor(enabled = enabled).value,
-                maxLines = 1,
-            )
-            if (buttonIcon is TangemButtonIconPosition.End) {
-                icon(buttonIcon.iconResId)
-            }
-        }
-    }
+    this.requiredSizeIn(
+        minWidth = minContentElementSize,
+        minHeight = minContentElementSize,
+        maxWidth = maxContentElementSize,
+        maxHeight = maxContentElementSize,
+    )
 }
--- a/core/ui/src/main/java/com/tangem/core/ui/components/buttons/common/TangemButtonSize.kt
+++ b/core/ui/src/main/java/com/tangem/core/ui/components/buttons/common/TangemButtonSize.kt
@ -40,7 +40,7 @@ internal fun TangemButtonSize.toShape(): Shape = when (this) {
@Composable
@ReadOnlyComposable
 internal fun TangemButtonSize.toIconPadding(): Dp = when (this) {
-    TangemButtonSize.Default -> TangemTheme.dimens.spacing8
+    TangemButtonSize.Default -> TangemTheme.dimens.spacing4
    TangemButtonSize.Text -> TangemTheme.dimens.spacing8
    TangemButtonSize.Selector -> 0.dp
    TangemButtonSize.Action,
--- a/core/ui/src/main/res/drawable/ic_tangem_24.xml
+++ b/core/ui/src/main/res/drawable/ic_tangem_24.xml
@ -5,12 +5,12 @@
    android:viewportWidth="24"
    android:viewportHeight="24">
  <path
-      android:fillColor="#000000"
-      android:pathData="M4,3.9C4,3.403 4.421,3 4.941,3H19.059C19.579,3 20,3.403 20,3.9V8.4H4V3.9Z" />
+      android:pathData="M15.682,3.25H8.318C7.157,3.25 6.576,3.25 6.132,3.476C5.742,3.675 5.424,3.992 5.226,4.382C5,4.826 5,5.407 5,6.568V7.8H19V6.568C19,5.407 19,4.826 18.774,4.382C18.575,3.992 18.258,3.674 17.868,3.476C17.424,3.25 16.844,3.25 15.682,3.25Z"
+      android:fillColor="#1E1E1E"/>
  <path
-      android:fillColor="#000000"
-      android:pathData="M4,12H9.647V21H4.941C4.421,21 4,20.597 4,20.1V12Z" />
+      android:pathData="M14.333,11.65H19V17.432C19,18.594 19,19.174 18.773,19.618C18.574,20.008 18.258,20.326 17.868,20.524C17.423,20.75 16.843,20.75 15.681,20.75H14.334L14.333,11.65Z"
+      android:fillColor="#1E1E1E"/>
  <path
-      android:fillColor="#000000"
-      android:pathData="M20,12H14.353V21H19.059C19.579,21 20,20.597 20,20.1V12Z" />
+      android:pathData="M5,11.65H9.666V20.75H8.318C7.157,20.75 6.576,20.75 6.132,20.524C5.742,20.326 5.425,20.008 5.226,19.618C5,19.174 5,18.594 5,17.432V11.65Z"
+      android:fillColor="#1E1E1E"/>
 </vector>