Paywalls: Small fixes and examples for UIKit and modes (#288)

## Motivation / Description

Improving docs from questions and examples that were given in beta
tester Discord

## Changes introduced

- Fixed a variable typo
- Added UIKit example to full screen paywall
- Added mode examples for SwiftUI and UIKit

## Jira ticket (if any)

N/A

## Additional comments

N/A

code_blocks/🚀 Getting Started/displaying-products/paywalls/paywalls_1.swift

@@ -1,3 +1,6 @@
+import SwiftUI
+
+import RevenueCat
 import RevenueCatUI
 
 struct App: View {

code_blocks/🚀 Getting Started/displaying-products/paywalls/paywalls_2.swift

@@ -1,3 +1,6 @@
+import SwiftUI
+
+import RevenueCat
 import RevenueCatUI
 
 struct App: View {

code_blocks/🚀 Getting Started/displaying-products/paywalls/paywalls_3.swift

@@ -1,3 +1,6 @@
+import SwiftUI
+
+import RevenueCat
 import RevenueCatUI
 
 struct App: View {

code_blocks/🚀 Getting Started/displaying-products/paywalls/paywalls_4.swift

@@ -0,0 +1,27 @@
+import UIKit
+
+import RevenueCat
+import RevenueCatUI
+
+class ViewController: UIViewController {
+
+    override func viewDidLoad() {
+        super.viewDidLoad()
+    }
+
+    @IBAction func presentPaywall() {
+        let controller = PaywallViewController()
+        controller.delegate = self
+
+        present(controller, animated: true, completion: nil)
+    }
+}
+
+extension ViewController: PaywallViewControllerDelegate {
+
+    func paywallViewController(_ controller: PaywallViewController,
+                               didFinishPurchasingWith customerInfo: CustomerInfo) {
+
+    }
+
+}

code_blocks/🚀 Getting Started/displaying-products/paywalls/paywalls_5.swift

@@ -0,0 +1,27 @@
+import SwiftUI
+
+import RevenueCat
+import RevenueCatUI
+
+struct App: View {
+
+    var body: some View {
+        VStack {
+            ScrollView {
+                VStack {
+                    // Your custom paywall design content
+                }.frame(maxWidth: .infinity)
+            }
+
+            Spacer()
+
+            PaywallView(mode: .condensedCard) // or .card
+        }
+        .frame(maxWidth: .infinity, maxHeight: .infinity)
+        .background(
+            Color(white: 0.8)
+                .edgesIgnoringSafeArea(.all)
+        )
+    }
+
+}

code_blocks/🚀 Getting Started/displaying-products/paywalls/paywalls_6.swift

@@ -0,0 +1,30 @@
+import UIKit
+
+import RevenueCat
+import RevenueCatUI
+
+class ViewController: UIViewController {
+
+    override func viewDidLoad() {
+        super.viewDidLoad()
+
+        let paywallView = PaywallView(mode: .condensedCard) // or .card
+        paywall.delegate = self
+
+        let hostingController = UIHostingController(rootView: paywallView)
+
+        addChild(hostingController)
+        view.addSubview(hostingController.view)
+        hostingController.didMove(toParent: self)
+    }
+
+}
+
+extension ViewController: PaywallViewControllerDelegate {
+
+    func paywallViewController(_ controller: PaywallViewController,
+                               didFinishPurchasingWith customerInfo: CustomerInfo) {
+
+    }
+
+}

docs_source/🚀 Getting Started/displaying-products/paywalls.md

@@ -85,7 +85,7 @@ For some Paywall strings you may want to set values based on the package that’
 
 To make this easier and ensure accuracy, we recommend using **Variables** for these values that are package-specific.
 
-For example, to show a CTA like “Try 7 Days Free & Subscribe”, you should instead use the **{{ sub_offer_duration }}** variable, and enter “Try {{ intro_duration }} Free & Subscribe” to ensure the string is accurate for any product you use, even if you make changes to the nature of the offer in the future.
+For example, to show a CTA like “Try 7 Days Free & Subscribe”, you should instead use the **{{ sub_offer_duration }}** variable, and enter “Try {{ sub_offer_duration }} Free & Subscribe” to ensure the string is accurate for any product you use, even if you make changes to the nature of the offer in the future.
 
 We support the following variables:
 
@@ -111,7 +111,7 @@ RevenueCat Paywalls automatically check for Introductory Offer eligibility, and
 
 #### Uploading images
 
-Use the **Select a file** button for the applicable image to upload your own to use for your Paywall. We’ll center and scale the image to fit, regardless of its aspect ratio, so we recommend using source images that are appropriate for the area of the template they cover. We support .jpg, jpeg, and .png files up to 5mb.
+Use the **Select a file** button for the applicable image to upload your own to use for your Paywall. We’ll center and scale the image to fit, regardless of its aspect ratio, so we recommend using source images that are appropriate for the area of the template they cover. We support .jpg, jpeg, and .png files up to 5MB.
 
 #### Colors
 
@@ -121,7 +121,11 @@ Use your own hex codes, select a custom color, or use our color picker to select
 > 
 > The color picker can be used outside of your browser window as well if you need to grab colors from assets in other applications.
 
-## How to display a Paywall in your app
+## How to display a fullscreen Paywall in your app
+
+RevenueCat Paywalls will, by default, show paywalls fullscreen and there are multiple ways to do this with SwiftUI and UIKit.
+
+### SwiftUI
 
 1. Option 1: `presentPaywallIfNeeded` depending on an entitlement
 [block:file]
@@ -134,7 +138,7 @@ Use your own hex codes, select a custom color, or use our color picker to select
 ]
 [/block]
 
-2. Option 2 `presentPaywallIfNeeded` with custom logic:
+2. Option 2: `presentPaywallIfNeeded` with custom logic
 [block:file]
 [
   {
@@ -145,7 +149,7 @@ Use your own hex codes, select a custom color, or use our color picker to select
 ]
 [/block]
 
-3. Option 3: present manually:
+3. Option 3: present manually
 [block:file]
 [
   {
@@ -156,6 +160,55 @@ Use your own hex codes, select a custom color, or use our color picker to select
 ]
 [/block]
 
+### UIKIt
+
+1. Option 1: manually present `PaywallViewController`
+[block:file]
+[
+  {
+    "language": "swift",
+    "name": "",
+    "file": "code_blocks/🚀 Getting Started/displaying-products/paywalls/paywalls_4.swift"
+  }
+]
+[/block]
+
+## How to embed a Paywall into your views
+
+RevenueCatUI also has smaller paywalls for you to embed or overlay in your app. You could display these as inline banners in your app, overlay your app as a sheet promoting an upgrade, or as a footer in a custom paywall.
+
+This can all be done by passing `PaywallViewMode` into `PaywallView`. The options are:
+- `PaywallViewMode.fullScreen`
+- `PaywallViewMode.card`
+- `PaywallViewMode.condensedCard`
+
+### SwiftUI
+
+1. Option 1: `PaywallView` in `UIHostingController`
+[block:file]
+[
+  {
+    "language": "swift",
+    "name": "",
+    "file": "code_blocks/🚀 Getting Started/displaying-products/paywalls/paywalls_5.swift"
+  }
+]
+[/block]
+
+### UIKit
+
+1. Option 1: `PaywallView` in `UIHostingController`
+[block:file]
+[
+  {
+    "language": "swift",
+    "name": "",
+    "file": "code_blocks/🚀 Getting Started/displaying-products/paywalls/paywalls_6.swift"
+  }
+]
+[/block]
+
+
 ## Limitations
 
 #### Platforms (support for more coming)