You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: docs/components/clerk-provider.mdx
+13-10Lines changed: 13 additions & 10 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -15,7 +15,12 @@ The `<ClerkProvider>` component must be added to your React entrypoint.
15
15
<Tab>
16
16
The `<ClerkProvider>` component needs to access headers to authenticate correctly. This means anything wrapped by the provider will be opted into dynamic rendering at request time. If you have static-optimized or ISR pages that you would prefer not to be opted into dynamic rendering, make sure they are not wrapped by `<ClerkProvider>`.
17
17
18
-
This is easiest to accomplish by ensuring that `<ClerkProvider>` is added further down the tree to wrap route groups that explicitly need authentication instead of having the provider wrap your application root as recommended above. For example, if your project includes a set of landing/marketing pages as well as a dashboard that requires sign in, you would create separate (marketing) and (dashboard) route groups. Adding `<ClerkProvider>` to the `(dashboard)/layout.jsx` layout file will ensure that only those routes are opted into dynamic rendering, allowing the marketing routes to be statically optimized.
18
+
This is easiest to accomplish by ensuring that `<ClerkProvider>` is added further down the tree to wrap route groups that explicitly need authentication instead of having the provider wrap your application root as recommended above. For example, if your project includes a set of landing/marketing pages as well as a dashboard that requires sign-in, you would create separate (marketing) and (dashboard) route groups. Adding `<ClerkProvider>` to the (dashboard)/layout.jsx layout file will ensure that only those routes are opted into dynamic rendering, allowing the marketing routes to be statically optimized.
19
+
20
+
21
+
<Callouttype="info">
22
+
The root layout is a server component. If you plan to use the `<ClerkProvider>` outside the root layout, it will need to be a server component as well.
|`publishableKey`|`string`|The Clerk publishable key for your instance. This can be found in your Clerk Dashboard on the **[API Keys](https://dashboard.clerk.com/last-active?path=api-keys)** page. |
93
-
|`routerPush?`|`(to: string) => Promise<unknown> \| void`|A function which takes the destination path as an argument and performs a "push" navigation. |
94
-
|`routerReplace?`|`(to: string) => Promise<unknown> \| void`| A function which takes the destination path as an argument and performs a "replace" navigation.|
97
+
|`publishableKey`|`string`| Clerk publishable key for your instance. This can be found in your Clerk Dashboard on the **[API Keys](https://dashboard.clerk.com/last-active?path=api-keys)** page. |
98
+
|`frontendApi`|`string`|The frontend API host for your instance. This can be found in your Clerk Dashboard on the **[API Keys](https://dashboard.clerk.com/last-active?path=api-keys)** page under the **Advanced** section. |
99
+
|`navigate?`|`(to: string) => Promise<unknown> \| void`| A function which takes the destination path as an argument and performs a "push" navigation. |
95
100
|`clerkJSUrl?`|`string`| Define the URL that `@clerk/clerk-react` should hot-load `@clerk/clerk-js` from. |
96
101
|`clerkJSVariant?`|`string`| If your web application only uses Control components, you can set this value to `headless` and load a minimal ClerkJS bundle for optimal page performance. |
97
102
|`clerkJSVersion?`|`string`| Define the npm version for `@clerk/clerk-js`. |
98
103
|`supportEmail?`|`string`| Optional support email for display in authentication screens. Will only affect [Clerk Components][components-ref] and not [Account Portal][ap-ref] pages. |
99
104
|`appearance?`| <code>[Appearance](/docs/components/customization/overview)\| undefined</code> | Optional object to style your components. Will only affect [Clerk Components][components-ref] and not [Account Portal][ap-ref] pages. |
100
105
|`localization`| <code>[Localization](/docs/components/customization/localization)\| undefined</code> | Optional object to localize your components. Will only affect [Clerk Components][components-ref] and not [Account Portal][ap-ref] pages. |
101
106
|`allowedRedirectOrigins?`|`Array<string \| RegExp>`| Optional array of domains used to validate against the query param of an auth redirect. If no match is made, the redirect is considered unsafe and the default redirect will be used with a warning passed to the console. |
102
-
|`afterSignInUrl?`|`string`| The default URL to use after the user signs in. Defaults to `/`. It's recommended to use [the environment variable](/docs/deployments/clerk-environment-variables#sign-in-and-sign-up-redirects) instead. |
103
-
|`afterSignUpUrl?`|`string`| The default URL to use after the user signs up. Defaults to `/`. It's recommended to use [the environment variable](/docs/deployments/clerk-environment-variables#sign-in-and-sign-up-redirects) instead. |
104
-
107
+
|`afterSignInUrl?`|`string`| The default URL to use after the user signs in. |
108
+
|`afterSignUpUrl?`|`string`| The default URL to use after the user signs up. |
105
109
|`isSatellite?`|`boolean \| ((url: URL) => boolean)`| This option defines that the application is a satellite application. |
106
110
|`domain?`|`string \| ((url: URL) => boolean)`| This option sets the domain of the satellite application. If your application is a satellite application, this option is required. |
107
-
|`signInUrl`|`string`| This URL will be used for any redirects that might happen and needs to point to your primary application. This option is optional for production instances and required for development instances. It's recommended to use [the environment variable](/docs/deployments/clerk-environment-variables#sign-in-and-sign-up-redirects) instead. |
108
-
111
+
|`signInUrl`|`string`| This url will be used for any redirects that might happen and needs to point to your primary application. This option is optional for production instances and required for development instances. |
109
112
|`telemetry?`|`false \| { disabled?: boolean; debug?: boolean } \| undefined`| Controls whether or not Clerk will collect [telemetry data](/docs/telemetry). |
Copy file name to clipboardExpand all lines: docs/references/javascript/clerk/clerk.mdx
+10-8Lines changed: 10 additions & 8 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -122,23 +122,22 @@ All props below are optional.
122
122
| --- | --- | --- |
123
123
|`appearance`| <code>[Appearance](/docs/components/customization/overview)\| undefined</code> | Optional object to style your components. Will only affect [Clerk Components][components-ref] and not [Account Portal][ap-ref] pages. |
124
124
|`localization`| <code>[Localization](/docs/components/customization/localization)\| undefined</code> | Optional object to localize your components. Will only affect [Clerk Components][components-ref] and not [Account Portal][ap-ref] pages. |
125
-
|`routerPush?`|`(to: string) => Promise<unknown> \| void`| A function which takes the destination path as an argument and performs a "push" navigation. |
126
-
|`routerReplace?`|`(to: string) => Promise<unknown> \| void`| A function which takes the destination path as an argument and performs a "replace" navigation. |
125
+
|`navigate`|`((to: string) => Promise<unknown> \| unknown) \| undefined`| A function which takes the destination path as an argument and performs a "push" navigation. |
127
126
|`polling`|`boolean \| undefined`| Dictates if we should poll against Clerk's backend every 5 minutes. Defaults to `true`|
128
127
|`selectInitialSession`| <code>((client: [Client][client-ref]) => Session \| null) \| undefined</code> | An optional function which allows you to control which active session is the initial session to base a user's state off of. Defaults to the first session in the client's sessions array. |
129
128
|`standardBrowser`|`boolean \| undefined`| Controls if ClerkJS will load with the standard browser set up using Clerk cookies. Defaults to `true`|
130
129
|`supportEmail`|`string \| undefined`| Optional support email for display in authentication screens |
131
130
|`touchSession`|`boolean \| undefined`| Indicates whether the session should be "touched" when user interactions occur, used to record these interactions. Defaults to `true`|
132
-
|`signInUrl`|`string \| undefined`| The default URL to use to direct to when the user signs in. It's recommended to use [the environment variable](/docs/deployments/clerk-environment-variables#sign-in-and-sign-up-redirects) instead. |
133
-
|`signUpUrl`|`string \| undefined`| The default URL to use to direct to when the user signs up. It's recommended to use [the environment variable](/docs/deployments/clerk-environment-variables#sign-in-and-sign-up-redirects) instead. |
134
-
|`afterSignInUrl`|`string \| undefined`| The default URL to use after the user signs in. Defaults to `/`. It's recommended to use [the environment variable](/docs/deployments/clerk-environment-variables#sign-in-and-sign-up-redirects) instead. |
135
-
|`afterSignUpUrl`|`string \| undefined`| The default URL to use after the user signs up. Defaults to `/`. It's recommended to use [the environment variable](/docs/deployments/clerk-environment-variables#sign-in-and-sign-up-redirects) instead. |
136
-
131
+
|`signInUrl`|`string \| undefined`| The default URL to use to direct to when the user signs in. |
132
+
|`signUpUrl`|`string \| undefined`| The default URL to use to direct to when the user signs up. |
133
+
|`afterSignInUrl`|`string \| undefined`| The default URL to use after the user signs in. |
134
+
|`afterSignUpUrl`|`string \| undefined`| The default URL to use after the user signs up. |
137
135
|`allowedRedirectOrigins`|`Array<string \| RegExp> \| undefined`| Optional array of domains used to validate against the query param of an auth redirect.<br />If no match is made, the redirect is considered unsafe and the default redirect will be used with a warning passed to the console. |
138
136
|`isInterstitial`|`boolean \| undefined`| Indicates that Clerk.js will be loaded from interstitial. Defaults to `false`|
139
137
|`isSatellite`|`boolean \| ((url: URL) => boolean) \| undefined`| Clerk Flag for satellite apps. Experimental. |
140
138
|`telemetry?`|`false \| { disabled?: boolean; debug?: boolean } \| undefined`| Controls whether or not Clerk will collect [telemetry data](/docs/telemetry). |
141
139
140
+
142
141
### `signOut()`
143
142
144
143
- In a [multi-session application](/docs/custom-flows/multi-session-applications): Signs out the active user from all sessions
@@ -220,6 +219,7 @@ In addition to the methods listed above, the `Clerk` class also has the followin
0 commit comments