Skip to main content
PrimerSelectCountryScope manages the country picker UI, exposed via PrimerCardFormScope.selectCountry. Use it to customize the country selection experience.

Declaration

@MainActor
public protocol PrimerSelectCountryScope

Properties

PropertyTypeDescription
stateAsyncStream<PrimerSelectCountryState>Stream of country picker state changes

Customization

PropertyTypeDescription
screen((PrimerSelectCountryScope) -> AnyView)?Full screen replacement
searchBar((String, (String) -> Void, String) -> AnyView)?Custom search bar. Parameters: query, onQueryChange, placeholder
countryItemCountryItemComponent?Custom country row. Signature: (PrimerCountry, @escaping () -> Void) -> any View

Methods

MethodDescription
onCountrySelected(countryCode:countryName:)Select a country
cancel()Cancel the picker
onSearch(query:)Filter countries by search text

Accessing the scope

The country picker scope is accessed through PrimerCardFormScope.selectCountry:
if let cardScope: PrimerCardFormScope = checkoutScope.getPaymentMethodScope(PrimerCardFormScope.self) {
  let countryScope = cardScope.selectCountry

  // Customize the country picker
  countryScope.countryItem = { country, onSelect in
    AnyView(
      Button(action: onSelect) {
        HStack {
          if let flag = country.flag {
            Text(flag)
          }
          Text(country.name)
          Spacer()
          Text(country.code)
            .foregroundColor(.secondary)
        }
        .padding(.vertical, 8)
      }
    )
  }
}

PrimerSelectCountryState

public struct PrimerSelectCountryState: Equatable {
  var countries: [PrimerCountry]
  var filteredCountries: [PrimerCountry]
  var searchQuery: String
  var isLoading: Bool
  var selectedCountry: PrimerCountry?
}
PropertyTypeDescription
countries[PrimerCountry]All available countries
filteredCountries[PrimerCountry]Countries matching search query
searchQueryStringCurrent search text
isLoadingBoolLoading state
selectedCountryPrimerCountry?Currently selected country

PrimerCountry

public struct PrimerCountry: Equatable {
  let code: String      // ISO 3166-1 alpha-2 (e.g., "US")
  let name: String      // Localized name
  let flag: String?     // Flag emoji
  let dialCode: String? // Dialing code
}

See also

PrimerCardFormScope

Parent scope for the country picker