Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions docs/_partials/ios/customization.mdx
Original file line number Diff line number Diff line change
@@ -1,3 +1,3 @@
To learn how to customize Clerk iOS components, see the [dedicated guide](/docs/reference/ios/clerk-theme).
To learn how to customize Clerk iOS views, see the [dedicated guide](/docs/reference/ios/clerk-theme).

If Clerk's prebuilt components don't meet your specific needs or if you require more control over the logic, you can rebuild the existing Clerk flows using the Clerk API. For more information, see the [custom flow guides](/docs/guides/development/custom-flows/overview).
If Clerk's prebuilt views don't meet your specific needs or if you require more control over the logic, you can rebuild the existing Clerk flows using the Clerk API. For more information, see the [custom flow guides](/docs/guides/development/custom-flows/overview).
12 changes: 6 additions & 6 deletions docs/getting-started/quickstart.ios.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -105,11 +105,11 @@ icon: "clerk",
}
```

## Use Clerk's prebuilt components
## Use Clerk's prebuilt views

Clerk provides prebuilt SwiftUI components that handle authentication flows and user management, eliminating the need to build custom forms and flows.
Clerk provides prebuilt SwiftUI views that handle authentication flows and user management, eliminating the need to build custom forms and flows.

Update your `ContentView` to use Clerk's prebuilt components. Replace the existing content with the following code:
Update your `ContentView` to use Clerk's prebuilt views. Replace the existing content with the following code:

```swift {{ filename: 'ContentView.swift', mark: [2, 5, 6, [9, 21]] }}
import SwiftUI
Expand Down Expand Up @@ -137,11 +137,11 @@ icon: "clerk",
}
```

The updated `ContentView` uses two key Clerk components:
The updated `ContentView` uses two key Clerk views:

- [`AuthView`](/docs/reference/components/authentication/auth-view): A comprehensive authentication view that handles sign-in and sign-up flows, including email verification, password reset, and multi-factor authentication. It's presented as a sheet when the user taps "Sign in".
- [`AuthView`](/docs/reference/views/authentication/auth-view): A comprehensive authentication view that handles sign-in and sign-up flows, including email verification, password reset, and multi-factor authentication. It's presented as a sheet when the user taps "Sign in".

- [`UserButton`](/docs/reference/components/user/user-button): A circular button that displays the user's profile image. When tapped, it automatically presents the [`UserProfileView`](/docs/reference/components/user/user-profile-view) where users can manage their account, update their profile, and sign out.
- [`UserButton`](/docs/reference/views/user/user-button): A circular button that displays the user's profile image. When tapped, it automatically presents the [`UserProfileView`](/docs/reference/views/user/user-profile-view) where users can manage their account, update their profile, and sign out.

## Create your first user

Expand Down
64 changes: 47 additions & 17 deletions docs/index.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -6,29 +6,59 @@ template: wide

Find all the guides and resources you need to develop with Clerk.

<Cards cols={4} level={2}>
- [Quickstarts & Tutorials](/docs/getting-started/quickstart/overview)
- Explore our end-to-end tutorials and getting started guides for different application stacks using Clerk.
- {<svg viewBox="0 0 32 32" fill="none"><g fill="currentColor"><path fillOpacity=".15" fillRule="evenodd" d="M16 31.25c8.422 0 15.25-6.828 15.25-15.25S24.422.75 16 .75.75 7.578.75 16 7.578 31.25 16 31.25Zm-5.25-21.5L23.25 16l-12.5 6.25V9.75Z" clipRule="evenodd"/><path d="m23.25 16 .335.67a.75.75 0 0 0 0-1.34l-.335.67Zm-12.5-6.25.335-.67A.75.75 0 0 0 10 9.75h.75Zm0 12.5H10a.75.75 0 0 0 1.085.67l-.335-.67ZM30.5 16c0 8.008-6.492 14.5-14.5 14.5V32c8.837 0 16-7.163 16-16h-1.5ZM16 1.5c8.008 0 14.5 6.492 14.5 14.5H32c0-8.837-7.163-16-16-16v1.5ZM1.5 16C1.5 7.992 7.992 1.5 16 1.5V0C7.163 0 0 7.163 0 16h1.5ZM16 30.5C7.992 30.5 1.5 24.008 1.5 16H0c0 8.837 7.163 16 16 16v-1.5Zm7.585-15.17-12.5-6.25-.67 1.34 12.5 6.25.67-1.34Zm-12.5 7.59 12.5-6.25-.67-1.34-12.5 6.25.67 1.34ZM10 9.75v12.5h1.5V9.75H10Z"/></g></svg>}
<If
sdk={["nextjs", "react", "astro", "chrome-extension", "expo", "android", "js-frontend", "nuxt", "react-router", "remix", "tanstack-react-start", "vue", "js-backend", "expressjs", "go", "fastify", "ruby"]}
>
<Cards cols={4} level={2}>
- [Quickstarts & Tutorials](/docs/getting-started/quickstart/overview)
- Explore our end-to-end tutorials and getting started guides for different application stacks using Clerk.
- {<svg viewBox="0 0 32 32" fill="none"><g fill="currentColor"><path fillOpacity=".15" fillRule="evenodd" d="M16 31.25c8.422 0 15.25-6.828 15.25-15.25S24.422.75 16 .75.75 7.578.75 16 7.578 31.25 16 31.25Zm-5.25-21.5L23.25 16l-12.5 6.25V9.75Z" clipRule="evenodd"/><path d="m23.25 16 .335.67a.75.75 0 0 0 0-1.34l-.335.67Zm-12.5-6.25.335-.67A.75.75 0 0 0 10 9.75h.75Zm0 12.5H10a.75.75 0 0 0 1.085.67l-.335-.67ZM30.5 16c0 8.008-6.492 14.5-14.5 14.5V32c8.837 0 16-7.163 16-16h-1.5ZM16 1.5c8.008 0 14.5 6.492 14.5 14.5H32c0-8.837-7.163-16-16-16v1.5ZM1.5 16C1.5 7.992 7.992 1.5 16 1.5V0C7.163 0 0 7.163 0 16h1.5ZM16 30.5C7.992 30.5 1.5 24.008 1.5 16H0c0 8.837 7.163 16 16 16v-1.5Zm7.585-15.17-12.5-6.25-.67 1.34 12.5 6.25.67-1.34Zm-12.5 7.59 12.5-6.25-.67-1.34-12.5 6.25.67 1.34ZM10 9.75v12.5h1.5V9.75H10Z"/></g></svg>}

---
---

- [UI Components](/docs/reference/components/overview)
- Clerk's prebuilt UI components give you a beautiful, fully-functional user management experience in minutes.
- {<svg viewBox="0 0 32 32" fill="none"><path fill="currentColor" fillOpacity=".15" d="M16 31.25 1.962 25.234A2 2 0 0 1 .75 23.395V7.285l14.462-6.197a2 2 0 0 1 1.576 0L31.25 7.286 16 13.896V31.25Z"/><path fill="currentColor" d="m16 31.25-.295.69a.75.75 0 0 0 1.045-.69H16ZM1.962 25.234l-.295.69.295-.69ZM.75 7.286l-.295-.69a.75.75 0 0 0-.455.69h.75Zm30.5 0 .298.688a.75.75 0 0 0-.003-1.378l-.295.69ZM16.788 1.088l-.296.689.296-.69Zm-1.576 0 .296.689-.296-.69Zm1.083 29.473L2.258 24.544l-.591 1.38 14.038 6.015.59-1.378ZM1.5 23.395V7.285H0v16.11h1.5ZM31.545 6.596 17.083.398l-.59 1.379 14.462 6.198.59-1.379ZM14.917.398.455 6.596l.59 1.38 14.463-6.199-.591-1.379ZM.452 7.974l15.25 6.61.596-1.376-15.25-6.61-.596 1.376Zm15.846 6.61 15.25-6.61-.596-1.376-15.25 6.61.596 1.377Zm-1.048-.688V31.25h1.5V13.896h-1.5ZM17.083.399a2.75 2.75 0 0 0-2.166 0l.59 1.379a1.25 1.25 0 0 1 .985 0l.591-1.379ZM2.258 24.544a1.25 1.25 0 0 1-.758-1.149H0c0 1.1.656 2.095 1.667 2.528l.59-1.379Z"/><path stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="1.5" d="M31.25 7.281v16.11a2 2 0 0 1-1.212 1.838L16 31.246"/></svg>}
- [UI Components](/docs/reference/components/overview)
- Clerk's prebuilt UI components give you a beautiful, fully-functional user management experience in minutes.
- {<svg viewBox="0 0 32 32" fill="none"><path fill="currentColor" fillOpacity=".15" d="M16 31.25 1.962 25.234A2 2 0 0 1 .75 23.395V7.285l14.462-6.197a2 2 0 0 1 1.576 0L31.25 7.286 16 13.896V31.25Z"/><path fill="currentColor" d="m16 31.25-.295.69a.75.75 0 0 0 1.045-.69H16ZM1.962 25.234l-.295.69.295-.69ZM.75 7.286l-.295-.69a.75.75 0 0 0-.455.69h.75Zm30.5 0 .298.688a.75.75 0 0 0-.003-1.378l-.295.69ZM16.788 1.088l-.296.689.296-.69Zm-1.576 0 .296.689-.296-.69Zm1.083 29.473L2.258 24.544l-.591 1.38 14.038 6.015.59-1.378ZM1.5 23.395V7.285H0v16.11h1.5ZM31.545 6.596 17.083.398l-.59 1.379 14.462 6.198.59-1.379ZM14.917.398.455 6.596l.59 1.38 14.463-6.199-.591-1.379ZM.452 7.974l15.25 6.61.596-1.376-15.25-6.61-.596 1.376Zm15.846 6.61 15.25-6.61-.596-1.376-15.25 6.61.596 1.377Zm-1.048-.688V31.25h1.5V13.896h-1.5ZM17.083.399a2.75 2.75 0 0 0-2.166 0l.59 1.379a1.25 1.25 0 0 1 .985 0l.591-1.379ZM2.258 24.544a1.25 1.25 0 0 1-.758-1.149H0c0 1.1.656 2.095 1.667 2.528l.59-1.379Z"/><path stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="1.5" d="M31.25 7.281v16.11a2 2 0 0 1-1.212 1.838L16 31.246"/></svg>}

---
---

- [SDK Reference](/docs/reference/overview)
- Dig into our SDK reference documentation. We have everything you need to get started setting up authentication with Clerk.
- {<svg viewBox="0 0 32 32" fill="none"><path fill="currentColor" fillOpacity=".15" d="M1.25 10.25a1 1 0 0 1 1-1h29v21h-26a4 4 0 0 1-4-4v-16Z"/><rect width="30.5" height="28.5" x=".75" y="1.75" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="1.5" rx="4"/><path stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="1.5" d="m19.75 16.75 3.5 3.25-3.5 3.25M12.25 16.75 8.75 20l3.5 3.25M4.75 8.75h22.5"/></svg>}
- [SDK Reference](/docs/reference/overview)
- Dig into our SDK reference documentation. We have everything you need to get started setting up authentication with Clerk.
- {<svg viewBox="0 0 32 32" fill="none"><path fill="currentColor" fillOpacity=".15" d="M1.25 10.25a1 1 0 0 1 1-1h29v21h-26a4 4 0 0 1-4-4v-16Z"/><rect width="30.5" height="28.5" x=".75" y="1.75" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="1.5" rx="4"/><path stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="1.5" d="m19.75 16.75 3.5 3.25-3.5 3.25M12.25 16.75 8.75 20l3.5 3.25M4.75 8.75h22.5"/></svg>}

---
---

- [Security](/docs/guides/secure/restricting-access)
- Account security is the top concern of every feature we build. This documentation lists some of the many protections included with Clerk.
- {<svg viewBox="0 0 32 32" fill="none"><path stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="1.5" d="M23.382 20.897c0-4.45-3.753-8.059-8.382-8.059-4.63 0-8.382 3.608-8.382 8.059 0 3.045 1.098 5.843 2.933 8.05a13.248 13.248 0 0 0 2.106 2.023M29.25 12.402C26.292 7.826 21.016 4.78 15 4.78S3.708 7.826.75 12.402m24.309-9.184A21.525 21.525 0 0 0 15 .75c-3.645 0-7.073.895-10.059 2.468M20.03 31.25c-5.222-.775-9.22-5.115-9.22-10.353 0-2.225 1.876-4.03 4.191-4.03s4.191 1.805 4.191 4.03c0 2.225 1.877 4.03 4.191 4.03 2.315 0 4.191-1.805 4.191-4.03 0-6.676-5.629-12.088-12.573-12.088-6.944 0-12.574 5.412-12.574 12.088 0 2.037.525 3.957 1.45 5.641M15 20.091c0 4.45 3.753 8.059 8.382 8.059.574 0 1.135-.056 1.677-.162"/></svg>}
</Cards>
- [Security](/docs/guides/secure/restricting-access)
- Account security is the top concern of every feature we build. This documentation lists some of the many protections included with Clerk.
- {<svg viewBox="0 0 32 32" fill="none"><path stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="1.5" d="M23.382 20.897c0-4.45-3.753-8.059-8.382-8.059-4.63 0-8.382 3.608-8.382 8.059 0 3.045 1.098 5.843 2.933 8.05a13.248 13.248 0 0 0 2.106 2.023M29.25 12.402C26.292 7.826 21.016 4.78 15 4.78S3.708 7.826.75 12.402m24.309-9.184A21.525 21.525 0 0 0 15 .75c-3.645 0-7.073.895-10.059 2.468M20.03 31.25c-5.222-.775-9.22-5.115-9.22-10.353 0-2.225 1.876-4.03 4.191-4.03s4.191 1.805 4.191 4.03c0 2.225 1.877 4.03 4.191 4.03 2.315 0 4.191-1.805 4.191-4.03 0-6.676-5.629-12.088-12.573-12.088-6.944 0-12.574 5.412-12.574 12.088 0 2.037.525 3.957 1.45 5.641M15 20.091c0 4.45 3.753 8.059 8.382 8.059.574 0 1.135-.056 1.677-.162"/></svg>}
</Cards>
</If>

<If sdk={["ios"]}>
<Cards cols={4} level={2}>
- [Quickstarts & Tutorials](/docs/getting-started/quickstart/overview)
- Explore our end-to-end tutorials and getting started guides for different application stacks using Clerk.
- {<svg viewBox="0 0 32 32" fill="none"><g fill="currentColor"><path fillOpacity=".15" fillRule="evenodd" d="M16 31.25c8.422 0 15.25-6.828 15.25-15.25S24.422.75 16 .75.75 7.578.75 16 7.578 31.25 16 31.25Zm-5.25-21.5L23.25 16l-12.5 6.25V9.75Z" clipRule="evenodd"/><path d="m23.25 16 .335.67a.75.75 0 0 0 0-1.34l-.335.67Zm-12.5-6.25.335-.67A.75.75 0 0 0 10 9.75h.75Zm0 12.5H10a.75.75 0 0 0 1.085.67l-.335-.67ZM30.5 16c0 8.008-6.492 14.5-14.5 14.5V32c8.837 0 16-7.163 16-16h-1.5ZM16 1.5c8.008 0 14.5 6.492 14.5 14.5H32c0-8.837-7.163-16-16-16v1.5ZM1.5 16C1.5 7.992 7.992 1.5 16 1.5V0C7.163 0 0 7.163 0 16h1.5ZM16 30.5C7.992 30.5 1.5 24.008 1.5 16H0c0 8.837 7.163 16 16 16v-1.5Zm7.585-15.17-12.5-6.25-.67 1.34 12.5 6.25.67-1.34Zm-12.5 7.59 12.5-6.25-.67-1.34-12.5 6.25.67 1.34ZM10 9.75v12.5h1.5V9.75H10Z"/></g></svg>}

---

- [Views](/docs/reference/views/overview)
- Clerk's prebuilt Views give you a beautiful, fully-functional user management experience in minutes.
- {<svg viewBox="0 0 32 32" fill="none"><path fill="currentColor" fillOpacity=".15" d="M16 31.25 1.962 25.234A2 2 0 0 1 .75 23.395V7.285l14.462-6.197a2 2 0 0 1 1.576 0L31.25 7.286 16 13.896V31.25Z"/><path fill="currentColor" d="m16 31.25-.295.69a.75.75 0 0 0 1.045-.69H16ZM1.962 25.234l-.295.69.295-.69ZM.75 7.286l-.295-.69a.75.75 0 0 0-.455.69h.75Zm30.5 0 .298.688a.75.75 0 0 0-.003-1.378l-.295.69ZM16.788 1.088l-.296.689.296-.69Zm-1.576 0 .296.689-.296-.69Zm1.083 29.473L2.258 24.544l-.591 1.38 14.038 6.015.59-1.378ZM1.5 23.395V7.285H0v16.11h1.5ZM31.545 6.596 17.083.398l-.59 1.379 14.462 6.198.59-1.379ZM14.917.398.455 6.596l.59 1.38 14.463-6.199-.591-1.379ZM.452 7.974l15.25 6.61.596-1.376-15.25-6.61-.596 1.376Zm15.846 6.61 15.25-6.61-.596-1.376-15.25 6.61.596 1.377Zm-1.048-.688V31.25h1.5V13.896h-1.5ZM17.083.399a2.75 2.75 0 0 0-2.166 0l.59 1.379a1.25 1.25 0 0 1 .985 0l.591-1.379ZM2.258 24.544a1.25 1.25 0 0 1-.758-1.149H0c0 1.1.656 2.095 1.667 2.528l.59-1.379Z"/><path stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="1.5" d="M31.25 7.281v16.11a2 2 0 0 1-1.212 1.838L16 31.246"/></svg>}

---

- [SDK Reference](/docs/reference/overview)
- Dig into our SDK reference documentation. We have everything you need to get started setting up authentication with Clerk.
- {<svg viewBox="0 0 32 32" fill="none"><path fill="currentColor" fillOpacity=".15" d="M1.25 10.25a1 1 0 0 1 1-1h29v21h-26a4 4 0 0 1-4-4v-16Z"/><rect width="30.5" height="28.5" x=".75" y="1.75" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="1.5" rx="4"/><path stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="1.5" d="m19.75 16.75 3.5 3.25-3.5 3.25M12.25 16.75 8.75 20l3.5 3.25M4.75 8.75h22.5"/></svg>}

---

- [Security](/docs/guides/secure/restricting-access)
- Account security is the top concern of every feature we build. This documentation lists some of the many protections included with Clerk.
- {<svg viewBox="0 0 32 32" fill="none"><path stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="1.5" d="M23.382 20.897c0-4.45-3.753-8.059-8.382-8.059-4.63 0-8.382 3.608-8.382 8.059 0 3.045 1.098 5.843 2.933 8.05a13.248 13.248 0 0 0 2.106 2.023M29.25 12.402C26.292 7.826 21.016 4.78 15 4.78S3.708 7.826.75 12.402m24.309-9.184A21.525 21.525 0 0 0 15 .75c-3.645 0-7.073.895-10.059 2.468M20.03 31.25c-5.222-.775-9.22-5.115-9.22-10.353 0-2.225 1.876-4.03 4.191-4.03s4.191 1.805 4.191 4.03c0 2.225 1.877 4.03 4.191 4.03 2.315 0 4.191-1.805 4.191-4.03 0-6.676-5.629-12.088-12.573-12.088-6.944 0-12.574 5.412-12.574 12.088 0 2.037.525 3.957 1.45 5.641M15 20.091c0 4.45 3.753 8.059 8.382 8.059.574 0 1.135-.056 1.677-.162"/></svg>}
</Cards>
</If>

## Explore by frontend framework

Expand Down
70 changes: 43 additions & 27 deletions docs/manifest.json
Original file line number Diff line number Diff line change
Expand Up @@ -3099,10 +3099,6 @@
{
"title": "`<Waitlist />`",
"href": "/docs/reference/components/authentication/waitlist"
},
{
"title": "`AuthView`",
"href": "/docs/reference/components/authentication/auth-view"
}
]
]
Expand All @@ -3114,33 +3110,11 @@
[
{
"title": "`<UserButton />`",
"href": "/docs/reference/components/user/user-button",
"sdk": [
"astro",
"chrome-extension",
"expo",
"nextjs",
"nuxt",
"react",
"react-router",
"remix",
"tanstack-react-start",
"vue",
"js-frontend"
]
},
{
"title": "`UserButton`",
"href": "/docs/reference/components/user/user-button",
"sdk": ["ios"]
"href": "/docs/reference/components/user/user-button"
},
{
"title": "`<UserProfile />`",
"href": "/docs/reference/components/user/user-profile"
},
{
"title": "`UserProfileView`",
"href": "/docs/reference/components/user/user-profile-view"
}
]
]
Expand Down Expand Up @@ -3289,6 +3263,48 @@
]
}
],
[
{
"title": "Views",
"icon": "box",
"items": [
[
{
"title": "Overview",
"href": "/docs/reference/views/overview"
},
{
"title": "Authentication views",
"collapse": false,
"items": [
[
{
"title": "`AuthView`",
"href": "/docs/reference/views/authentication/auth-view"
}
]
]
},
{
"title": "User views",
"collapse": false,
"items": [
[
{
"title": "`UserButton`",
"href": "/docs/reference/views/user/user-button"
},
{
"title": "`UserProfileView`",
"href": "/docs/reference/views/user/user-profile-view"
}
]
]
}
]
]
}
],
[
{
"title": "API Reference",
Expand Down
28 changes: 0 additions & 28 deletions docs/reference/components/overview.ios.mdx

This file was deleted.

Loading