diff --git a/WooCommerce/Classes/POS/Adaptors/POSServiceLocatorAdaptor.swift b/WooCommerce/Classes/POS/Adaptors/POSServiceLocatorAdaptor.swift index 5eaf6d3fa7c..25fa3d2f068 100644 --- a/WooCommerce/Classes/POS/Adaptors/POSServiceLocatorAdaptor.swift +++ b/WooCommerce/Classes/POS/Adaptors/POSServiceLocatorAdaptor.swift @@ -85,9 +85,10 @@ private struct POSExternalViewAdaptor: POSExternalViewProviding { } func createFormattableAmountTextField(preset: Decimal?, + font: Font, onSubmit: @escaping () -> Void, onChange: @escaping (String) -> Void) -> AnyView { - AnyView(POSFormattableAmountTextFieldAdaptor(preset: preset, onSubmit: onSubmit, onChange: onChange)) + AnyView(POSFormattableAmountTextFieldAdaptor(preset: preset, font: font, onSubmit: onSubmit, onChange: onChange)) } func createCouponCreationView(discountType: Coupon.DiscountType, diff --git a/WooCommerce/Classes/POS/Adaptors/View Adaptors/POSFormattableAmountTextFieldAdaptor.swift b/WooCommerce/Classes/POS/Adaptors/View Adaptors/POSFormattableAmountTextFieldAdaptor.swift index 1debbad22ba..e5d06f994f1 100644 --- a/WooCommerce/Classes/POS/Adaptors/View Adaptors/POSFormattableAmountTextFieldAdaptor.swift +++ b/WooCommerce/Classes/POS/Adaptors/View Adaptors/POSFormattableAmountTextFieldAdaptor.swift @@ -6,11 +6,12 @@ import SwiftUI /// struct POSFormattableAmountTextFieldAdaptor: View { @StateObject private var textFieldViewModel: FormattableAmountTextFieldViewModel - let preset: Decimal? - let onSubmit: () -> Void - let onChange: (String) -> Void + private let preset: Decimal? + private let style: FormattableAmountTextField.Style + private let onSubmit: () -> Void + private let onChange: (String) -> Void - init(preset: Decimal?, onSubmit: @escaping () -> Void, onChange: @escaping (String) -> Void) { + init(preset: Decimal?, font: Font, onSubmit: @escaping () -> Void, onChange: @escaping (String) -> Void) { self._textFieldViewModel = StateObject(wrappedValue: FormattableAmountTextFieldViewModel( size: .extraLarge, locale: Locale.autoupdatingCurrent, @@ -18,12 +19,13 @@ struct POSFormattableAmountTextFieldAdaptor: View { allowNegativeNumber: false) ) self.preset = preset + self.style = .init(showsBorder: false, textAlignment: .center, font: font) self.onSubmit = onSubmit self.onChange = onChange } var body: some View { - FormattableAmountTextField(viewModel: textFieldViewModel, style: .pos) + FormattableAmountTextField(viewModel: textFieldViewModel, style: style) .dynamicTypeSize(...DynamicTypeSize.accessibility1) .onSubmit { onSubmit() diff --git a/WooCommerce/Classes/POS/Presentation/PointOfSaleCollectCashView.swift b/WooCommerce/Classes/POS/Presentation/PointOfSaleCollectCashView.swift index d2941a518f6..cca9ad91471 100644 --- a/WooCommerce/Classes/POS/Presentation/PointOfSaleCollectCashView.swift +++ b/WooCommerce/Classes/POS/Presentation/PointOfSaleCollectCashView.swift @@ -3,6 +3,7 @@ import Combine import WooFoundation struct PointOfSaleCollectCashView: View { + @Environment(\.dynamicTypeSize) private var dynamicTypeSize @Environment(\.posAnalytics) private var analytics @Environment(\.posExternalViews) private var externalViews @Environment(\.floatingControlAreaSize) private var floatingControlAreaSize: CGSize @@ -57,6 +58,7 @@ struct PointOfSaleCollectCashView: View { VStack(alignment: .center, spacing: conditionalPadding(POSSpacing.xSmall)) { externalViews.createFormattableAmountTextField( preset: viewHelper.parseCurrency(orderTotal), + font: POSFontStyle.posHeadingRegular.font(maximumContentSizeCategory: UIContentSizeCategory(dynamicTypeSize)), onSubmit: { Task { @MainActor in await submitCashAmount() diff --git a/WooCommerce/Classes/POS/Protocols/POSDependencyProviding.swift b/WooCommerce/Classes/POS/Protocols/POSDependencyProviding.swift index 095c0efd186..0974fa62167 100644 --- a/WooCommerce/Classes/POS/Protocols/POSDependencyProviding.swift +++ b/WooCommerce/Classes/POS/Protocols/POSDependencyProviding.swift @@ -48,6 +48,7 @@ protocol POSExternalNavigationProviding { protocol POSExternalViewProviding { func createSupportFormView(isPresented: Binding, sourceTag: String) -> AnyView func createFormattableAmountTextField(preset: Decimal?, + font: Font, onSubmit: @escaping () -> Void, onChange: @escaping (String) -> Void) -> AnyView func createCouponCreationView(discountType: Coupon.DiscountType, diff --git a/WooCommerce/Classes/POS/Utils/POSEnvironmentKeys.swift b/WooCommerce/Classes/POS/Utils/POSEnvironmentKeys.swift index 7dab8f52bb1..78e9a6cefea 100644 --- a/WooCommerce/Classes/POS/Utils/POSEnvironmentKeys.swift +++ b/WooCommerce/Classes/POS/Utils/POSEnvironmentKeys.swift @@ -125,6 +125,7 @@ struct EmptyPOSAnalytics: POSAnalyticsProviding { struct EmptyPOSExternalView: POSExternalViewProviding { func createSupportFormView(isPresented: Binding, sourceTag: String) -> AnyView { AnyView(EmptyView()) } func createFormattableAmountTextField(preset: Decimal?, + font: Font, onSubmit: @escaping () -> Void, onChange: @escaping (String) -> Void) -> AnyView { AnyView(EmptyView()) diff --git a/WooCommerce/Classes/ViewRelated/ReusableViews/SwiftUI Components/FormattableAmountTextField.swift b/WooCommerce/Classes/ViewRelated/ReusableViews/SwiftUI Components/FormattableAmountTextField.swift index 720fb37680a..2414caec1c7 100644 --- a/WooCommerce/Classes/ViewRelated/ReusableViews/SwiftUI Components/FormattableAmountTextField.swift +++ b/WooCommerce/Classes/ViewRelated/ReusableViews/SwiftUI Components/FormattableAmountTextField.swift @@ -27,10 +27,7 @@ struct FormattableAmountTextField: View { .opacity(0) Text(viewModel.formattedAmount) - .if(style == .pos) { - $0.font(.posHeadingRegular) - } - .font(.system(size: Layout.amountFontSize(size: viewModel.amountTextSize.fontSize, scale: scale), weight: .bold)) + .font(style.font ?? .system(size: Layout.amountFontSize(size: viewModel.amountTextSize.fontSize, scale: scale), weight: .bold)) .foregroundColor(Color(viewModel.amountTextColor)) .minimumScaleFactor(0.1) .lineLimit(1) @@ -48,27 +45,17 @@ struct FormattableAmountTextField: View { } extension FormattableAmountTextField { - enum Style { - case `default` - case pos - - var showsBorder: Bool { - switch self { - case .default: - return true - case .pos: - return false - } - } + struct Style: Equatable { + let showsBorder: Bool + let textAlignment: Alignment + /// Optional font to use for the amount text. If nil, a default system font will be used. + let font: Font? - var textAlignment: Alignment { - switch self { - case .default: - return .leading - case .pos: - return .center - } - } + static let `default` = Style( + showsBorder: true, + textAlignment: .leading, + font: nil + ) } } @@ -90,7 +77,7 @@ private extension FormattableAmountTextField { FormattableAmountTextField(viewModel: viewModel, style: .default) } VStack { - Text("POS style") - FormattableAmountTextField(viewModel: viewModel, style: .pos) + Text("Other style") + FormattableAmountTextField(viewModel: viewModel, style: .init(showsBorder: false, textAlignment: .center, font: .title2)) } }