Skip to content

Commit

Permalink
[Paywalls V2] Update text spec (#4469)
Browse files Browse the repository at this point in the history
* Update stack size

* Better strat logic around flex and lazy stacks

* Update text font size and some other things

* Fix text sizes

* Added Package.resolved back in
  • Loading branch information
joshdholtz authored Nov 12, 2024
1 parent 7ae6c05 commit cff5ff6
Show file tree
Hide file tree
Showing 8 changed files with 97 additions and 97 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -16,42 +16,44 @@ import SwiftUI

#if PAYWALL_COMPONENTS

extension PaywallComponent.TextStyle {
extension PaywallComponent.FontSize {

var font: Font {
return Font(self.uiFont)
}

private var textStyle: UIFont.TextStyle {
switch self {
case .largeTitle: return .largeTitle
case .title: return .title
case .title2: if #available(iOS 14.0, *) {
return .title2
} else {
return .title
}
case .title3: if #available(iOS 14.0, *) {
return .title3
} else {
return .title
}
case .headline: return .headline
case .subheadline: return .subheadline
case .body: return .body
case .callout: return .callout
case .footnote: return .footnote
case .caption: return .caption
case .caption2: if #available(iOS 14.0, *) {
return .caption2
} else {
return .caption
case .headingXXL: return .largeTitle
case .headingXL: return .title1
case .headingL: return .title2
case .headingM: return .title3
case .headingS: return .headline
case .headingXS: return .subheadline
case .bodyXL, .bodyL: return .body
case .bodyM: return .callout
case .bodyS: return .footnote
}
}

#if swift(>=5.9) && VISION_OS
case .extraLargeTitle: return .extraLargeTitle
case .extraLargeTitle2: return .extraLargeTitle2
#else
case .extraLargeTitle: return .largeTitle
case .extraLargeTitle2: return .largeTitle
#endif
private var uiFont: UIFont {
let fontSize: CGFloat
switch self {
case .headingXXL: fontSize = 40
case .headingXL: fontSize = 34
case .headingL: fontSize = 28
case .headingM: fontSize = 24
case .headingS: fontSize = 20
case .headingXS: fontSize = 16
case .bodyXL: fontSize = 18
case .bodyL: fontSize = 17
case .bodyM: fontSize = 15
case .bodyS: fontSize = 13
}

// Create a UIFont and apply dynamic type scaling
let baseFont = UIFont.systemFont(ofSize: fontSize, weight: .regular)
return UIFontMetrics(forTextStyle: self.textStyle).scaledFont(for: baseFont)
}

}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -251,6 +251,7 @@ struct StackComponentView_Previews: PreviewProvider {
.previewLayout(.sizeThatFits)
.previewDisplayName("Default - Fill Fit Fixed Fill")
}

}

@available(iOS 15.0, macOS 12.0, tvOS 15.0, watchOS 8.0, *)
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -37,25 +37,25 @@ private enum Template1Preview {

static let title = PaywallComponent.TextComponent(
text: "title",
fontFamily: nil,
fontName: nil,
fontWeight: .black,
color: .init(light: .hex("#000000")),
backgroundColor: nil,
padding: .zero,
margin: .zero,
textStyle: .largeTitle,
fontSize: .headingL,
horizontalAlignment: .center
)

static let body = PaywallComponent.TextComponent(
text: "body",
fontFamily: nil,
fontName: nil,
fontWeight: .regular,
color: .init(light: .hex("#000000")),
backgroundColor: nil,
padding: .zero,
margin: .zero,
textStyle: .body,
fontSize: .bodyM,
horizontalAlignment: .center
)

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -40,25 +40,25 @@ private enum Template5Preview {

static let title = PaywallComponent.TextComponent(
text: "title",
fontFamily: nil,
fontName: nil,
fontWeight: .black,
color: .init(light: .hex("#000000")),
backgroundColor: nil,
padding: .zero,
margin: .zero,
textStyle: .largeTitle,
fontSize: .headingL,
horizontalAlignment: .leading
)

static let body = PaywallComponent.TextComponent(
text: "body",
fontFamily: nil,
fontName: nil,
fontWeight: .regular,
color: .init(light: .hex("#000000")),
backgroundColor: nil,
padding: .zero,
margin: .zero,
textStyle: .body,
fontSize: .bodyM,
horizontalAlignment: .leading
)

Expand Down Expand Up @@ -133,7 +133,7 @@ private enum Template5Preview {
.text(.init(
text: "package_terms",
color: .init(light: .hex("#999999")),
textStyle: .caption
fontSize: .bodyS
))
],
dimension: .vertical(.center, .start),
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -40,12 +40,13 @@ struct TextComponentView: View {
Group {
if style.visible {
Text(style.text)
.font(style.textStyle)
.font(style.fontSize)
.fontWeight(style.fontWeight)
.fixedSize(horizontal: false, vertical: true)
.multilineTextAlignment(style.horizontalAlignment)
.foregroundStyle(style.color)
.padding(style.padding)
.size(style.size)
.background(style.backgroundColor)
.padding(style.margin)
} else {
Expand Down Expand Up @@ -87,7 +88,7 @@ struct TextComponentView_Previews: PreviewProvider {
],
component: .init(
text: "id_1",
fontFamily: nil,
fontName: nil,
fontWeight: .black,
color: .init(light: .hex("#ff0000")),
backgroundColor: .init(light: .hex("#dedede")),
Expand All @@ -99,7 +100,7 @@ struct TextComponentView_Previews: PreviewProvider {
bottom: 20,
leading: 10,
trailing: 10),
textStyle: .footnote,
fontSize: .bodyS,
horizontalAlignment: .leading
)
)
Expand Down Expand Up @@ -131,7 +132,7 @@ struct TextComponentView_Previews: PreviewProvider {
bottom: 10,
leading: 10,
trailing: 10),
textStyle: .title
fontSize: .headingXL
)
)
)
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -79,13 +79,14 @@ class TextComponentViewModel {
let style = TextComponentStyle(
visible: partial?.visible ?? true,
text: localalizedPartial?.text ?? self.text,
fontFamily: partial?.fontFamily ?? self.component.fontFamily,
fontFamily: partial?.fontName ?? self.component.fontName,
fontWeight: partial?.fontWeight ?? self.component.fontWeight,
color: partial?.color ?? self.component.color,
backgroundColor: partial?.backgroundColor ?? self.component.backgroundColor,
size: partial?.size ?? self.component.size,
padding: partial?.padding ?? self.component.padding,
margin: partial?.margin ?? self.component.margin,
textStyle: partial?.textStyle ?? self.component.textStyle,
fontSize: partial?.fontSize ?? self.component.fontSize,
horizontalAlignment: partial?.horizontalAlignment ?? self.component.horizontalAlignment
)

Expand Down Expand Up @@ -157,13 +158,13 @@ class TextComponentViewModel {
partial: PaywallComponent.PartialTextComponent(
visible: otherPartial?.visible ?? basePartial?.visible,
text: otherPartial?.text ?? basePartial?.text,
fontFamily: otherPartial?.fontFamily ?? basePartial?.fontFamily,
fontName: otherPartial?.fontName ?? basePartial?.fontName,
fontWeight: otherPartial?.fontWeight ?? basePartial?.fontWeight,
color: otherPartial?.color ?? basePartial?.color,
backgroundColor: otherPartial?.backgroundColor ?? basePartial?.backgroundColor,
padding: otherPartial?.padding ?? basePartial?.padding,
margin: otherPartial?.margin ?? basePartial?.margin,
textStyle: otherPartial?.textStyle ?? basePartial?.textStyle,
fontSize: otherPartial?.fontSize ?? basePartial?.fontSize,
horizontalAlignment: otherPartial?.horizontalAlignment ?? basePartial?.horizontalAlignment
)
)
Expand Down Expand Up @@ -192,12 +193,12 @@ struct TextComponentStyle {

let visible: Bool
let text: String
let fontFamily: String?
let fontWeight: Font.Weight
let color: Color
let textStyle: Font
let fontSize: Font
let horizontalAlignment: TextAlignment
let backgroundColor: Color
let size: PaywallComponent.Size
let padding: EdgeInsets
let margin: EdgeInsets

Expand All @@ -208,19 +209,23 @@ struct TextComponentStyle {
fontWeight: PaywallComponent.FontWeight,
color: PaywallComponent.ColorScheme,
backgroundColor: PaywallComponent.ColorScheme?,
size: PaywallComponent.Size,
padding: PaywallComponent.Padding,
margin: PaywallComponent.Padding,
textStyle: PaywallComponent.TextStyle,
fontSize: PaywallComponent.FontSize,
horizontalAlignment: PaywallComponent.HorizontalAlignment
) {
self.visible = visible
self.text = text
self.fontFamily = fontFamily
self.fontWeight = fontWeight.fontWeight
self.color = color.toDyanmicColor()
self.textStyle = textStyle.font

// WIP: Take into account the fontFamily mapping
self.fontSize = fontSize.font

self.horizontalAlignment = horizontalAlignment.textAlignment
self.backgroundColor = backgroundColor?.toDyanmicColor() ?? Color.clear
self.size = size
self.padding = padding.edgeInsets
self.margin = margin.edgeInsets
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -105,18 +105,6 @@ public extension PaywallComponent {

}

// struct ColorInfo: Codable, Sendable, Hashable, Equatable {
//
// public init(light: ColorHex, dark: ColorHex? = nil) {
// self.light = light
// self.dark = dark
// }
//
// public let light: ColorHex
// public let dark: ColorHex?
//
// }

enum Shape: Codable, Sendable, Hashable, Equatable {

case rectangle
Expand Down Expand Up @@ -292,23 +280,18 @@ public extension PaywallComponent {

}

enum TextStyle: String, Codable, Sendable, Hashable, Equatable {

case largeTitle = "large_title"
case title
case title2
case title3
case headline
case subheadline
case body
case callout
case footnote
case caption
case caption2

// Swift 5.9 stuff
case extraLargeTitle = "extra_large_title"
case extraLargeTitle2 = "extra_large_title2"
enum FontSize: String, Codable, Sendable, Hashable, Equatable {

case headingXXL = "heading_xxl"
case headingXL = "heading_xl"
case headingL = "heading_l"
case headingM = "heading_m"
case headingS = "heading_s"
case headingXS = "heading_xs"
case bodyXL = "body_xl"
case bodyL = "body_l"
case bodyM = "body_m"
case bodyS = "body_s"

}

Expand Down
Loading

0 comments on commit cff5ff6

Please sign in to comment.