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] Update color spec #4468

Merged
merged 1 commit into from
Nov 11, 2024
Merged
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 @@ -119,7 +119,7 @@ struct ButtonComponentView_Previews: PreviewProvider {
PaywallComponent.text(
PaywallComponent.TextComponent(
text: "buttonText",
color: .init(light: "#000000")
color: .init(light: .hex("#000000"))
)
)
],
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -74,13 +74,13 @@ struct PackageComponentView_Previews: PreviewProvider {
.text(.init(
text: "name",
fontWeight: .bold,
color: .init(light: "#000000"),
color: .init(light: .hex("#000000")),
padding: .zero,
margin: .zero
)),
.text(.init(
text: "detail",
color: .init(light: "#000000"),
color: .init(light: .hex("#000000")),
padding: .zero,
margin: .zero
))
Expand All @@ -96,11 +96,11 @@ struct PackageComponentView_Previews: PreviewProvider {
bottom: 10,
leading: 10,
trailing: 10),
border: .init(color: .init(light: "#cccccc"), width: 2),
border: .init(color: .init(light: .hex("#cccccc")), width: 2),
overrides: .init(
states: .init(
selected: .init(
border: .init(color: .init(light: "#ff0000"), width: 2)
border: .init(color: .init(light: .hex("#ff0000")), width: 2)
)
)
)
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -91,8 +91,8 @@ struct PurchaseButtonComponentView_Previews: PreviewProvider {
.text(.init(
text: "id_1",
fontWeight: .bold,
color: .init(light: "#ffffff"),
backgroundColor: .init(light: "#ff0000"),
color: .init(light: .hex("#ffffff")),
backgroundColor: .init(light: .hex("#ff0000")),
padding: .init(top: 10,
bottom: 10,
leading: 30,
Expand Down Expand Up @@ -123,10 +123,10 @@ struct PurchaseButtonComponentView_Previews: PreviewProvider {
.text(.init(
text: "id_1",
fontWeight: .bold,
color: .init(light: "#ffffff")
color: .init(light: .hex("#ffffff"))
))
],
backgroundColor: .init(light: "#ff0000"),
backgroundColor: .init(light: .hex("#ff0000")),
padding: .init(top: 8,
bottom: 8,
leading: 8,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -180,6 +180,19 @@ extension PaywallComponent.FitMode {
}
}

extension PaywallComponent.ColorInfo {

func toColor(fallback: Color) -> Color {
switch self {
case .hex(let hex):
return hex.toColor(fallback: fallback)
case .alias:
// WIP: Need to implement this when we actually have alias implemented
return fallback
}
}
}

extension PaywallComponent.ColorHex {

func toColor(fallback: Color) -> Color {
Expand Down Expand Up @@ -222,7 +235,7 @@ extension PaywallComponent.ColorHex {

}

extension PaywallComponent.ColorInfo {
extension PaywallComponent.ColorScheme {

@available(iOS 15.0, macOS 12.0, tvOS 15.0, watchOS 8.0, *)
func toDyanmicColor() -> Color {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@ extension TemplateComponentsView {
let errorDict: PaywallComponent.LocalizationDictionary = ["errorID": .string("Error creating paywall")]
let textComponent = PaywallComponent.TextComponent(
text: "errorID",
color: PaywallComponent.ColorInfo(light: "#000000")
color: PaywallComponent.ColorScheme(light: .hex("#000000"))
)

// swiftlint:disable:next force_try
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,7 @@ private enum Template1Preview {
text: "title",
fontFamily: nil,
fontWeight: .black,
color: .init(light: "#000000"),
color: .init(light: .hex("#000000")),
backgroundColor: nil,
padding: .zero,
margin: .zero,
Expand All @@ -51,7 +51,7 @@ private enum Template1Preview {
text: "body",
fontFamily: nil,
fontWeight: .regular,
color: .init(light: "#000000"),
color: .init(light: .hex("#000000")),
backgroundColor: nil,
padding: .zero,
margin: .zero,
Expand All @@ -65,13 +65,13 @@ private enum Template1Preview {
.text(.init(
text: "package_name",
fontWeight: .bold,
color: .init(light: "#000000"),
color: .init(light: .hex("#000000")),
padding: .zero,
margin: .zero
)),
.text(.init(
text: "package_detail",
color: .init(light: "#000000"),
color: .init(light: .hex("#000000")),
padding: .zero,
margin: .zero
))
Expand All @@ -98,8 +98,8 @@ private enum Template1Preview {
.text(.init(
text: "cta",
fontWeight: .bold,
color: .init(light: "#ffffff"),
backgroundColor: .init(light: "#e89d89"),
color: .init(light: .hex("#ffffff")),
backgroundColor: .init(light: .hex("#e89d89")),
padding: .init(top: 10,
bottom: 10,
leading: 30,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -42,7 +42,7 @@ private enum Template5Preview {
text: "title",
fontFamily: nil,
fontWeight: .black,
color: .init(light: "#000000"),
color: .init(light: .hex("#000000")),
backgroundColor: nil,
padding: .zero,
margin: .zero,
Expand All @@ -54,7 +54,7 @@ private enum Template5Preview {
text: "body",
fontFamily: nil,
fontWeight: .regular,
color: .init(light: "#000000"),
color: .init(light: .hex("#000000")),
backgroundColor: nil,
padding: .zero,
margin: .zero,
Expand Down Expand Up @@ -86,13 +86,13 @@ private enum Template5Preview {
.text(.init(
text: nameTextLid,
fontWeight: .bold,
color: .init(light: "#000000"),
color: .init(light: .hex("#000000")),
padding: .zero,
margin: .zero
)),
.text(.init(
text: detailTextLid,
color: .init(light: "#000000"),
color: .init(light: .hex("#000000")),
padding: .zero,
margin: .zero
))
Expand All @@ -108,7 +108,7 @@ private enum Template5Preview {
topTrailing: 16,
bottomLeading: 16,
bottomTrailing: 20),
border: .init(color: .init(light: "#cccccc"), width: 1)
border: .init(color: .init(light: .hex("#cccccc")), width: 1)
)

return PaywallComponent.PackageComponent(
Expand All @@ -132,7 +132,7 @@ private enum Template5Preview {
isSelectedByDefault: true)),
.text(.init(
text: "package_terms",
color: .init(light: "#999999"),
color: .init(light: .hex("#999999")),
textStyle: .caption
))
],
Expand All @@ -152,10 +152,10 @@ private enum Template5Preview {
.text(.init(
text: "cta",
fontWeight: .bold,
color: .init(light: "#ffffff")
color: .init(light: .hex("#ffffff"))
))
],
backgroundColor: .init(light: "#e89d89"),
backgroundColor: .init(light: .hex("#e89d89")),
padding: .init(top: 15,
bottom: 15,
leading: 50,
Expand Down
16 changes: 8 additions & 8 deletions RevenueCatUI/Templates/Components/Text/TextComponentView.swift
Original file line number Diff line number Diff line change
Expand Up @@ -71,7 +71,7 @@ struct TextComponentView_Previews: PreviewProvider {
],
component: .init(
text: "id_1",
color: .init(light: "#000000")
color: .init(light: .hex("#000000"))
)
)
)
Expand All @@ -89,8 +89,8 @@ struct TextComponentView_Previews: PreviewProvider {
text: "id_1",
fontFamily: nil,
fontWeight: .black,
color: .init(light: "#ff0000"),
backgroundColor: .init(light: "#dedede"),
color: .init(light: .hex("#ff0000")),
backgroundColor: .init(light: .hex("#dedede")),
padding: .init(top: 10,
bottom: 10,
leading: 20,
Expand All @@ -116,13 +116,13 @@ struct TextComponentView_Previews: PreviewProvider {
],
component: .init(
text: "id_1",
color: .init(light: "#000000"),
color: .init(light: .hex("#000000")),
overrides: .init(
states: .init(
selected: .init(
fontWeight: .black,
color: .init(light: "#ff0000"),
backgroundColor: .init(light: "#0000ff"),
color: .init(light: .hex("#ff0000")),
backgroundColor: .init(light: .hex("#0000ff")),
padding: .init(top: 10,
bottom: 10,
leading: 10,
Expand Down Expand Up @@ -152,7 +152,7 @@ struct TextComponentView_Previews: PreviewProvider {
],
component: .init(
text: "id_1",
color: .init(light: "#000000"),
color: .init(light: .hex("#000000")),
overrides: .init(
conditions: .init(
medium: .init(
Expand All @@ -177,7 +177,7 @@ struct TextComponentView_Previews: PreviewProvider {
],
component: .init(
text: "id_1",
color: .init(light: "#000000"),
color: .init(light: .hex("#000000")),
overrides: .init(
conditions: .init(
medium: .init(
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -206,8 +206,8 @@ struct TextComponentStyle {
text: PaywallComponent.LocalizationKey,
fontFamily: String?,
fontWeight: PaywallComponent.FontWeight,
color: PaywallComponent.ColorInfo,
backgroundColor: PaywallComponent.ColorInfo?,
color: PaywallComponent.ColorScheme,
backgroundColor: PaywallComponent.ColorScheme?,
padding: PaywallComponent.Padding,
margin: PaywallComponent.Padding,
textStyle: PaywallComponent.TextStyle,
Expand Down
4 changes: 2 additions & 2 deletions Sources/Paywalls/Components/Common/Border.swift
Original file line number Diff line number Diff line change
Expand Up @@ -20,10 +20,10 @@ public extension PaywallComponent {

struct Border: Codable, Sendable, Hashable {

public let color: ColorInfo
public let color: ColorScheme
public let width: Double

public init(color: PaywallComponent.ColorInfo, width: Double) {
public init(color: PaywallComponent.ColorScheme, width: Double) {
self.color = color
self.width = width
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -43,18 +43,80 @@ public extension PaywallComponent {
public let heicLowRes: URL
}

struct ColorInfo: Codable, Sendable, Hashable, Equatable {
struct ColorScheme: Codable, Sendable, Hashable, Equatable {

public init(light: ColorHex, dark: ColorHex? = nil) {
public init(light: ColorInfo, dark: ColorInfo? = nil) {
self.light = light
self.dark = dark
}

public let light: ColorHex
public let dark: ColorHex?
public let light: ColorInfo
public let dark: ColorInfo?

}

enum ColorInfo: Codable, Sendable, Hashable {

case hex(ColorHex)
case alias(String)

public func encode(to encoder: any Encoder) throws {
var container = encoder.container(keyedBy: CodingKeys.self)

switch self {
case .hex(let hex):
try container.encode(ColorInfoTypes.hex.rawValue, forKey: .type)
try container.encode(hex, forKey: .value)
case .alias(let alias):
try container.encode(ColorInfoTypes.alias.rawValue, forKey: .type)
try container.encode(alias, forKey: .value)
}
}

public init(from decoder: Decoder) throws {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I might think about adding in some tests to validate the custom encoding/decoding of the ColorInfo enum. I know from recent experience in Pines that it's easy to make mistakes in these custom enum codable implementations and it's easy to miss until much later in testing

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes yes, for sure! Tests coming soon™️

let container = try decoder.container(keyedBy: CodingKeys.self)
let type = try container.decode(ColorInfoTypes.self, forKey: .type)

switch type {
case .hex:
let value = try container.decode(ColorHex.self, forKey: .value)
self = .hex(value)
case .alias:
let value = try container.decode(String.self, forKey: .value)
self = .alias(value)
}
}

// swiftlint:disable:next nesting
private enum CodingKeys: String, CodingKey {

case type
case value

}

// swiftlint:disable:next nesting
private enum ColorInfoTypes: String, Decodable {

case hex
case alias

}

}

// struct ColorInfo: Codable, Sendable, Hashable, Equatable {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nit: remove commented code

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ha! I did notice this and it gets removed like 2 PRs in 😛

//
// 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 @@ -209,15 +271,15 @@ public extension PaywallComponent {

struct Shadow: Codable, Sendable, Hashable, Equatable {

public let color: ColorInfo
public let color: ColorScheme
public let radius: CGFloat
// swiftlint:disable:next identifier_name
public let x: CGFloat
// swiftlint:disable:next identifier_name
public let y: CGFloat

// swiftlint:disable:next identifier_name
public init(color: ColorInfo, radius: CGFloat, x: CGFloat, y: CGFloat) {
public init(color: ColorScheme, radius: CGFloat, x: CGFloat, y: CGFloat) {
self.color = color
self.radius = radius
self.x = x
Expand Down
Loading