Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Paywalls V2] Allow overriding of font size on paywall #4651

Closed
wants to merge 2 commits into from
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -155,7 +155,10 @@ fileprivate extension ButtonComponentViewModel {
let stackViewModel = try factory.toStackViewModel(
component: component.stack,
localizationProvider: localizationProvider,
uiConfigProvider: .init(uiConfig: PreviewUIConfig.make()),
uiConfigProvider: .init(
uiConfig: PreviewUIConfig.make(),
fontSizeOverride: nil
),
offering: offering
)

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -117,7 +117,10 @@ struct ImageComponentView_Previews: PreviewProvider {
locale: Locale.current,
localizedStrings: [:]
),
uiConfigProvider: .init(uiConfig: PreviewUIConfig.make()),
uiConfigProvider: .init(
uiConfig: PreviewUIConfig.make(),
fontSizeOverride: nil
),
component: .init(
source: .init(
light: .init(
Expand Down Expand Up @@ -146,7 +149,10 @@ struct ImageComponentView_Previews: PreviewProvider {
locale: Locale.current,
localizedStrings: [:]
),
uiConfigProvider: .init(uiConfig: PreviewUIConfig.make()),
uiConfigProvider: .init(
uiConfig: PreviewUIConfig.make(),
fontSizeOverride: nil
),
component: .init(
source: .init(
light: .init(
Expand Down Expand Up @@ -175,7 +181,10 @@ struct ImageComponentView_Previews: PreviewProvider {
locale: Locale.current,
localizedStrings: [:]
),
uiConfigProvider: .init(uiConfig: PreviewUIConfig.make()),
uiConfigProvider: .init(
uiConfig: PreviewUIConfig.make(),
fontSizeOverride: nil
),
component: .init(
source: .init(
light: .init(
Expand Down Expand Up @@ -207,7 +216,10 @@ struct ImageComponentView_Previews: PreviewProvider {
locale: Locale.current,
localizedStrings: [:]
),
uiConfigProvider: .init(uiConfig: PreviewUIConfig.make()),
uiConfigProvider: .init(
uiConfig: PreviewUIConfig.make(),
fontSizeOverride: nil
),
component: .init(
source: .init(
light: .init(
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -204,7 +204,10 @@ fileprivate extension PackageComponentViewModel {
let stackViewModel = try factory.toStackViewModel(
component: component.stack,
localizationProvider: localizationProvider,
uiConfigProvider: .init(uiConfig: PreviewUIConfig.make()),
uiConfigProvider: .init(
uiConfig: PreviewUIConfig.make(),
fontSizeOverride: nil
),
offering: offering
)

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -152,7 +152,10 @@ fileprivate extension PurchaseButtonComponentViewModel {
let stackViewModel = try factory.toStackViewModel(
component: component.stack,
localizationProvider: localizationProvider,
uiConfigProvider: .init(uiConfig: PreviewUIConfig.make()),
uiConfigProvider: .init(
uiConfig: PreviewUIConfig.make(),
fontSizeOverride: nil
),
offering: offering
)

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -521,14 +521,20 @@ fileprivate extension StackComponentViewModel {
packageValidator: validator,
offering: offering,
localizationProvider: localizationProvider,
uiConfigProvider: .init(uiConfig: PreviewUIConfig.make())
uiConfigProvider: .init(
uiConfig: PreviewUIConfig.make(),
fontSizeOverride: nil
)
)
}

try self.init(
component: component,
viewModels: viewModels,
uiConfigProvider: .init(uiConfig: PreviewUIConfig.make())
uiConfigProvider: .init(
uiConfig: PreviewUIConfig.make(),
fontSizeOverride: nil
)
)
}

Expand Down
167 changes: 131 additions & 36 deletions RevenueCatUI/Templates/V2/Components/Text/TextComponentView.swift
Original file line number Diff line number Diff line change
Expand Up @@ -77,6 +77,22 @@ struct TextComponentView: View {
@available(iOS 15.0, macOS 12.0, tvOS 15.0, watchOS 8.0, *)
struct TextComponentView_Previews: PreviewProvider {

static let fontSizeOverridesUIConfigProvider = UIConfigProvider(
uiConfig: PreviewUIConfig.make(),
fontSizeOverride: .init(
headingXXL: 10,
headingXL: 12,
headingL: 14,
headingM: 16,
headingS: 18,
headingXS: 20,
bodyXL: 22,
bodyL: 24,
bodyM: 26,
bodyS: 28
)
)

static var previews: some View {
// Default
TextComponentView(
Expand All @@ -88,7 +104,10 @@ struct TextComponentView_Previews: PreviewProvider {
"id_1": .string("Hello, world")
]
),
uiConfigProvider: .init(uiConfig: PreviewUIConfig.make()),
uiConfigProvider: .init(
uiConfig: PreviewUIConfig.make(),
fontSizeOverride: nil
),
component: .init(
text: "id_1",
color: .init(light: .hex("#000000"))
Expand All @@ -110,7 +129,10 @@ struct TextComponentView_Previews: PreviewProvider {
"id_1": .string("Hello, world")
]
),
uiConfigProvider: .init(uiConfig: PreviewUIConfig.make()),
uiConfigProvider: .init(
uiConfig: PreviewUIConfig.make(),
fontSizeOverride: nil
),
component: .init(
text: "id_1",
color: .init(light: .hex("#000000")),
Expand All @@ -128,11 +150,13 @@ struct TextComponentView_Previews: PreviewProvider {
"id_1": .string("Hello, world")
]
),
uiConfigProvider: .init(uiConfig: PreviewUIConfig.make(
fonts: [
"primary": .init(ios: .name("Chalkduster"))
]
)),
uiConfigProvider: .init(
uiConfig: PreviewUIConfig.make(
fonts: [
"primary": .init(ios: .name("Chalkduster"))
]
), fontSizeOverride: nil
),
component: .init(
text: "id_1",
fontName: "primary",
Expand All @@ -151,11 +175,14 @@ struct TextComponentView_Previews: PreviewProvider {
"id_1": .string("Hello, world")
]
),
uiConfigProvider: .init(uiConfig: PreviewUIConfig.make(
fonts: [
"primary": .init(ios: .name("Chalkduster"))
]
)),
uiConfigProvider: .init(
uiConfig: PreviewUIConfig.make(
fonts: [
"primary": .init(ios: .name("Chalkduster"))
]
),
fontSizeOverride: nil
),
component: .init(
text: "id_1",
fontName: "This font name is not configured",
Expand All @@ -174,11 +201,14 @@ struct TextComponentView_Previews: PreviewProvider {
"id_1": .string("Hello, world")
]
),
uiConfigProvider: .init(uiConfig: PreviewUIConfig.make(
fonts: [
"primary": .init(ios: .name("This Font Does Not Exist"))
]
)),
uiConfigProvider: .init(
uiConfig: PreviewUIConfig.make(
fonts: [
"primary": .init(ios: .name("This Font Does Not Exist"))
]
),
fontSizeOverride: nil
),
component: .init(
text: "id_1",
fontName: "primary",
Expand All @@ -203,12 +233,15 @@ struct TextComponentView_Previews: PreviewProvider {
"id_1": .string("Red bg, yellow fg")
]
),
uiConfigProvider: .init(uiConfig: PreviewUIConfig.make(
colors: [
"primary": .init(light: .hex("#ff0000")),
"secondary": .init(light: .hex("#ffcc00"))
]
)),
uiConfigProvider: .init(
uiConfig: PreviewUIConfig.make(
colors: [
"primary": .init(light: .hex("#ff0000")),
"secondary": .init(light: .hex("#ffcc00"))
]
),
fontSizeOverride: nil
),
component: .init(
text: "id_1",
color: .init(light: .alias("secondary")),
Expand All @@ -227,12 +260,15 @@ struct TextComponentView_Previews: PreviewProvider {
"id_1": .string("Clear bg and default fg")
]
),
uiConfigProvider: .init(uiConfig: PreviewUIConfig.make(
colors: [
"primary": .init(light: .hex("#ff0000")),
"secondary": .init(light: .hex("#ffcc00"))
]
)),
uiConfigProvider: .init(
uiConfig: PreviewUIConfig.make(
colors: [
"primary": .init(light: .hex("#ff0000")),
"secondary": .init(light: .hex("#ffcc00"))
]
),
fontSizeOverride: nil
),
component: .init(
text: "id_1",
color: .init(light: .alias("not a thing")),
Expand All @@ -246,6 +282,44 @@ struct TextComponentView_Previews: PreviewProvider {
.previewLayout(.sizeThatFits)
.previewDisplayName("Custom Color")

// Font Size Override
VStack {
let data: [(String, PaywallComponent.FontSize)] = [
("Heading XXL - Size 10", .headingXXL),
("Heading XL - Size 12", .headingXL),
("Heading L - Size 14", .headingL),
("Heading M - Size 16", .headingM),
("Heading S - Size 18", .headingS),
("Heading XS - Size 20", .headingXS),
("Body XL - Size 22", .bodyXL),
("Body L - Size 24", .bodyL),
("Body M - Size 26", .bodyM),
("Body S - Size 28", .bodyS)
]
ForEach(data, id: \.self.0) { (string, size) in
TextComponentView(
// swiftlint:disable:next force_try
viewModel: try! .init(
localizationProvider: .init(
locale: Locale.current,
localizedStrings: [
"id_1": .string(string)
]
),
uiConfigProvider: self.fontSizeOverridesUIConfigProvider,
component: .init(
text: "id_1",
color: .init(light: .hex("#000000")),
fontSize: size
)
)
)
}
}
.previewRequiredEnvironmentProperties()
.previewLayout(.sizeThatFits)
.previewDisplayName("Font Size Overrides")

// Gradient
TextComponentView(
// swiftlint:disable:next force_try
Expand All @@ -256,7 +330,10 @@ struct TextComponentView_Previews: PreviewProvider {
"id_1": .string("Hello, world")
]
),
uiConfigProvider: .init(uiConfig: PreviewUIConfig.make()),
uiConfigProvider: .init(
uiConfig: PreviewUIConfig.make(),
fontSizeOverride: nil
),
component: .init(
text: "id_1",
color: PaywallComponent.ColorScheme(
Expand Down Expand Up @@ -289,7 +366,10 @@ struct TextComponentView_Previews: PreviewProvider {
"id_1": .string("Hello, world")
]
),
uiConfigProvider: .init(uiConfig: PreviewUIConfig.make()),
uiConfigProvider: .init(
uiConfig: PreviewUIConfig.make(),
fontSizeOverride: nil
),
component: .init(
text: "id_1",
fontName: nil,
Expand Down Expand Up @@ -323,7 +403,10 @@ struct TextComponentView_Previews: PreviewProvider {
"id_1": .string("Hello, world")
]
),
uiConfigProvider: .init(uiConfig: PreviewUIConfig.make()),
uiConfigProvider: .init(
uiConfig: PreviewUIConfig.make(),
fontSizeOverride: nil
),
component: .init(
text: "id_1",
color: .init(light: .hex("#000000")),
Expand Down Expand Up @@ -365,7 +448,10 @@ struct TextComponentView_Previews: PreviewProvider {
"id_2": .string("Showing medium condition")
]
),
uiConfigProvider: .init(uiConfig: PreviewUIConfig.make()),
uiConfigProvider: .init(
uiConfig: PreviewUIConfig.make(),
fontSizeOverride: nil
),
component: .init(
text: "id_1",
color: .init(light: .hex("#000000")),
Expand Down Expand Up @@ -396,7 +482,10 @@ struct TextComponentView_Previews: PreviewProvider {
"id_2": .string("SHOULDN'T SHOW MEDIUM")
]
),
uiConfigProvider: .init(uiConfig: PreviewUIConfig.make()),
uiConfigProvider: .init(
uiConfig: PreviewUIConfig.make(),
fontSizeOverride: nil
),
component: .init(
text: "id_1",
color: .init(light: .hex("#000000")),
Expand Down Expand Up @@ -428,7 +517,10 @@ struct TextComponentView_Previews: PreviewProvider {
)
]
),
uiConfigProvider: .init(uiConfig: PreviewUIConfig.make()),
uiConfigProvider: .init(
uiConfig: PreviewUIConfig.make(),
fontSizeOverride: nil
),
component: .init(
text: "id_1",
color: .init(light: .hex("#000000"))
Expand Down Expand Up @@ -458,7 +550,10 @@ struct TextComponentView_Previews: PreviewProvider {
)
]
),
uiConfigProvider: .init(uiConfig: PreviewUIConfig.make()),
uiConfigProvider: .init(
uiConfig: PreviewUIConfig.make(),
fontSizeOverride: nil
),
component: .init(
text: "id_1",
color: .init(light: .hex("#000000"))
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -241,7 +241,10 @@ struct TextComponentStyle {
self.color = color.asDisplayable(uiConfigProvider: uiConfigProvider)

// WIP: Take into account the fontFamily mapping
self.font = fontSize.makeFont(familyName: fontFamily)
self.font = fontSize.makeFont(
familyName: fontFamily,
fontSizeOverrides: uiConfigProvider.fontSizeOverride
)

self.textAlignment = horizontalAlignment.textAlignment
self.horizontalAlignment = horizontalAlignment.frameAlignment
Expand Down
Loading