From b3e2f26f1bbe717fb685abd5266cdd77f6e31f10 Mon Sep 17 00:00:00 2001 From: Josh Holtz Date: Sat, 11 Jan 2025 14:02:13 -0600 Subject: [PATCH 1/3] Updated super outdated properties on image --- .../Components/PaywallImageComponent.swift | 50 ++++++++++++++++--- 1 file changed, 42 insertions(+), 8 deletions(-) diff --git a/Sources/Paywalls/Components/PaywallImageComponent.swift b/Sources/Paywalls/Components/PaywallImageComponent.swift index 935fea066c..c1a2505140 100644 --- a/Sources/Paywalls/Components/PaywallImageComponent.swift +++ b/Sources/Paywalls/Components/PaywallImageComponent.swift @@ -10,6 +10,17 @@ import Foundation #if PAYWALL_COMPONENTS +//source: ImageScheme | None = None +//override_source_lid: LocalizationId | None = None +//color_overlay: ColorSchemes | None = None +//fit_mode: FitMode | None = None +//mask_shape: MaskShape | None = None +//size: Size | None = None +//padding: Spacing | None = None +//margin: Spacing | None = None +//border: Border | None = None +//shadow: Shadow | None = None + public extension PaywallComponent { struct ImageComponent: PaywallComponentBase { @@ -18,9 +29,13 @@ public extension PaywallComponent { public let source: ThemeImageUrls public let size: Size public let overrideSourceLid: LocalizationKey? - public let maskShape: MaskShape? - public let gradientColors: [ColorHex]? public let fitMode: FitMode + public let maskShape: MaskShape? + public let colorOverlay: ColorScheme? + public let padding: Padding? + public let margin: Padding? + public let border: Border? + public let shadow: Shadow? public let overrides: ComponentOverrides? @@ -29,9 +44,12 @@ public extension PaywallComponent { size: Size = .init(width: .fill, height: .fit), overrideSourceLid: LocalizationKey? = nil, fitMode: FitMode = .fit, - maxHeight: CGFloat? = nil, maskShape: MaskShape? = nil, - gradientColors: [ColorHex]? = [], + colorOverlay: ColorScheme? = nil, + padding: Padding? = nil, + margin: Padding? = nil, + border: Border? = nil, + shadow: Shadow? = nil, overrides: ComponentOverrides? = nil ) { self.type = .image @@ -40,7 +58,11 @@ public extension PaywallComponent { self.overrideSourceLid = overrideSourceLid self.fitMode = fitMode self.maskShape = maskShape - self.gradientColors = gradientColors + self.colorOverlay = colorOverlay + self.padding = padding + self.margin = margin + self.border = border + self.shadow = shadow self.overrides = overrides } @@ -53,8 +75,12 @@ public extension PaywallComponent { public let size: Size? public let overrideSourceLid: LocalizationKey? public let maskShape: MaskShape? - public let gradientColors: [ColorHex]? public let fitMode: FitMode? + public let colorOverlay: ColorScheme? + public let padding: Padding? + public let margin: Padding? + public let border: Border? + public let shadow: Shadow? public init( visible: Bool? = true, @@ -63,7 +89,11 @@ public extension PaywallComponent { overrideSourceLid: LocalizationKey? = nil, fitMode: FitMode? = nil, maskShape: MaskShape? = nil, - gradientColors: [ColorHex]? = nil + colorOverlay: ColorScheme? = nil, + padding: Padding? = nil, + margin: Padding? = nil, + border: Border? = nil, + shadow: Shadow? = nil ) { self.visible = visible self.source = source @@ -71,7 +101,11 @@ public extension PaywallComponent { self.overrideSourceLid = overrideSourceLid self.fitMode = fitMode self.maskShape = maskShape - self.gradientColors = gradientColors + self.colorOverlay = colorOverlay + self.padding = padding + self.margin = margin + self.border = border + self.shadow = shadow } } From 162df237740a4bffc5388e81d5a133b7d90a61b2 Mon Sep 17 00:00:00 2001 From: Josh Holtz Date: Sat, 11 Jan 2025 14:26:22 -0600 Subject: [PATCH 2/3] Update outdated image properties --- .../Components/Image/ImageComponentView.swift | 21 ++++++------ .../Image/ImageComponentViewModel.swift | 32 +++++++++++++++---- .../Template1Preview.swift | 5 ++- .../Template5Preview.swift | 6 ++-- .../Components/PaywallImageComponent.swift | 11 ------- 5 files changed, 46 insertions(+), 29 deletions(-) diff --git a/RevenueCatUI/Templates/V2/Components/Image/ImageComponentView.swift b/RevenueCatUI/Templates/V2/Components/Image/ImageComponentView.swift index 760e4a9520..b693fcfaf7 100644 --- a/RevenueCatUI/Templates/V2/Components/Image/ImageComponentView.swift +++ b/RevenueCatUI/Templates/V2/Components/Image/ImageComponentView.swift @@ -85,13 +85,15 @@ struct ImageComponentView: View { // WIP: Fix this later when accessibility info is available .accessibilityHidden(true) // WIP: Need to replace this gradient with the better one - .overlay( - LinearGradient( - gradient: Gradient(colors: style.gradientColors), - startPoint: .top, - endPoint: .bottom + .applyIfLet(style.colorOverlay, apply: { view, colorOverlay in + view.overlay( + Color.clear + .backgroundStyle( + .color(colorOverlay), + uiConfigProvider: viewModel.uiConfigProvider + ) ) - ) + }) // WIP: this needs more shapes and borders // WIP: this might also need dropshadow .shape(border: nil, @@ -187,9 +189,10 @@ struct ImageComponentView_Previews: PreviewProvider { ) ), fitMode: .fill, - gradientColors: [ - "#ffffff00", "#ffffff00", "#ffffffff" - ] + colorOverlay: .init(light: .linear(0, [ + .init(color: "#ffffff", percent: 0), + .init(color: "#ffffff00", percent: 40) + ])) ) ) ) diff --git a/RevenueCatUI/Templates/V2/Components/Image/ImageComponentViewModel.swift b/RevenueCatUI/Templates/V2/Components/Image/ImageComponentViewModel.swift index 8644b0db69..a946c2b6a0 100644 --- a/RevenueCatUI/Templates/V2/Components/Image/ImageComponentViewModel.swift +++ b/RevenueCatUI/Templates/V2/Components/Image/ImageComponentViewModel.swift @@ -24,7 +24,7 @@ class ImageComponentViewModel { private var introOfferEligibilityContext: IntroOfferEligibilityContext private let localizationProvider: LocalizationProvider - private let uiConfigProvider: UIConfigProvider + let uiConfigProvider: UIConfigProvider private let component: PaywallComponent.ImageComponent private let imageInfo: PaywallComponent.ThemeImageUrls @@ -71,7 +71,11 @@ class ImageComponentViewModel { size: partial?.size ?? self.component.size, fitMode: partial?.fitMode ?? self.component.fitMode, maskShape: partial?.maskShape ?? self.component.maskShape, - gradientColors: partial?.gradientColors ?? self.component.gradientColors + colorOverlay: partial?.colorOverlay ?? self.component.colorOverlay, + padding: partial?.padding ?? self.component.padding, + margin: partial?.margin ?? self.component.margin, + border: partial?.border ?? self.component.border, + shadow: partial?.shadow ?? self.component.shadow ) apply(style) @@ -97,7 +101,11 @@ struct LocalizedImagePartial: PresentedPartial { overrideSourceLid: otherPartial?.overrideSourceLid ?? basePartial?.overrideSourceLid, fitMode: otherPartial?.fitMode ?? basePartial?.fitMode, maskShape: otherPartial?.maskShape ?? basePartial?.maskShape, - gradientColors: otherPartial?.gradientColors ?? basePartial?.gradientColors + colorOverlay: otherPartial?.colorOverlay ?? basePartial?.colorOverlay, + padding: otherPartial?.padding ?? basePartial?.padding, + margin: otherPartial?.margin ?? basePartial?.margin, + border: otherPartial?.border ?? basePartial?.border, + shadow: otherPartial?.shadow ?? basePartial?.shadow ) ) } @@ -134,7 +142,11 @@ struct ImageComponentStyle { let darkLowResUrl: URL? let size: PaywallComponent.Size let shape: ShapeModifier.Shape? - let gradientColors: [Color] + let colorOverlay: PaywallComponent.ColorScheme? + let padding: PaywallComponent.Padding? + let margin: PaywallComponent.Padding? + let border: PaywallComponent.Border? + let shadow: PaywallComponent.Shadow? let contentMode: ContentMode init( @@ -143,7 +155,11 @@ struct ImageComponentStyle { size: PaywallComponent.Size, fitMode: PaywallComponent.FitMode, maskShape: PaywallComponent.MaskShape? = nil, - gradientColors: [PaywallComponent.ColorHex]? = nil + colorOverlay: PaywallComponent.ColorScheme? = nil, + padding: PaywallComponent.Padding? = nil, + margin: PaywallComponent.Padding? = nil, + border: PaywallComponent.Border? = nil, + shadow: PaywallComponent.Shadow? = nil ) { self.visible = visible self.widthLight = source.light.width @@ -156,7 +172,11 @@ struct ImageComponentStyle { self.darkLowResUrl = source.dark?.heicLowRes self.size = size self.shape = maskShape?.shape - self.gradientColors = gradientColors?.compactMap { $0.toColor(fallback: Color.clear) } ?? [] + self.colorOverlay = colorOverlay + self.padding = padding + self.margin = margin + self.border = border + self.shadow = shadow self.contentMode = fitMode.contentMode } diff --git a/RevenueCatUI/Templates/V2/Previews/TemplateComponentsViewPreviews/Template1Preview.swift b/RevenueCatUI/Templates/V2/Previews/TemplateComponentsViewPreviews/Template1Preview.swift index 87c815c06b..312ebacc77 100644 --- a/RevenueCatUI/Templates/V2/Previews/TemplateComponentsViewPreviews/Template1Preview.swift +++ b/RevenueCatUI/Templates/V2/Previews/TemplateComponentsViewPreviews/Template1Preview.swift @@ -34,7 +34,10 @@ private enum Template1Preview { ) ), fitMode: .fit, - gradientColors: ["#ffffff00", "#ffffff00", "#ffffffff"] + colorOverlay: .init(light: .linear(0, [ + .init(color: "#ffffff", percent: 0), + .init(color: "#ffffff00", percent: 40) + ])) ) static let title = PaywallComponent.TextComponent( diff --git a/RevenueCatUI/Templates/V2/Previews/TemplateComponentsViewPreviews/Template5Preview.swift b/RevenueCatUI/Templates/V2/Previews/TemplateComponentsViewPreviews/Template5Preview.swift index ee7a5709d3..aeb793f993 100644 --- a/RevenueCatUI/Templates/V2/Previews/TemplateComponentsViewPreviews/Template5Preview.swift +++ b/RevenueCatUI/Templates/V2/Previews/TemplateComponentsViewPreviews/Template5Preview.swift @@ -40,8 +40,10 @@ private enum Template5Preview { ) ), fitMode: .fill, - maxHeight: 200, - gradientColors: ["#ffffff00", "#ffffff00", "#ffffffff"] + colorOverlay: .init(light: .linear(0, [ + .init(color: "#ffffff", percent: 0), + .init(color: "#ffffff00", percent: 40) + ])) ) static let title = PaywallComponent.TextComponent( diff --git a/Sources/Paywalls/Components/PaywallImageComponent.swift b/Sources/Paywalls/Components/PaywallImageComponent.swift index c1a2505140..d3bb112a33 100644 --- a/Sources/Paywalls/Components/PaywallImageComponent.swift +++ b/Sources/Paywalls/Components/PaywallImageComponent.swift @@ -10,17 +10,6 @@ import Foundation #if PAYWALL_COMPONENTS -//source: ImageScheme | None = None -//override_source_lid: LocalizationId | None = None -//color_overlay: ColorSchemes | None = None -//fit_mode: FitMode | None = None -//mask_shape: MaskShape | None = None -//size: Size | None = None -//padding: Spacing | None = None -//margin: Spacing | None = None -//border: Border | None = None -//shadow: Shadow | None = None - public extension PaywallComponent { struct ImageComponent: PaywallComponentBase { From 09d3c4c7879d9f16ac8c23bca5ba71d58486db7b Mon Sep 17 00:00:00 2001 From: Josh Holtz Date: Mon, 13 Jan 2025 06:59:19 -0600 Subject: [PATCH 3/3] Fix compile issue --- .../V2/Components/Image/ImageComponentView.swift | 6 +----- .../V2/Components/Image/ImageComponentViewModel.swift | 10 ++++++---- 2 files changed, 7 insertions(+), 9 deletions(-) diff --git a/RevenueCatUI/Templates/V2/Components/Image/ImageComponentView.swift b/RevenueCatUI/Templates/V2/Components/Image/ImageComponentView.swift index b693fcfaf7..d4d59726bc 100644 --- a/RevenueCatUI/Templates/V2/Components/Image/ImageComponentView.swift +++ b/RevenueCatUI/Templates/V2/Components/Image/ImageComponentView.swift @@ -87,11 +87,7 @@ struct ImageComponentView: View { // WIP: Need to replace this gradient with the better one .applyIfLet(style.colorOverlay, apply: { view, colorOverlay in view.overlay( - Color.clear - .backgroundStyle( - .color(colorOverlay), - uiConfigProvider: viewModel.uiConfigProvider - ) + Color.clear.backgroundStyle(.color(colorOverlay)) ) }) // WIP: this needs more shapes and borders diff --git a/RevenueCatUI/Templates/V2/Components/Image/ImageComponentViewModel.swift b/RevenueCatUI/Templates/V2/Components/Image/ImageComponentViewModel.swift index a946c2b6a0..0cbf2f19fb 100644 --- a/RevenueCatUI/Templates/V2/Components/Image/ImageComponentViewModel.swift +++ b/RevenueCatUI/Templates/V2/Components/Image/ImageComponentViewModel.swift @@ -75,7 +75,8 @@ class ImageComponentViewModel { padding: partial?.padding ?? self.component.padding, margin: partial?.margin ?? self.component.margin, border: partial?.border ?? self.component.border, - shadow: partial?.shadow ?? self.component.shadow + shadow: partial?.shadow ?? self.component.shadow, + uiConfigProvider: self.uiConfigProvider ) apply(style) @@ -142,7 +143,7 @@ struct ImageComponentStyle { let darkLowResUrl: URL? let size: PaywallComponent.Size let shape: ShapeModifier.Shape? - let colorOverlay: PaywallComponent.ColorScheme? + let colorOverlay: DisplayableColorScheme? let padding: PaywallComponent.Padding? let margin: PaywallComponent.Padding? let border: PaywallComponent.Border? @@ -159,7 +160,8 @@ struct ImageComponentStyle { padding: PaywallComponent.Padding? = nil, margin: PaywallComponent.Padding? = nil, border: PaywallComponent.Border? = nil, - shadow: PaywallComponent.Shadow? = nil + shadow: PaywallComponent.Shadow? = nil, + uiConfigProvider: UIConfigProvider ) { self.visible = visible self.widthLight = source.light.width @@ -172,7 +174,7 @@ struct ImageComponentStyle { self.darkLowResUrl = source.dark?.heicLowRes self.size = size self.shape = maskShape?.shape - self.colorOverlay = colorOverlay + self.colorOverlay = colorOverlay?.asDisplayable(uiConfigProvider: uiConfigProvider) self.padding = padding self.margin = margin self.border = border