āāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāā ā š shadcn/directory/clerk/clerk-docs/reference/components/authentication/auth-view ā āāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāā
āāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāā
ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā
title: 'AuthView'
description: Clerk's AuthView renders a UI for signing in and signing up users on iOS.
sdk: ios
{{ style: { maxWidth: '460px' } }}
The AuthView renders a comprehensive authentication interface with support for multiple sign-up flows and sign-in methods, multi-factor authentication, password reset, and account recovery. The functionality of the AuthView is controlled by the instance settings you specify in the Clerk Dashboard, such as sign-in and sign-up options and social connections.
Parameters
<Properties> - `mode` - `AuthView.Mode`The authentication mode that determines which flows are available to the user. Accepts the following values:
.signInOrUp: Automatically determines whether to sign users in or sign them up based on whether they already have an account. This is the default mode that provides seamless authentication without requiring users to choose between sign-in and sign-up..signIn: Restricts the interface to sign-in flows only. Users can only authenticate with existing accounts..signUp: Restricts the interface to sign-up flows only. Users can only create new accounts.
Defaults to .signInOrUp.
isDismissableBool
Whether the view can be dismissed by the user. When true, a dismiss button appears and the view closes automatically after successful authentication. When false, no dismiss button is shown. Defaults to true.
</Properties>
Usage
The following examples show how to use the AuthView component in your iOS app.
Basic usage as a dismissable sheet
struct HomeView: View {
@Environment(\.clerk) private var clerk
@State private var authIsPresented = false
var body: some View {
ZStack {
if clerk.user != nil {
UserButton()
.frame(width: 36, height: 36)
} else {
Button("Sign in") {
authIsPresented = true
}
}
}
.sheet(isPresented: $authIsPresented) {
AuthView()
}
}
}
Full-screen authentication (non-dismissable)
struct ProfileView: View {
@Environment(\.clerk) private var clerk
var body: some View {
if clerk.user != nil {
UserProfileView(isDismissable: false)
} else {
AuthView(isDismissable: false)
}
}
}
Customization
<Include src="_partials/ios/customization" />ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā
āāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāā