PrimerVaultedPaymentMethods

Primer Checkout iOS SDK is currently in beta (v3.0.0-beta.5). The API is subject to change before the stable release.

PrimerVaultedPaymentMethods is the returning-customer shortcut: it renders the selected saved payment method — the first saved one until the customer picks another — with a header and a submit button that pays with it. It is composed from three slots: header, item row, and submit button. The header’s “Show all” action opens the SDK’s saved-payment-methods screen, which lists every saved method and is the only place a customer can delete one.

This is a one-row shortcut, not a full list. If you want every saved method visible inline, build that yourself — iterate PrimerSelectionSession.vaultedPaymentMethods and call selectVaulted(_:) / delete(_:) directly.

The view resolves its PrimerSelectionSession from the environment. Selection, deletion, and CVV recapture are all driven through that session — PrimerVaultedPaymentMethods only composes the UI.

This view reads its session from the environment injected by the .primerCheckoutSession(_:onCompletion:) modifier. Place it inside a view hierarchy that applies that modifier. When no session is present it renders an empty placeholder, and when the customer has no saved methods it renders nothing at all — so you do not need to hide it yourself.

PrimerVaultedPaymentMethods

@available(iOS 15.0, *)
public struct PrimerVaultedPaymentMethods: View {

  public typealias VaultedMethod = PrimerHeadlessUniversalCheckout.VaultedPaymentMethod

  public init(
    header: @escaping (PrimerSelectionSession) -> AnyView
      = { AnyView(VaultedPaymentMethodsDefaults.header($0)) },
    item: @escaping (VaultedMethod, _ isSelected: Bool, _ onSelect: @escaping () -> Void) -> AnyView
      = { AnyView(VaultedPaymentMethodsDefaults.item($0, isSelected: $1, onSelect: $2)) },
    submitButton: @escaping (_ isLoading: Bool, _ isEnabled: Bool, _ onSubmit: @escaping () -> Void) -> AnyView
      = { AnyView(VaultedPaymentMethodsDefaults.submitButton(isLoading: $0, isEnabled: $1, onSubmit: $2)) }
  )
}

Parameter	Type	Default	Description
`header`	`(PrimerSelectionSession) -> AnyView`	`VaultedPaymentMethodsDefaults.header($0)`	Header shown above the row. The default renders the section title plus a “Show all” button wired to `session.showAll()`. Receives the session so custom headers can read state or trigger session actions — if you replace this slot, call `showAll()` yourself or the customer loses the route to deleting a saved method.
`item`	`(VaultedMethod, _ isSelected: Bool, _ onSelect: @escaping () -> Void) -> AnyView`	`VaultedPaymentMethodsDefaults.item(...)`	The row for the selected method. Called once, with `isSelected: true`.
`submitButton`	`(_ isLoading: Bool, _ isEnabled: Bool, _ onSubmit: @escaping () -> Void) -> AnyView`	`VaultedPaymentMethodsDefaults.submitButton(...)`	Submit button below the list. Receives loading state, enabled state, and a callback that pays with the selected method.

Slots are type-erased to AnyView rather than using opaque return types. The three-argument item and submitButton builders hit Swift’s generic-default inference limits, so this view trades the opaque-return ergonomics of PrimerCardForm for guaranteed composition. Wrap any custom slot content in AnyView.

VaultedMethod typealias

public typealias VaultedMethod = PrimerHeadlessUniversalCheckout.VaultedPaymentMethod

VaultedMethod is a convenience alias for PrimerHeadlessUniversalCheckout.VaultedPaymentMethod, the model passed to the item slot.

public final class VaultedPaymentMethod: Codable {
  public let id: String
  public let paymentMethodType: String
  public let paymentInstrumentType: PaymentInstrumentType
  public let paymentInstrumentData: Response.Body.Tokenization.PaymentInstrumentData
  public let analyticsId: String
}

Property	Type	Description
`id`	`String`	Unique identifier for this vaulted method. Use it to drive selection and deletion.
`paymentMethodType`	`String`	Payment method type (e.g. `"PAYMENT_CARD"`, `"PAYPAL"`).
`paymentInstrumentType`	`PaymentInstrumentType`	Type of payment instrument (e.g. card, bank account).
`paymentInstrumentData`	`Response.Body.Tokenization.PaymentInstrumentData`	Detailed instrument data: card network, masked digits, expiry, external payer info, BIN data.
`analyticsId`	`String`	Identifier used for analytics tracking.

Usage

The default slots produce a complete, themed saved-method shortcut — no slot arguments are required:

import SwiftUI
import PrimerSDK

@available(iOS 15.0, *)
struct SavedMethodsView: View {
  var body: some View {
    PrimerVaultedPaymentMethods()
  }
}

Wrap the view in a hierarchy that injects a checkout session:

import SwiftUI
import PrimerSDK

@available(iOS 15.0, *)
struct CheckoutScreen: View {
  let clientToken: String

  var body: some View {
    ScrollView {
      PrimerVaultedPaymentMethods()
        .padding()
    }
    .primerCheckoutSession(clientToken) { result in
      // Handle the payment result
    }
  }
}

Customizing slots

Provide any combination of slots; omitted slots fall back to their defaults. Custom content must be wrapped in AnyView.

import SwiftUI
import PrimerSDK

@available(iOS 15.0, *)
struct CustomVaultedMethods: View {
  var body: some View {
    PrimerVaultedPaymentMethods(
      header: { session in
        AnyView(
          HStack {
            Text("Pay faster with a saved card")
              .font(.headline)
            Spacer()
            // Keep a route to the SDK's saved-methods screen — it is where
            // the customer switches methods or deletes one.
            Button("Manage") { session.showAll() }
          }
        )
      },
      item: { method, isSelected, onSelect in
        AnyView(
          Button(action: onSelect) {
            HStack {
              Text(method.paymentMethodType)
              Spacer()
              if isSelected {
                Image(systemName: "checkmark.circle.fill")
              }
            }
            .padding()
          }
          .buttonStyle(.plain)
        )
      }
    )
  }
}

Use the isSelected flag the item slot receives to render selection affordances (checkmarks, borders, highlights). Calling onSelect marks the row’s method as the active vaulted method so the next submit targets it.

Driving selection, deletion, and CVV

PrimerVaultedPaymentMethods delegates all behavior to PrimerSelectionSession. Read vaultedPaymentMethods and call the session methods directly from custom slots.

Member	Signature	Description
`vaultedPaymentMethods`	`var vaultedPaymentMethods: [PrimerHeadlessUniversalCheckout.VaultedPaymentMethod] { get }`	Saved methods for the current customer, loaded once during checkout initialization. Empty while loading or when none exist.
`selectVaulted(_:)`	`func selectVaulted(_ method: PrimerHeadlessUniversalCheckout.VaultedPaymentMethod)`	Marks a vaulted method as selected so a subsequent submit targets it. Backing the `item` slot’s `onSelect`.
`delete(_:)`	`func delete(_ method: PrimerHeadlessUniversalCheckout.VaultedPaymentMethod) async throws`	Deletes a saved method immediately — no confirmation — then refreshes `vaultedPaymentMethods`.
`showAll()`	`func showAll()`	Presents the SDK’s saved-payment-methods screen, where the customer can pick a different method or delete one. Backs the default header’s “Show all”.
`updateCvvInput(_:)`	`func updateCvvInput(_ cvv: String)`	Updates and validates the CVV during CVV recapture, driving `state.cvvInput`, `state.isCvvValid`, and `state.cvvError`.

The selection state read by the slots lives on session.state (PrimerPaymentMethodSelectionState):

Property	Type	Description
`selectedVaultedPaymentMethod`	`PrimerHeadlessUniversalCheckout.VaultedPaymentMethod?`	The currently selected vaulted method, or `nil`. Compare its `id` to highlight the selected row.
`isVaultPaymentLoading`	`Bool`	`true` while a vaulted payment is in flight. Backs the submit slot’s `isLoading`.
`requiresCvvInput`	`Bool`	`true` when the selected card requires CVV recapture before submitting.
`cvvInput`	`String`	The CVV value entered during recapture.
`isCvvValid`	`Bool`	`true` when the entered CVV passes validation.
`cvvError`	`String?`	CVV validation error message, if any.

CVV recapture is handled by the SDK and is not a customizable slot. When the selected vaulted card requires a CVV, the view inserts a managed CVV field between the row and the submit button, wired to updateCvvInput(_:). When recapture is required, the submit button stays disabled until a valid CVV is entered.

VaultedPaymentMethodsDefaults

The default slot content. Because PrimerVaultedPaymentMethods erases its slots to AnyView, these helpers return some View. Compose them inside custom slots to keep the default look while overriding only part of the layout.

@available(iOS 15.0, *)
public enum VaultedPaymentMethodsDefaults {

  public static func header(_ session: PrimerSelectionSession) -> some View

  public static func item(
    _ method: PrimerHeadlessUniversalCheckout.VaultedPaymentMethod,
    isSelected: Bool,
    onSelect: @escaping () -> Void
  ) -> some View

  public static func submitButton(
    isLoading: Bool,
    isEnabled: Bool,
    onSubmit: @escaping () -> Void
  ) -> some View

  @MainActor
  @ViewBuilder
  public static func cvvInput(_ session: PrimerSelectionSession) -> some View

  public static func unavailable() -> some View
}

Method	Description
`header(_:)`	Default section header: the title “Saved payment methods” plus a “Show all” button that calls `session.showAll()`.
`item(_:isSelected:onSelect:)`	Default vaulted method row with brand icon, label, and a selection checkmark.
`submitButton(isLoading:isEnabled:onSubmit:)`	Default pay button. Shows a progress spinner while `isLoading` and dims while disabled.
`cvvInput(_:)`	SDK-managed CVV recapture field, shown only when `session.state.requiresCvvInput` is `true`. Rendered automatically by the view — not a slot you pass in.
`unavailable()`	Empty placeholder rendered when no `PrimerSelectionSession` is available in the environment.

Reuse a default while customizing a sibling slot:

PrimerVaultedPaymentMethods(
  submitButton: { isLoading, isEnabled, onSubmit in
    AnyView(VaultedPaymentMethodsDefaults.submitButton(
      isLoading: isLoading,
      isEnabled: isEnabled,
      onSubmit: onSubmit
    ))
  }
)

PrimerSelectionSession

Selection, deletion, and CVV actions for payment methods and vaulted methods.

PrimerPaymentMethods

Slot-based list of available (non-vaulted) payment methods.

PaymentMethodsDefaults

Default slot content for the payment methods list.

PrimerCardForm

Slot-based card entry form for new cards.

​PrimerVaultedPaymentMethods

​VaultedMethod typealias

​Usage

​Customizing slots

​Driving selection, deletion, and CVV

​VaultedPaymentMethodsDefaults

​See also

PrimerSelectionSession

PrimerPaymentMethods

PaymentMethodsDefaults

PrimerCardForm

PrimerVaultedPaymentMethods

VaultedMethod typealias

Usage

Customizing slots

Driving selection, deletion, and CVV

VaultedPaymentMethodsDefaults

See also