diff --git a/app/src/main/java/com/x8bit/bitwarden/ui/auth/feature/login/LoginScreen.kt b/app/src/main/java/com/x8bit/bitwarden/ui/auth/feature/login/LoginScreen.kt index 0b9eb75e5b..03faeeb49b 100644 --- a/app/src/main/java/com/x8bit/bitwarden/ui/auth/feature/login/LoginScreen.kt +++ b/app/src/main/java/com/x8bit/bitwarden/ui/auth/feature/login/LoginScreen.kt @@ -41,7 +41,7 @@ import com.x8bit.bitwarden.ui.platform.components.appbar.BitwardenTopAppBar import com.x8bit.bitwarden.ui.platform.components.appbar.action.BitwardenOverflowActionItem import com.x8bit.bitwarden.ui.platform.components.appbar.action.OverflowMenuItemData import com.x8bit.bitwarden.ui.platform.components.button.BitwardenFilledButton -import com.x8bit.bitwarden.ui.platform.components.button.BitwardenOutlinedButtonWithIcon +import com.x8bit.bitwarden.ui.platform.components.button.BitwardenOutlinedButton import com.x8bit.bitwarden.ui.platform.components.dialog.BasicDialogState import com.x8bit.bitwarden.ui.platform.components.dialog.BitwardenBasicDialog import com.x8bit.bitwarden.ui.platform.components.dialog.BitwardenLoadingDialog @@ -273,7 +273,7 @@ private fun LoginScreenContent( Spacer(modifier = Modifier.height(12.dp)) if (state.shouldShowLoginWithDevice) { - BitwardenOutlinedButtonWithIcon( + BitwardenOutlinedButton( label = stringResource(id = R.string.log_in_with_device), icon = rememberVectorPainter(id = R.drawable.ic_mobile), onClick = onLoginWithDeviceClick, @@ -286,7 +286,7 @@ private fun LoginScreenContent( Spacer(modifier = Modifier.height(12.dp)) } - BitwardenOutlinedButtonWithIcon( + BitwardenOutlinedButton( label = stringResource(id = R.string.log_in_sso), icon = rememberVectorPainter(id = R.drawable.ic_briefcase), onClick = onSingleSignOnClick, diff --git a/app/src/main/java/com/x8bit/bitwarden/ui/auth/feature/masterpasswordgenerator/MasterPasswordGeneratorScreen.kt b/app/src/main/java/com/x8bit/bitwarden/ui/auth/feature/masterpasswordgenerator/MasterPasswordGeneratorScreen.kt index df528b746d..65e1812470 100644 --- a/app/src/main/java/com/x8bit/bitwarden/ui/auth/feature/masterpasswordgenerator/MasterPasswordGeneratorScreen.kt +++ b/app/src/main/java/com/x8bit/bitwarden/ui/auth/feature/masterpasswordgenerator/MasterPasswordGeneratorScreen.kt @@ -30,7 +30,7 @@ import com.x8bit.bitwarden.R import com.x8bit.bitwarden.ui.platform.base.util.EventsEffect import com.x8bit.bitwarden.ui.platform.base.util.standardHorizontalMargin import com.x8bit.bitwarden.ui.platform.components.appbar.BitwardenTopAppBar -import com.x8bit.bitwarden.ui.platform.components.button.BitwardenFilledButtonWithIcon +import com.x8bit.bitwarden.ui.platform.components.button.BitwardenFilledButton import com.x8bit.bitwarden.ui.platform.components.button.BitwardenTextButton import com.x8bit.bitwarden.ui.platform.components.field.BitwardenTextField import com.x8bit.bitwarden.ui.platform.components.scaffold.BitwardenScaffold @@ -151,7 +151,7 @@ private fun MasterPasswordGeneratorContent( ) Spacer(modifier = Modifier.height(12.dp)) - BitwardenFilledButtonWithIcon( + BitwardenFilledButton( label = stringResource(R.string.generate_button_label), onClick = onGenerateNewPassword, icon = rememberVectorPainter(id = R.drawable.ic_generate), diff --git a/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenFilledButton.kt b/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenFilledButton.kt index 4440de530b..b52858f5a8 100644 --- a/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenFilledButton.kt +++ b/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenFilledButton.kt @@ -1,14 +1,22 @@ package com.x8bit.bitwarden.ui.platform.components.button +import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.PaddingValues +import androidx.compose.foundation.layout.Spacer +import androidx.compose.foundation.layout.width import androidx.compose.material3.Button +import androidx.compose.material3.ButtonColors +import androidx.compose.material3.Icon import androidx.compose.material3.Text import androidx.compose.runtime.Composable import androidx.compose.ui.Modifier +import androidx.compose.ui.graphics.painter.Painter import androidx.compose.ui.semantics.semantics import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.unit.dp +import com.x8bit.bitwarden.R import com.x8bit.bitwarden.ui.platform.components.button.color.bitwardenFilledButtonColors +import com.x8bit.bitwarden.ui.platform.components.util.rememberVectorPainter import com.x8bit.bitwarden.ui.platform.theme.BitwardenTheme /** @@ -17,6 +25,7 @@ import com.x8bit.bitwarden.ui.platform.theme.BitwardenTheme * @param label The label for the button. * @param onClick The callback when the button is clicked. * @param modifier The [Modifier] to be applied to the button. + * @param icon The icon for the button. * @param isEnabled Whether or not the button is enabled. */ @Composable @@ -24,18 +33,27 @@ fun BitwardenFilledButton( label: String, onClick: () -> Unit, modifier: Modifier = Modifier, + icon: Painter? = null, isEnabled: Boolean = true, + colors: ButtonColors = bitwardenFilledButtonColors(), ) { Button( - onClick = onClick, modifier = modifier.semantics(mergeDescendants = true) {}, + onClick = onClick, enabled = isEnabled, contentPadding = PaddingValues( vertical = 10.dp, horizontal = 24.dp, ), - colors = bitwardenFilledButtonColors(), + colors = colors, ) { + icon?.let { + Icon( + painter = icon, + contentDescription = null, + ) + Spacer(modifier = Modifier.width(8.dp)) + } Text( text = label, style = BitwardenTheme.typography.labelLarge, @@ -45,20 +63,31 @@ fun BitwardenFilledButton( @Preview @Composable -private fun BitwardenFilledButton_preview_isEnabled() { - BitwardenFilledButton( - label = "Label", - onClick = {}, - isEnabled = true, - ) -} - -@Preview -@Composable -private fun BitwardenFilledButton_preview_isNotEnabled() { - BitwardenFilledButton( - label = "Label", - onClick = {}, - isEnabled = false, - ) +private fun BitwardenFilledButton_preview() { + Column { + BitwardenFilledButton( + label = "Label", + onClick = {}, + icon = null, + isEnabled = true, + ) + BitwardenFilledButton( + label = "Label", + onClick = {}, + icon = rememberVectorPainter(id = R.drawable.ic_question_circle), + isEnabled = true, + ) + BitwardenFilledButton( + label = "Label", + onClick = {}, + icon = null, + isEnabled = false, + ) + BitwardenFilledButton( + label = "Label", + onClick = {}, + icon = rememberVectorPainter(id = R.drawable.ic_question_circle), + isEnabled = false, + ) + } } diff --git a/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenFilledButtonWithIcon.kt b/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenFilledButtonWithIcon.kt deleted file mode 100644 index 1571546b59..0000000000 --- a/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenFilledButtonWithIcon.kt +++ /dev/null @@ -1,72 +0,0 @@ -package com.x8bit.bitwarden.ui.platform.components.button - -import androidx.compose.foundation.layout.PaddingValues -import androidx.compose.foundation.layout.padding -import androidx.compose.material3.Button -import androidx.compose.material3.Icon -import androidx.compose.material3.Text -import androidx.compose.runtime.Composable -import androidx.compose.ui.Modifier -import androidx.compose.ui.graphics.painter.Painter -import androidx.compose.ui.semantics.semantics -import androidx.compose.ui.tooling.preview.Preview -import androidx.compose.ui.unit.dp -import com.x8bit.bitwarden.R -import com.x8bit.bitwarden.ui.platform.components.button.color.bitwardenFilledButtonColors -import com.x8bit.bitwarden.ui.platform.components.util.rememberVectorPainter -import com.x8bit.bitwarden.ui.platform.theme.BitwardenTheme - -/** - * Represents a Bitwarden-styled filled button with an icon. - * - * @param label The label for the button. - * @param icon The icon for the button. - * @param onClick The callback when the button is clicked. - * @param modifier The [Modifier] to be applied to the button. - * @param isEnabled Whether or not the button is enabled. - */ -@Composable -fun BitwardenFilledButtonWithIcon( - label: String, - icon: Painter, - onClick: () -> Unit, - modifier: Modifier = Modifier, - isEnabled: Boolean = true, -) { - Button( - onClick = onClick, - modifier = modifier - .semantics(mergeDescendants = true) { }, - enabled = isEnabled, - contentPadding = PaddingValues( - vertical = 10.dp, - horizontal = 24.dp, - ), - colors = bitwardenFilledButtonColors(), - ) { - Icon( - painter = icon, - contentDescription = null, - modifier = Modifier - .padding(end = 8.dp), - ) - - Text( - text = label, - style = BitwardenTheme.typography.labelLarge, - ) - } -} - -@Preview(showBackground = true) -@Composable -private fun BitwardenFilledButtonWithIcon_preview() { - BitwardenTheme { - BitwardenFilledButtonWithIcon( - label = "Test Button", - icon = rememberVectorPainter(id = R.drawable.ic_question_circle), - onClick = {}, - isEnabled = true, - ) - } -} diff --git a/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenFilledErrorButton.kt b/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenFilledErrorButton.kt index 49ae040316..1aa7a1fe62 100644 --- a/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenFilledErrorButton.kt +++ b/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenFilledErrorButton.kt @@ -1,15 +1,14 @@ package com.x8bit.bitwarden.ui.platform.components.button -import androidx.compose.foundation.layout.PaddingValues +import androidx.compose.foundation.layout.Column import androidx.compose.material3.Button -import androidx.compose.material3.Text import androidx.compose.runtime.Composable import androidx.compose.ui.Modifier -import androidx.compose.ui.semantics.semantics +import androidx.compose.ui.graphics.painter.Painter import androidx.compose.ui.tooling.preview.Preview -import androidx.compose.ui.unit.dp +import com.x8bit.bitwarden.R import com.x8bit.bitwarden.ui.platform.components.button.color.bitwardenFilledErrorButtonColors -import com.x8bit.bitwarden.ui.platform.theme.BitwardenTheme +import com.x8bit.bitwarden.ui.platform.components.util.rememberVectorPainter /** * Represents a Bitwarden-styled filled [Button] for error scenarios. @@ -17,6 +16,7 @@ import com.x8bit.bitwarden.ui.platform.theme.BitwardenTheme * @param label The label for the button. * @param onClick The callback when the button is clicked. * @param modifier The [Modifier] to be applied to the button. + * @param icon The icon for the button. * @param isEnabled Whether or not the button is enabled. */ @Composable @@ -24,44 +24,45 @@ fun BitwardenFilledErrorButton( label: String, onClick: () -> Unit, modifier: Modifier = Modifier, + icon: Painter? = null, isEnabled: Boolean = true, ) { - Button( + BitwardenFilledButton( + label = label, onClick = onClick, - modifier = modifier.semantics(mergeDescendants = true) {}, - enabled = isEnabled, - contentPadding = PaddingValues( - vertical = 10.dp, - horizontal = 24.dp, - ), + icon = icon, + modifier = modifier, + isEnabled = isEnabled, colors = bitwardenFilledErrorButtonColors(), - ) { - Text( - text = label, - style = BitwardenTheme.typography.labelLarge, - ) - } + ) } @Preview @Composable -private fun BitwardenErrorButton_preview_isEnabled() { - BitwardenTheme { +private fun BitwardenErrorButton_preview() { + Column { BitwardenFilledErrorButton( label = "Label", onClick = {}, + icon = null, isEnabled = true, ) - } -} - -@Preview(showBackground = true) -@Composable -private fun BitwardenErrorButton_preview_isNotEnabled() { - BitwardenTheme { BitwardenFilledErrorButton( label = "Label", onClick = {}, + icon = rememberVectorPainter(id = R.drawable.ic_question_circle), + isEnabled = true, + ) + BitwardenFilledErrorButton( + label = "Label", + onClick = {}, + icon = null, + isEnabled = false, + ) + BitwardenFilledErrorButton( + label = "Label", + onClick = {}, + icon = rememberVectorPainter(id = R.drawable.ic_question_circle), isEnabled = false, ) } diff --git a/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenFilledTonalButton.kt b/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenFilledTonalButton.kt index 3a8b1e87f3..1b649ca6e0 100644 --- a/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenFilledTonalButton.kt +++ b/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenFilledTonalButton.kt @@ -1,20 +1,28 @@ package com.x8bit.bitwarden.ui.platform.components.button +import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.PaddingValues -import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.layout.Spacer +import androidx.compose.foundation.layout.width import androidx.compose.material3.Button +import androidx.compose.material3.Icon import androidx.compose.material3.Text import androidx.compose.runtime.Composable import androidx.compose.ui.Modifier +import androidx.compose.ui.graphics.painter.Painter +import androidx.compose.ui.semantics.semantics import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.unit.dp +import com.x8bit.bitwarden.R import com.x8bit.bitwarden.ui.platform.components.button.color.bitwardenFilledTonalButtonColors +import com.x8bit.bitwarden.ui.platform.components.util.rememberVectorPainter import com.x8bit.bitwarden.ui.platform.theme.BitwardenTheme /** * A filled tonal button for the Bitwarden UI with a customized appearance. * * @param label The text to be displayed on the button. + * @param icon The icon for the button. * @param onClick A lambda which will be invoked when the button is clicked. * @param isEnabled Whether or not the button is enabled. * @param modifier A [Modifier] for this composable, allowing for adjustments to its appearance @@ -25,9 +33,11 @@ fun BitwardenFilledTonalButton( label: String, onClick: () -> Unit, modifier: Modifier = Modifier, + icon: Painter? = null, isEnabled: Boolean = true, ) { Button( + modifier = modifier.semantics(mergeDescendants = true) { }, onClick = onClick, contentPadding = PaddingValues( vertical = 10.dp, @@ -35,8 +45,14 @@ fun BitwardenFilledTonalButton( ), enabled = isEnabled, colors = bitwardenFilledTonalButtonColors(), - modifier = modifier, ) { + icon?.let { + Icon( + painter = icon, + contentDescription = null, + ) + Spacer(modifier = Modifier.width(8.dp)) + } Text( text = label, style = BitwardenTheme.typography.labelLarge, @@ -47,11 +63,30 @@ fun BitwardenFilledTonalButton( @Preview(showBackground = true) @Composable private fun BitwardenFilledTonalButton_preview() { - BitwardenTheme { + Column { BitwardenFilledTonalButton( - label = "Sample Text", + label = "Label", onClick = {}, - modifier = Modifier.padding(horizontal = 16.dp), + icon = null, + isEnabled = true, + ) + BitwardenFilledTonalButton( + label = "Label", + onClick = {}, + icon = rememberVectorPainter(id = R.drawable.ic_question_circle), + isEnabled = true, + ) + BitwardenFilledTonalButton( + label = "Label", + onClick = {}, + icon = null, + isEnabled = false, + ) + BitwardenFilledTonalButton( + label = "Label", + onClick = {}, + icon = rememberVectorPainter(id = R.drawable.ic_question_circle), + isEnabled = false, ) } } diff --git a/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenFilledTonalButtonWithIcon.kt b/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenFilledTonalButtonWithIcon.kt deleted file mode 100644 index 9ee84ecefb..0000000000 --- a/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenFilledTonalButtonWithIcon.kt +++ /dev/null @@ -1,70 +0,0 @@ -package com.x8bit.bitwarden.ui.platform.components.button - -import androidx.compose.foundation.layout.PaddingValues -import androidx.compose.foundation.layout.padding -import androidx.compose.material3.Button -import androidx.compose.material3.Icon -import androidx.compose.material3.Text -import androidx.compose.runtime.Composable -import androidx.compose.ui.Modifier -import androidx.compose.ui.graphics.painter.Painter -import androidx.compose.ui.tooling.preview.Preview -import androidx.compose.ui.unit.dp -import com.x8bit.bitwarden.R -import com.x8bit.bitwarden.ui.platform.components.button.color.bitwardenFilledTonalButtonColors -import com.x8bit.bitwarden.ui.platform.components.util.rememberVectorPainter -import com.x8bit.bitwarden.ui.platform.theme.BitwardenTheme - -/** - * A filled tonal button for the Bitwarden UI with a customized appearance and an icon. - * - * @param label The text to be displayed on the button. - * @param icon The icon for the button. - * @param onClick A lambda which will be invoked when the button is clicked. - * @param modifier A [Modifier] for this composable, allowing for adjustments to its appearance - * or behavior. This can be used to apply padding, layout, and other Modifiers. - * @param isEnabled Whether or not the button is enabled. - */ -@Composable -fun BitwardenFilledTonalButtonWithIcon( - label: String, - icon: Painter, - onClick: () -> Unit, - modifier: Modifier = Modifier, - isEnabled: Boolean = true, -) { - Button( - onClick = onClick, - contentPadding = PaddingValues( - vertical = 10.dp, - horizontal = 24.dp, - ), - colors = bitwardenFilledTonalButtonColors(), - modifier = modifier, - enabled = isEnabled, - ) { - Icon( - painter = icon, - contentDescription = null, - modifier = Modifier - .padding(end = 8.dp), - ) - Text( - text = label, - style = BitwardenTheme.typography.labelLarge, - ) - } -} - -@Preview(showBackground = true) -@Composable -private fun BitwardenFilledTonalButtonWithIcon_preview() { - BitwardenTheme { - BitwardenFilledTonalButtonWithIcon( - label = "Sample Text", - icon = rememberVectorPainter(id = R.drawable.ic_question_circle), - onClick = {}, - modifier = Modifier.padding(horizontal = 16.dp), - ) - } -} diff --git a/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenOutlinedButton.kt b/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenOutlinedButton.kt index c490433ddd..d30a5ba0cb 100644 --- a/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenOutlinedButton.kt +++ b/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenOutlinedButton.kt @@ -1,18 +1,25 @@ package com.x8bit.bitwarden.ui.platform.components.button import androidx.compose.foundation.BorderStroke +import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.PaddingValues +import androidx.compose.foundation.layout.Spacer +import androidx.compose.foundation.layout.width import androidx.compose.material3.ButtonColors +import androidx.compose.material3.Icon import androidx.compose.material3.OutlinedButton import androidx.compose.material3.Text import androidx.compose.runtime.Composable import androidx.compose.runtime.Immutable import androidx.compose.ui.Modifier import androidx.compose.ui.graphics.Color +import androidx.compose.ui.graphics.painter.Painter import androidx.compose.ui.semantics.semantics import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.unit.dp +import com.x8bit.bitwarden.R import com.x8bit.bitwarden.ui.platform.components.button.color.bitwardenOutlinedButtonColors +import com.x8bit.bitwarden.ui.platform.components.util.rememberVectorPainter import com.x8bit.bitwarden.ui.platform.theme.BitwardenTheme /** @@ -21,6 +28,7 @@ import com.x8bit.bitwarden.ui.platform.theme.BitwardenTheme * @param label The label for the button. * @param onClick The callback when the button is clicked. * @param modifier The [Modifier] to be applied to the button. + * @param icon The icon for the button. * @param isEnabled Whether or not the button is enabled. */ @Composable @@ -28,13 +36,13 @@ fun BitwardenOutlinedButton( label: String, onClick: () -> Unit, modifier: Modifier = Modifier, + icon: Painter? = null, isEnabled: Boolean = true, colors: BitwardenOutlinedButtonColors = bitwardenOutlinedButtonColors(), ) { OutlinedButton( + modifier = modifier.semantics(mergeDescendants = true) { }, onClick = onClick, - modifier = modifier - .semantics(mergeDescendants = true) { }, enabled = isEnabled, contentPadding = PaddingValues( vertical = 10.dp, @@ -50,6 +58,13 @@ fun BitwardenOutlinedButton( }, ), ) { + icon?.let { + Icon( + painter = icon, + contentDescription = null, + ) + Spacer(modifier = Modifier.width(8.dp)) + } Text( text = label, style = BitwardenTheme.typography.labelLarge, @@ -69,20 +84,31 @@ data class BitwardenOutlinedButtonColors( @Preview @Composable -private fun BitwardenOutlinedButton_preview_isEnabled() { - BitwardenOutlinedButton( - label = "Label", - onClick = {}, - isEnabled = true, - ) -} - -@Preview -@Composable -private fun BitwardenOutlinedButton_preview_isNotEnabled() { - BitwardenOutlinedButton( - label = "Label", - onClick = {}, - isEnabled = false, - ) +private fun BitwardenOutlinedButton_preview() { + Column { + BitwardenOutlinedButton( + label = "Label", + onClick = {}, + icon = null, + isEnabled = true, + ) + BitwardenOutlinedButton( + label = "Label", + onClick = {}, + icon = rememberVectorPainter(id = R.drawable.ic_question_circle), + isEnabled = true, + ) + BitwardenOutlinedButton( + label = "Label", + onClick = {}, + icon = null, + isEnabled = false, + ) + BitwardenOutlinedButton( + label = "Label", + onClick = {}, + icon = rememberVectorPainter(id = R.drawable.ic_question_circle), + isEnabled = false, + ) + } } diff --git a/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenOutlinedButtonWithIcon.kt b/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenOutlinedButtonWithIcon.kt deleted file mode 100644 index ec4813beab..0000000000 --- a/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenOutlinedButtonWithIcon.kt +++ /dev/null @@ -1,91 +0,0 @@ -package com.x8bit.bitwarden.ui.platform.components.button - -import androidx.compose.foundation.BorderStroke -import androidx.compose.foundation.layout.PaddingValues -import androidx.compose.foundation.layout.padding -import androidx.compose.material3.Icon -import androidx.compose.material3.OutlinedButton -import androidx.compose.material3.Text -import androidx.compose.runtime.Composable -import androidx.compose.ui.Modifier -import androidx.compose.ui.graphics.painter.Painter -import androidx.compose.ui.semantics.semantics -import androidx.compose.ui.tooling.preview.Preview -import androidx.compose.ui.unit.dp -import com.x8bit.bitwarden.R -import com.x8bit.bitwarden.ui.platform.components.button.color.bitwardenOutlinedButtonColors -import com.x8bit.bitwarden.ui.platform.components.util.rememberVectorPainter -import com.x8bit.bitwarden.ui.platform.theme.BitwardenTheme - -/** - * Represents a Bitwarden-styled filled [OutlinedButton] with an icon. - * - * @param label The label for the button. - * @param icon The icon for the button. - * @param onClick The callback when the button is clicked. - * @param modifier The [Modifier] to be applied to the button. - * @param isEnabled Whether or not the button is enabled. - */ -@Composable -fun BitwardenOutlinedButtonWithIcon( - label: String, - icon: Painter, - onClick: () -> Unit, - modifier: Modifier = Modifier, - isEnabled: Boolean = true, - colors: BitwardenOutlinedButtonColors = bitwardenOutlinedButtonColors(), -) { - OutlinedButton( - onClick = onClick, - modifier = modifier - .semantics(mergeDescendants = true) { }, - enabled = isEnabled, - contentPadding = PaddingValues( - vertical = 10.dp, - horizontal = 24.dp, - ), - colors = colors.materialButtonColors, - border = BorderStroke( - width = 1.dp, - color = if (isEnabled) { - colors.outlineBorderColor - } else { - colors.outlinedDisabledBorderColor - }, - ), - ) { - Icon( - painter = icon, - contentDescription = null, - modifier = Modifier - .padding(end = 8.dp), - ) - - Text( - text = label, - style = BitwardenTheme.typography.labelLarge, - ) - } -} - -@Preview -@Composable -private fun BitwardenOutlinedButtonWithIcon_preview_isEnabled() { - BitwardenOutlinedButtonWithIcon( - label = "Label", - icon = rememberVectorPainter(id = R.drawable.ic_light_bulb), - onClick = {}, - isEnabled = true, - ) -} - -@Preview -@Composable -private fun BitwardenOutlinedButtonWithIcon_preview_isNotEnabled() { - BitwardenOutlinedButtonWithIcon( - label = "Label", - icon = rememberVectorPainter(id = R.drawable.ic_light_bulb), - onClick = {}, - isEnabled = false, - ) -} diff --git a/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenOutlinedErrorButton.kt b/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenOutlinedErrorButton.kt index c5cbea2c75..cd7c75afd0 100644 --- a/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenOutlinedErrorButton.kt +++ b/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenOutlinedErrorButton.kt @@ -1,15 +1,14 @@ package com.x8bit.bitwarden.ui.platform.components.button -import androidx.compose.foundation.BorderStroke -import androidx.compose.foundation.layout.PaddingValues +import androidx.compose.foundation.layout.Column import androidx.compose.material3.OutlinedButton -import androidx.compose.material3.Text import androidx.compose.runtime.Composable import androidx.compose.ui.Modifier -import androidx.compose.ui.semantics.semantics +import androidx.compose.ui.graphics.painter.Painter import androidx.compose.ui.tooling.preview.Preview -import androidx.compose.ui.unit.dp -import com.x8bit.bitwarden.ui.platform.components.button.color.bitwardenOutlinedErrorButtonColors +import com.x8bit.bitwarden.R +import com.x8bit.bitwarden.ui.platform.components.button.color.bitwardenOutlinedButtonColors +import com.x8bit.bitwarden.ui.platform.components.util.rememberVectorPainter import com.x8bit.bitwarden.ui.platform.theme.BitwardenTheme /** @@ -18,6 +17,7 @@ import com.x8bit.bitwarden.ui.platform.theme.BitwardenTheme * @param label The label for the button. * @param onClick The callback when the button is clicked. * @param modifier The [Modifier] to be applied to the button. + * @param icon The icon for the button. * @param isEnabled Whether or not the button is enabled. */ @Composable @@ -25,47 +25,50 @@ fun BitwardenOutlinedErrorButton( label: String, onClick: () -> Unit, modifier: Modifier = Modifier, + icon: Painter? = null, isEnabled: Boolean = true, ) { - OutlinedButton( - modifier = modifier.semantics(mergeDescendants = true) { }, + BitwardenOutlinedButton( + label = label, onClick = onClick, - enabled = isEnabled, - contentPadding = PaddingValues( - vertical = 10.dp, - horizontal = 24.dp, + icon = icon, + modifier = modifier, + isEnabled = isEnabled, + colors = bitwardenOutlinedButtonColors( + contentColor = BitwardenTheme.colorScheme.status.error, + outlineColor = BitwardenTheme.colorScheme.status.error, + outlineColorDisabled = BitwardenTheme.colorScheme.status.error.copy(alpha = 0.12f), ), - colors = bitwardenOutlinedErrorButtonColors(), - border = BorderStroke( - width = 1.dp, - color = BitwardenTheme.colorScheme.status.error.copy( - alpha = if (isEnabled) 1f else 0.12f, - ), - ), - ) { - Text( - text = label, - style = BitwardenTheme.typography.labelLarge, + ) +} + +@Preview +@Composable +private fun BBitwardenOutlinedErrorButton_preview() { + Column { + BitwardenOutlinedErrorButton( + label = "Label", + onClick = {}, + icon = null, + isEnabled = true, + ) + BitwardenOutlinedErrorButton( + label = "Label", + onClick = {}, + icon = rememberVectorPainter(id = R.drawable.ic_question_circle), + isEnabled = true, + ) + BitwardenOutlinedErrorButton( + label = "Label", + onClick = {}, + icon = null, + isEnabled = false, + ) + BitwardenOutlinedErrorButton( + label = "Label", + onClick = {}, + icon = rememberVectorPainter(id = R.drawable.ic_question_circle), + isEnabled = false, ) } } - -@Preview -@Composable -private fun BitwardenOutlinedErrorButton_preview_isEnabled() { - BitwardenOutlinedErrorButton( - label = "Label", - onClick = {}, - isEnabled = true, - ) -} - -@Preview -@Composable -private fun BBitwardenOutlinedErrorButton_preview_isNotEnabled() { - BitwardenOutlinedErrorButton( - label = "Label", - onClick = {}, - isEnabled = false, - ) -} diff --git a/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenTextButton.kt b/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenTextButton.kt index 496830db88..f243e5bf21 100644 --- a/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenTextButton.kt +++ b/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenTextButton.kt @@ -1,11 +1,13 @@ package com.x8bit.bitwarden.ui.platform.components.button +import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.PaddingValues import androidx.compose.material3.Text import androidx.compose.material3.TextButton import androidx.compose.runtime.Composable import androidx.compose.ui.Modifier import androidx.compose.ui.graphics.Color +import androidx.compose.ui.semantics.semantics import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.unit.dp import com.x8bit.bitwarden.ui.platform.components.button.color.bitwardenTextButtonColors @@ -28,8 +30,8 @@ fun BitwardenTextButton( labelTextColor: Color = BitwardenTheme.colorScheme.outlineButton.foreground, ) { TextButton( + modifier = modifier.semantics(mergeDescendants = true) {}, onClick = onClick, - modifier = modifier, enabled = isEnabled, contentPadding = PaddingValues( vertical = 10.dp, @@ -47,8 +49,16 @@ fun BitwardenTextButton( @Preview @Composable private fun BitwardenTextButton_preview() { - BitwardenTextButton( - label = "Label", - onClick = {}, - ) + Column { + BitwardenTextButton( + label = "Label", + onClick = {}, + isEnabled = true, + ) + BitwardenTextButton( + label = "Label", + onClick = {}, + isEnabled = false, + ) + } } diff --git a/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/color/BitwardenButtonColors.kt b/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/color/BitwardenButtonColors.kt index 6370ed8a7b..804aa05b04 100644 --- a/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/color/BitwardenButtonColors.kt +++ b/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/color/BitwardenButtonColors.kt @@ -59,17 +59,6 @@ fun bitwardenOutlinedButtonColors( outlinedDisabledBorderColor = outlineColorDisabled, ) -/** - * Provides a default set of Bitwarden-styled colors for an outlined error button. - */ -@Composable -fun bitwardenOutlinedErrorButtonColors(): ButtonColors = ButtonColors( - containerColor = Color.Transparent, - contentColor = BitwardenTheme.colorScheme.status.error, - disabledContainerColor = Color.Transparent, - disabledContentColor = BitwardenTheme.colorScheme.outlineButton.foregroundDisabled, -) - /** * Provides a default set of Bitwarden-styled colors for a text button. */ diff --git a/app/src/main/java/com/x8bit/bitwarden/ui/platform/feature/settings/accountsecurity/pendingrequests/PendingRequestsScreen.kt b/app/src/main/java/com/x8bit/bitwarden/ui/platform/feature/settings/accountsecurity/pendingrequests/PendingRequestsScreen.kt index f91768f37a..52d58190e9 100644 --- a/app/src/main/java/com/x8bit/bitwarden/ui/platform/feature/settings/accountsecurity/pendingrequests/PendingRequestsScreen.kt +++ b/app/src/main/java/com/x8bit/bitwarden/ui/platform/feature/settings/accountsecurity/pendingrequests/PendingRequestsScreen.kt @@ -45,7 +45,7 @@ import com.x8bit.bitwarden.ui.platform.base.util.LivecycleEventEffect import com.x8bit.bitwarden.ui.platform.base.util.bottomDivider import com.x8bit.bitwarden.ui.platform.base.util.standardHorizontalMargin import com.x8bit.bitwarden.ui.platform.components.appbar.BitwardenTopAppBar -import com.x8bit.bitwarden.ui.platform.components.button.BitwardenOutlinedButtonWithIcon +import com.x8bit.bitwarden.ui.platform.components.button.BitwardenOutlinedButton import com.x8bit.bitwarden.ui.platform.components.content.BitwardenErrorContent import com.x8bit.bitwarden.ui.platform.components.content.BitwardenLoadingContent import com.x8bit.bitwarden.ui.platform.components.dialog.BitwardenTwoButtonDialog @@ -212,7 +212,7 @@ private fun PendingRequestsContent( } Spacer(modifier = Modifier.height(16.dp)) - BitwardenOutlinedButtonWithIcon( + BitwardenOutlinedButton( label = stringResource(id = R.string.decline_all_requests), icon = rememberVectorPainter(id = R.drawable.ic_trash), onClick = { shouldShowDeclineAllRequestsConfirm = true }, diff --git a/app/src/main/java/com/x8bit/bitwarden/ui/tools/feature/send/SendEmpty.kt b/app/src/main/java/com/x8bit/bitwarden/ui/tools/feature/send/SendEmpty.kt index 5383a03153..52f37ef039 100644 --- a/app/src/main/java/com/x8bit/bitwarden/ui/tools/feature/send/SendEmpty.kt +++ b/app/src/main/java/com/x8bit/bitwarden/ui/tools/feature/send/SendEmpty.kt @@ -21,7 +21,7 @@ import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.unit.dp import com.x8bit.bitwarden.R import com.x8bit.bitwarden.ui.platform.base.util.standardHorizontalMargin -import com.x8bit.bitwarden.ui.platform.components.button.BitwardenFilledButtonWithIcon +import com.x8bit.bitwarden.ui.platform.components.button.BitwardenFilledButton import com.x8bit.bitwarden.ui.platform.components.card.BitwardenInfoCalloutCard import com.x8bit.bitwarden.ui.platform.components.util.rememberVectorPainter import com.x8bit.bitwarden.ui.platform.theme.BitwardenTheme @@ -81,7 +81,7 @@ fun SendEmpty( Spacer(modifier = Modifier.height(24.dp)) - BitwardenFilledButtonWithIcon( + BitwardenFilledButton( onClick = onAddItemClick, label = stringResource(id = R.string.add_a_send), modifier = Modifier.standardHorizontalMargin(), diff --git a/app/src/main/java/com/x8bit/bitwarden/ui/vault/feature/addedit/VaultAddEditLoginItems.kt b/app/src/main/java/com/x8bit/bitwarden/ui/vault/feature/addedit/VaultAddEditLoginItems.kt index 072234e3de..57ea308b9c 100644 --- a/app/src/main/java/com/x8bit/bitwarden/ui/vault/feature/addedit/VaultAddEditLoginItems.kt +++ b/app/src/main/java/com/x8bit/bitwarden/ui/vault/feature/addedit/VaultAddEditLoginItems.kt @@ -20,7 +20,6 @@ import com.x8bit.bitwarden.R import com.x8bit.bitwarden.ui.platform.base.util.Text import com.x8bit.bitwarden.ui.platform.components.button.BitwardenFilledIconButton import com.x8bit.bitwarden.ui.platform.components.button.BitwardenOutlinedButton -import com.x8bit.bitwarden.ui.platform.components.button.BitwardenOutlinedButtonWithIcon import com.x8bit.bitwarden.ui.platform.components.button.BitwardenStandardIconButton import com.x8bit.bitwarden.ui.platform.components.dialog.BitwardenTwoButtonDialog import com.x8bit.bitwarden.ui.platform.components.dropdown.BitwardenMultiSelectButton @@ -144,7 +143,7 @@ fun LazyListScope.vaultAddEditLoginItems( } else { item { Spacer(modifier = Modifier.height(16.dp)) - BitwardenOutlinedButtonWithIcon( + BitwardenOutlinedButton( label = stringResource(id = R.string.setup_totp), icon = rememberVectorPainter(id = R.drawable.ic_light_bulb), onClick = onTotpSetupClick, diff --git a/app/src/main/java/com/x8bit/bitwarden/ui/vault/feature/vault/VaultNoItems.kt b/app/src/main/java/com/x8bit/bitwarden/ui/vault/feature/vault/VaultNoItems.kt index 0591ce7516..be46062bc0 100644 --- a/app/src/main/java/com/x8bit/bitwarden/ui/vault/feature/vault/VaultNoItems.kt +++ b/app/src/main/java/com/x8bit/bitwarden/ui/vault/feature/vault/VaultNoItems.kt @@ -22,7 +22,7 @@ import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.unit.dp import com.x8bit.bitwarden.R import com.x8bit.bitwarden.ui.platform.base.util.standardHorizontalMargin -import com.x8bit.bitwarden.ui.platform.components.button.BitwardenFilledButtonWithIcon +import com.x8bit.bitwarden.ui.platform.components.button.BitwardenFilledButton import com.x8bit.bitwarden.ui.platform.components.card.BitwardenInfoCalloutCard import com.x8bit.bitwarden.ui.platform.components.util.rememberVectorPainter import com.x8bit.bitwarden.ui.platform.theme.BitwardenTheme @@ -86,7 +86,7 @@ fun VaultNoItems( Spacer(modifier = Modifier.height(24.dp)) - BitwardenFilledButtonWithIcon( + BitwardenFilledButton( icon = rememberVectorPainter(R.drawable.ic_plus_small), modifier = Modifier.standardHorizontalMargin(), onClick = addItemClickAction,