PM-17414: Combine circle and stepper button styles

bitwarden · Feb 3, 2025 · 8ee8254 · 8ee8254
1 parent e8bef73
commit 8ee8254
Show file tree

Hide file tree

Showing 4 changed files with 9 additions and 42 deletions.
diff --git a/BitwardenShared/UI/Platform/Application/Appearance/Styles/ButtonStylesTests.swift b/BitwardenShared/UI/Platform/Application/Appearance/Styles/ButtonStylesTests.swift
@@ -76,7 +76,7 @@ final class ButtonStylesTests: BitwardenTestCase {
                     }
                     .disabled(true)
                 }
-                .buttonStyle(CircleButtonStyle())
+                .buttonStyle(CircleButtonStyle(diameter: 50))
             }
             .padding()
             .frame(maxHeight: .infinity, alignment: .top)

diff --git a/BitwardenShared/UI/Platform/Application/Appearance/Styles/CircleButtonStyle.swift b/BitwardenShared/UI/Platform/Application/Appearance/Styles/CircleButtonStyle.swift
@@ -17,6 +17,9 @@ struct CircleButtonStyle: ButtonStyle {
             : Asset.Colors.buttonFilledDisabledBackground.swiftUIColor
     }
 
+    /// The diameter of the circle in the button.
+    let diameter: CGFloat
+
     /// The color of the foreground elements, including text and template images.
     var foregroundColor: Color {
         isEnabled
@@ -27,7 +30,7 @@ struct CircleButtonStyle: ButtonStyle {
     func makeBody(configuration: Configuration) -> some View {
         configuration.label
             .foregroundColor(foregroundColor)
-            .frame(width: 50, height: 50)
+            .frame(width: diameter, height: diameter)
             .background(backgroundColor)
             .clipShape(Circle())
             .opacity(configuration.isPressed ? 0.5 : 1)
@@ -50,7 +53,7 @@ struct CircleButtonStyle: ButtonStyle {
                     )
                 )
         }
-        .buttonStyle(CircleButtonStyle())
+        .buttonStyle(CircleButtonStyle(diameter: 50))
     }
     .padding()
 }

diff --git a/BitwardenShared/UI/Platform/Application/Views/BitwardenStepper.swift b/BitwardenShared/UI/Platform/Application/Views/BitwardenStepper.swift
@@ -140,7 +140,7 @@ struct BitwardenStepper<Label: View, Footer: View>: View {
             } label: {
                 Asset.Images.minus16.swiftUIImage
             }
-            .buttonStyle(StepperButtonStyle())
+            .buttonStyle(CircleButtonStyle(diameter: 30))
             .disabled(value <= range.lowerBound)
             .id("decrement") // Used for ViewInspector.
 
@@ -160,7 +160,7 @@ struct BitwardenStepper<Label: View, Footer: View>: View {
             } label: {
                 Asset.Images.plus16.swiftUIImage
             }
-            .buttonStyle(StepperButtonStyle())
+            .buttonStyle(CircleButtonStyle(diameter: 30))
             .disabled(value >= range.upperBound)
             .id("increment") // Used for ViewInspector.
         }
@@ -220,42 +220,6 @@ struct BitwardenStepper<Label: View, Footer: View>: View {
     }
 }
 
-// MARK: - StepperButtonStyle
-
-/// A `ButtonStyle` for styling an increment or decrement button in a `BitwardenStepper`.
-///
-struct StepperButtonStyle: ButtonStyle {
-    // MARK: Properties
-
-    @Environment(\.isEnabled) var isEnabled: Bool
-
-    /// The background color of this button.
-    var backgroundColor: Color {
-        isEnabled
-            ? Asset.Colors.buttonFilledBackground.swiftUIColor
-            : Asset.Colors.buttonFilledDisabledBackground.swiftUIColor
-    }
-
-    /// The color of the foreground elements, including text and template images.
-    var foregroundColor: Color {
-        isEnabled
-            ? Asset.Colors.buttonFilledForeground.swiftUIColor
-            : Asset.Colors.buttonFilledDisabledForeground.swiftUIColor
-    }
-
-    // MARK: ButtonStyle
-
-    func makeBody(configuration: Configuration) -> some View {
-        configuration.label
-            .foregroundColor(foregroundColor)
-            .styleGuide(.bodyBold)
-            .frame(width: 30, height: 30)
-            .background(backgroundColor)
-            .clipShape(Circle())
-            .opacity(configuration.isPressed ? 0.5 : 1)
-    }
-}
-
 // MARK: - Previews
 
 #if DEBUG

diff --git a/BitwardenShared/UI/Platform/Application/Views/FloatingActionButton.swift b/BitwardenShared/UI/Platform/Application/Views/FloatingActionButton.swift
@@ -31,7 +31,7 @@ struct FloatingActionButton: View {
                     )
                 )
         }
-        .buttonStyle(CircleButtonStyle())
+        .buttonStyle(CircleButtonStyle(diameter: 50))
         .accessibilitySortPriority(1)
     }
 }
-Original file line number
+Diff line change
@@ Expand Up / @@ -31,7 +31,7 @@ struct FloatingActionButton: View { @@
                         )
                     )
             }
-            .buttonStyle(CircleButtonStyle())
+            .buttonStyle(CircleButtonStyle(diameter: 50))
             .accessibilitySortPriority(1)
         }
     }
@@ Expand Down @@