> ## Documentation Index
> Fetch the complete documentation index at: https://primer.io/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# SwiftUI navigation

> Integrate Primer Checkout with NavigationStack, sheets, and modals

Primer Checkout is a standard SwiftUI `View`. Integrate it with any SwiftUI navigation pattern.

## NavigationStack

```swift theme={"dark"}
struct ContentView: View {
  @State private var path = NavigationPath()
  let clientToken: String

  var body: some View {
    NavigationStack(path: $path) {
      CartView(onCheckout: {
        path.append("checkout")
      })
      .navigationDestination(for: String.self) { destination in
        if destination == "checkout" {
          PrimerCheckout(
            clientToken: clientToken,
            onCompletion: { state in
              if case .success = state {
                path.append("confirmation")
              }
            }
          )
          .navigationTitle("Payment")
          .navigationBarTitleDisplayMode(.inline)
        }
      }
    }
  }
}
```

## Sheet presentation

```swift theme={"dark"}
struct ContentView: View {
  @State private var showCheckout = false
  let clientToken: String

  var body: some View {
    Button("Checkout") {
      showCheckout = true
    }
    .sheet(isPresented: $showCheckout) {
      PrimerCheckout(
        clientToken: clientToken,
        onCompletion: { state in
          if case .success = state {
            showCheckout = false
          }
        }
      )
    }
  }
}
```

## Full-screen cover

```swift theme={"dark"}
struct ContentView: View {
  @State private var showCheckout = false
  let clientToken: String

  var body: some View {
    Button("Checkout") {
      showCheckout = true
    }
    .fullScreenCover(isPresented: $showCheckout) {
      NavigationView {
        PrimerCheckout(
          clientToken: clientToken,
          onCompletion: { state in
            if case .success = state, case .dismissed = state {
              showCheckout = false
            }
          }
        )
        .navigationTitle("Payment")
        .navigationBarTitleDisplayMode(.inline)
        .toolbar {
          ToolbarItem(placement: .cancellationAction) {
            Button("Cancel") {
              showCheckout = false
            }
          }
        }
      }
    }
  }
}
```

## Dismissal handling

Handle checkout dismissal to keep navigation state consistent:

```swift theme={"dark"}
PrimerCheckout(
  clientToken: clientToken,
  onCompletion: { state in
    switch state {
    case .success:
      // Navigate forward
      showCheckout = false
      showConfirmation = true
    case .dismissed:
      // User swiped to dismiss or tapped close
      showCheckout = false
    case .failure:
      // Error is shown in the checkout UI — don't dismiss
      break
    default:
      break
    }
  }
)
```

## See also

<CardGroup cols={2}>
  <Card title="UIKit integration" icon="apple" href="/sdk/ios-checkout/v3.0.0-beta/integration-patterns/uikit-integration">
    Use with UIKit
  </Card>

  <Card title="Handle payment result" icon="arrow-right" href="/sdk/ios-checkout/v3.0.0-beta/guides-and-recipes/handle-payment-result">
    React to payment outcomes
  </Card>
</CardGroup>
