<Waitlist /> component
The <Waitlist /> component renders a form that allows users to join for early access to your app. Users receive an email confirming their request to join the waitlist. Once approved, users receive an email with instructions on how to join your app.
Learn more about using and customizing Waitlist mode.
Enable Waitlist mode
Before using the <Waitlist /> component, you must enable Waitlist mode in the Clerk Dashboard.
In Waitlist mode, users can register their interest in your app by joining a waitlist. Existing users and users who have been approved from the waitlist will be able to sign in to your app, while new users will need to join the waitlist to access your app. This mode is ideal for apps in early development stages or those wanting to generate interest before launch.
To enable Waitlist mode:
- In the Clerk Dashboard, navigate to the Waitlist page.
- Toggle on Enable waitlist and select Save.
The following example includes a basic implementation of the <Waitlist /> component. You can use this as a starting point for your own implementation.
<script setup>
// Components are automatically imported
</script>
<template>
<Waitlist />
</template>Properties
All props are optional.
- Name
afterJoinWaitlistUrl?- Type
string- Description
The full URL or path to navigate to after joining the waitlist.
- Name
appearance?- Type
Appearance | undefined- Description
An object to style your components. Will only affect Clerk components and not Account Portal pages.
- Name
fallback?- Type
ReactNode- Description
An element to be rendered while the component is mounting.
- Name
signInUrl?- Type
string- Description
The full URL or path to the sign in page. Used for the 'Already have an account? Sign in' link that's rendered. It's recommended to use the environment variable instead.
Customization
To learn about how to customize Clerk components, see the customization guide.
Feedback
Last updated on