Remove redundant padding that makes progress view bigger than text label, resulting in a taller height in the button loading state.

Author: jaclync

WooCommerce/Classes/POS/Presentation/Reusable Views/Buttons/POSButtonStyle.swift

@@ -89,14 +89,6 @@ private struct POSButton: View {
     private var progressView: some View {
         ProgressView()
             .progressViewStyle(POSButtonProgressViewStyle(size: size.progressViewDimensions.size, lineWidth: size.progressViewDimensions.lineWidth))
-            .padding(
-                .init(
-                    top: size.additionalPadding.vertical,
-                    leading: size.additionalPadding.horizontal,
-                    bottom: size.additionalPadding.vertical,
-                    trailing: size.additionalPadding.horizontal
-                )
-            )
     }
 
     private var backgroundColor: Color {
@@ -173,24 +165,14 @@ private extension POSButtonSize {
             (size: 20, lineWidth: 6)
         }
     }
-
-    /// The internal use of `IndefiniteCircularProgressViewStyle` progress style results in half of the line width drawn outside of the progress view.
-    /// This additional padding is thus adjusted by the partial line width to achieve the expected padding in design.
-    var additionalPadding: (vertical: CGFloat, horizontal: CGFloat) {
-        switch self {
-        case .normal:
-            (vertical: progressViewDimensions.lineWidth * 0.5, horizontal: progressViewDimensions.lineWidth * 0.5)
-        case .extraSmall:
-            (vertical: 2 + progressViewDimensions.lineWidth * 0.5, horizontal: 16 + progressViewDimensions.lineWidth * 0.5)
-        }
-    }
 }
 
 // MARK: - Preview
 
 #if DEBUG
 
 struct POSButtonStyle_Previews: View {
+    @State private var showsLoadingState: Bool = false
     var body: some View {
         ScrollView {
             VStack(alignment: .leading, spacing: POSSpacing.xLarge) {
@@ -255,6 +237,11 @@ struct POSButtonStyle_Previews: View {
             Text(title)
                 .font(.headline)
 
+            Button("Show loading state") {
+                showsLoadingState.toggle()
+            }
+            .buttonStyle(POSFilledButtonStyle(size: size, isLoading: showsLoadingState))
+
             Button("Enabled Loading Button") {}
                 .buttonStyle(POSFilledButtonStyle(size: size, isLoading: true))