@clerk/react 6.0.0-snapshot.v20251211120550 → 6.0.0-snapshot.v20251215203425

package/dist/{chunk-4F7CSI4T.mjs → chunk-EMTY23UX.mjs}

@@ -1,7 +1,7 @@
 import {
   useAuth,
   withClerk
-} from "./chunk-J32KHXBI.mjs";
+} from "./chunk-FDDR7URL.mjs";
 import {
   useAssertWrappedByClerkProvider,
   useIsomorphicClerkContext
@@ -166,4 +166,4 @@ export {
   AuthenticateWithRedirectCallback,
   MultisessionAppSupport
 };
-//# sourceMappingURL=chunk-4F7CSI4T.mjs.map
+//# sourceMappingURL=chunk-EMTY23UX.mjs.map

package/dist/{chunk-J32KHXBI.mjs → chunk-FDDR7URL.mjs}

@@ -214,6 +214,7 @@ import {
 } from "@clerk/shared/react";
 
 // src/components/withClerk.tsx
+import { usePortalRoot } from "@clerk/shared/react";
 import React2 from "react";
 var withClerk = (Component, displayNameOrOptions) => {
   const passedDisplayedName = typeof displayNameOrOptions === "string" ? displayNameOrOptions : displayNameOrOptions == null ? void 0 : displayNameOrOptions.component;
@@ -223,12 +224,14 @@ var withClerk = (Component, displayNameOrOptions) => {
   const HOC = (props) => {
     useAssertWrappedByClerkProvider(displayName || "withClerk");
     const clerk = useIsomorphicClerkContext();
+    const getContainer = usePortalRoot();
     if (!clerk.loaded && !(options == null ? void 0 : options.renderWhileLoading)) {
       return null;
     }
     return /* @__PURE__ */ React2.createElement(
       Component,
       {
+        getContainer,
         ...props,
         component: displayName,
         clerk
@@ -279,4 +282,4 @@ export {
   __experimental_PaymentElementProvider,
   __experimental_PaymentElement
 };
-//# sourceMappingURL=chunk-J32KHXBI.mjs.map
+//# sourceMappingURL=chunk-FDDR7URL.mjs.map

package/dist/{chunk-J32KHXBI.mjs.map → chunk-FDDR7URL.mjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/hooks/useAuth.ts","../src/contexts/AuthContext.ts","../src/errors/messages.ts","../src/hooks/utils.ts","../src/hooks/useEmailLink.ts","../src/hooks/useClerkSignal.ts","../src/hooks/index.ts","../src/components/withClerk.tsx"],"sourcesContent":["import { createCheckAuthorization, resolveAuthState } from '@clerk/shared/authorization';\nimport { eventMethodCalled } from '@clerk/shared/telemetry';\nimport type {\n  CheckAuthorizationWithCustomPermissions,\n  GetToken,\n  JwtPayload,\n  PendingSessionOptions,\n  SignOut,\n  UseAuthReturn,\n} from '@clerk/shared/types';\nimport { useCallback } from 'react';\n\nimport { useAuthContext } from '../contexts/AuthContext';\nimport { useIsomorphicClerkContext } from '../contexts/IsomorphicClerkContext';\nimport { errorThrower } from '../errors/errorThrower';\nimport { invalidStateError } from '../errors/messages';\nimport { useAssertWrappedByClerkProvider } from './useAssertWrappedByClerkProvider';\nimport { createGetToken, createSignOut } from './utils';\n\n/**\n * @inline\n */\ntype UseAuthOptions = Record<string, any> | PendingSessionOptions | undefined | null;\n\n/**\n * The `useAuth()` hook provides access to the current user's authentication state and methods to manage the active session.\n *\n * > [!NOTE]\n * > To access auth data server-side, see the [`Auth` object reference doc](https://clerk.com/docs/reference/backend/types/auth-object).\n *\n * <If sdk=\"nextjs\">\n * By default, Next.js opts all routes into static rendering. If you need to opt a route or routes into dynamic rendering because you need to access the authentication data at request time, you can create a boundary by passing the `dynamic` prop to `<ClerkProvider>`. See the [guide on rendering modes](https://clerk.com/docs/guides/development/rendering-modes) for more information, including code examples.\n * </If>\n *\n * @unionReturnHeadings\n * [\"Initialization\", \"Signed out\", \"Signed in (no active organization)\", \"Signed in (with active organization)\"]\n *\n * @param [initialAuthStateOrOptions] - An object containing the initial authentication state or options for the `useAuth()` hook. If not provided, the hook will attempt to derive the state from the context. `treatPendingAsSignedOut` is a boolean that indicates whether pending sessions are considered as signed out or not. Defaults to `true`.\n *\n * @function\n *\n * @example\n *\n * The following example demonstrates how to use the `useAuth()` hook to access the current auth state, like whether the user is signed in or not. It also includes a basic example for using the `getToken()` method to retrieve a session token for fetching data from an external resource.\n *\n * <Tabs items='React,Next.js'>\n * <Tab>\n *\n * ```tsx {{ filename: 'src/pages/ExternalDataPage.tsx' }}\n * import { useAuth } from '@clerk/react'\n *\n * export default function ExternalDataPage() {\n *   const { userId, sessionId, getToken, isLoaded, isSignedIn } = useAuth()\n *\n *   const fetchExternalData = async () => {\n *     const token = await getToken()\n *\n *     // Fetch data from an external API\n *     const response = await fetch('https://api.example.com/data', {\n *       headers: {\n *         Authorization: `Bearer ${token}`,\n *       },\n *     })\n *\n *     return response.json()\n *   }\n *\n *   if (!isLoaded) {\n *     return <div>Loading...</div>\n *   }\n *\n *   if (!isSignedIn) {\n *     return <div>Sign in to view this page</div>\n *   }\n *\n *   return (\n *     <div>\n *       <p>\n *         Hello, {userId}! Your current active session is {sessionId}.\n *       </p>\n *       <button onClick={fetchExternalData}>Fetch Data</button>\n *     </div>\n *   )\n * }\n * ```\n *\n * </Tab>\n * <Tab>\n *\n * {@include ../../docs/use-auth.md#nextjs-01}\n *\n * </Tab>\n * </Tabs>\n */\nexport const useAuth = (initialAuthStateOrOptions: UseAuthOptions = {}): UseAuthReturn => {\n  useAssertWrappedByClerkProvider('useAuth');\n\n  const { treatPendingAsSignedOut, ...rest } = initialAuthStateOrOptions ?? {};\n  const initialAuthState = rest as any;\n\n  const authContextFromHook = useAuthContext();\n  let authContext = authContextFromHook;\n\n  if (authContext.sessionId === undefined && authContext.userId === undefined) {\n    authContext = initialAuthState != null ? initialAuthState : {};\n  }\n\n  const isomorphicClerk = useIsomorphicClerkContext();\n  const getToken: GetToken = useCallback(createGetToken(isomorphicClerk), [isomorphicClerk]);\n  const signOut: SignOut = useCallback(createSignOut(isomorphicClerk), [isomorphicClerk]);\n\n  isomorphicClerk.telemetry?.record(eventMethodCalled('useAuth', { treatPendingAsSignedOut }));\n\n  return useDerivedAuth(\n    {\n      ...authContext,\n      getToken,\n      signOut,\n    },\n    {\n      treatPendingAsSignedOut,\n    },\n  );\n};\n\n/**\n * A hook that derives and returns authentication state and utility functions based on the provided auth object.\n *\n * @param authObject - An object containing authentication-related properties and functions.\n *\n * @returns A derived authentication state with helper methods. If the authentication state is invalid, an error is thrown.\n *\n * @remarks\n * This hook inspects session, user, and organization information to determine the current authentication state.\n * It returns an object that includes various properties such as whether the state is loaded, if a user is signed in,\n * session and user identifiers, Organization Roles, and a `has` function for authorization checks.\n * Additionally, it provides `signOut` and `getToken` functions if applicable.\n *\n * @example\n * ```tsx\n * const {\n *   isLoaded,\n *   isSignedIn,\n *   userId,\n *   orgId,\n *   has,\n *   signOut,\n *   getToken\n * } = useDerivedAuth(authObject);\n * ```\n */\nexport function useDerivedAuth(\n  authObject: any,\n  { treatPendingAsSignedOut = true }: PendingSessionOptions = {},\n): UseAuthReturn {\n  const { userId, orgId, orgRole, has, signOut, getToken, orgPermissions, factorVerificationAge, sessionClaims } =\n    authObject ?? {};\n\n  const derivedHas = useCallback(\n    (params: Parameters<CheckAuthorizationWithCustomPermissions>[0]) => {\n      if (has) {\n        return has(params);\n      }\n      return createCheckAuthorization({\n        userId,\n        orgId,\n        orgRole,\n        orgPermissions,\n        factorVerificationAge,\n        features: ((sessionClaims as JwtPayload | undefined)?.fea as string) || '',\n        plans: ((sessionClaims as JwtPayload | undefined)?.pla as string) || '',\n      })(params);\n    },\n    [has, userId, orgId, orgRole, orgPermissions, factorVerificationAge, sessionClaims],\n  );\n\n  const payload = resolveAuthState({\n    authObject: {\n      ...authObject,\n      getToken,\n      signOut,\n      has: derivedHas,\n    },\n    options: {\n      treatPendingAsSignedOut,\n    },\n  });\n\n  if (!payload) {\n    return errorThrower.throw(invalidStateError);\n  }\n\n  return payload;\n}\n","import { createContextAndHook } from '@clerk/shared/react';\nimport type {\n  ActClaim,\n  JwtPayload,\n  OrganizationCustomPermissionKey,\n  OrganizationCustomRoleKey,\n  SessionStatusClaim,\n} from '@clerk/shared/types';\n\nexport type AuthContextValue = {\n  userId: string | null | undefined;\n  sessionId: string | null | undefined;\n  sessionStatus: SessionStatusClaim | null | undefined;\n  sessionClaims: JwtPayload | null | undefined;\n  actor: ActClaim | null | undefined;\n  orgId: string | null | undefined;\n  orgRole: OrganizationCustomRoleKey | null | undefined;\n  orgSlug: string | null | undefined;\n  orgPermissions: OrganizationCustomPermissionKey[] | null | undefined;\n  factorVerificationAge: [number, number] | null;\n};\n\nexport const [AuthContext, useAuthContext] = createContextAndHook<AuthContextValue>('AuthContext');\n","export const noClerkProviderError = 'You must wrap your application in a <ClerkProvider> component.';\n\nexport const multipleClerkProvidersError =\n  \"You've added multiple <ClerkProvider> components in your React component tree. Wrap your components in a single <ClerkProvider>.\";\n\nexport const multipleChildrenInButtonComponent = (name: string) =>\n  `You've passed multiple children components to <${name}/>. You can only pass a single child component or text.`;\n\nexport const invalidStateError =\n  'Invalid state. Feel free to submit a bug or reach out to support here: https://clerk.com/support';\n\nexport const unsupportedNonBrowserDomainOrProxyUrlFunction =\n  'Unsupported usage of isSatellite, domain or proxyUrl. The usage of isSatellite, domain or proxyUrl as function is not supported in non-browser environments.';\n\nexport const userProfilePageRenderedError =\n  '<UserProfile.Page /> component needs to be a direct child of `<UserProfile />` or `<UserButton />`.';\nexport const userProfileLinkRenderedError =\n  '<UserProfile.Link /> component needs to be a direct child of `<UserProfile />` or `<UserButton />`.';\n\nexport const organizationProfilePageRenderedError =\n  '<OrganizationProfile.Page /> component needs to be a direct child of `<OrganizationProfile />` or `<OrganizationSwitcher />`.';\nexport const organizationProfileLinkRenderedError =\n  '<OrganizationProfile.Link /> component needs to be a direct child of `<OrganizationProfile />` or `<OrganizationSwitcher />`.';\n\nexport const customPagesIgnoredComponent = (componentName: string) =>\n  `<${componentName} /> can only accept <${componentName}.Page /> and <${componentName}.Link /> as its children. Any other provided component will be ignored. Additionally, please ensure that the component is rendered in a client component.`;\n\nexport const customPageWrongProps = (componentName: string) =>\n  `Missing props. <${componentName}.Page /> component requires the following props: url, label, labelIcon, alongside with children to be rendered inside the page.`;\n\nexport const customLinkWrongProps = (componentName: string) =>\n  `Missing props. <${componentName}.Link /> component requires the following props: url, label and labelIcon.`;\n\nexport const useAuthHasRequiresRoleOrPermission =\n  'Missing parameters. `has` from `useAuth` requires a permission or role key to be passed. Example usage: `has({permission: \"org:posts:edit\"`';\n\nexport const noPathProvidedError = (componentName: string) =>\n  `The <${componentName}/> component uses path-based routing by default unless a different routing strategy is provided using the \\`routing\\` prop. When path-based routing is used, you need to provide the path where the component is mounted on by using the \\`path\\` prop. Example: <${componentName} path={'/my-path'} />`;\n\nexport const incompatibleRoutingWithPathProvidedError = (componentName: string) =>\n  `The \\`path\\` prop will only be respected when the Clerk component uses path-based routing. To resolve this error, pass \\`routing='path'\\` to the <${componentName}/> component, or drop the \\`path\\` prop to switch to hash-based routing. For more details please refer to our docs: https://clerk.com/docs`;\n\nexport const userButtonIgnoredComponent = `<UserButton /> can only accept <UserButton.UserProfilePage />, <UserButton.UserProfileLink /> and <UserButton.MenuItems /> as its children. Any other provided component will be ignored. Additionally, please ensure that the component is rendered in a client component.`;\n\nexport const customMenuItemsIgnoredComponent =\n  '<UserButton.MenuItems /> component can only accept <UserButton.Action /> and <UserButton.Link /> as its children. Any other provided component will be ignored. Additionally, please ensure that the component is rendered in a client component.';\n\nexport const userButtonMenuItemsRenderedError =\n  '<UserButton.MenuItems /> component needs to be a direct child of `<UserButton />`.';\n\nexport const userButtonMenuActionRenderedError =\n  '<UserButton.Action /> component needs to be a direct child of `<UserButton.MenuItems />`.';\n\nexport const userButtonMenuLinkRenderedError =\n  '<UserButton.Link /> component needs to be a direct child of `<UserButton.MenuItems />`.';\n\nexport const userButtonMenuItemLinkWrongProps =\n  'Missing props. <UserButton.Link /> component requires the following props: href, label and labelIcon.';\n\nexport const userButtonMenuItemsActionWrongsProps =\n  'Missing props. <UserButton.Action /> component requires the following props: label.';\n","import type { IsomorphicClerk } from '../isomorphicClerk';\n\n/**\n * @internal\n */\nconst clerkLoaded = (isomorphicClerk: IsomorphicClerk) => {\n  return new Promise<void>(resolve => {\n    const handler = (status: string) => {\n      if (['ready', 'degraded'].includes(status)) {\n        resolve();\n        isomorphicClerk.off('status', handler);\n      }\n    };\n\n    // Register the event listener\n    isomorphicClerk.on('status', handler, { notify: true });\n  });\n};\n\n/**\n * @internal\n */\nexport const createGetToken = (isomorphicClerk: IsomorphicClerk) => {\n  return async (options: any) => {\n    await clerkLoaded(isomorphicClerk);\n    if (!isomorphicClerk.session) {\n      return null;\n    }\n    return isomorphicClerk.session.getToken(options);\n  };\n};\n\n/**\n * @internal\n */\nexport const createSignOut = (isomorphicClerk: IsomorphicClerk) => {\n  return async (...args: any) => {\n    await clerkLoaded(isomorphicClerk);\n    return isomorphicClerk.signOut(...args);\n  };\n};\n","import type {\n  CreateEmailLinkFlowReturn,\n  EmailAddressResource,\n  SignInResource,\n  SignInStartEmailLinkFlowParams,\n  SignUpResource,\n  StartEmailLinkFlowParams,\n} from '@clerk/shared/types';\nimport React from 'react';\n\ntype EmailLinkable = SignUpResource | EmailAddressResource | SignInResource;\ntype UseEmailLinkSignInReturn = CreateEmailLinkFlowReturn<SignInStartEmailLinkFlowParams, SignInResource>;\ntype UseEmailLinkSignUpReturn = CreateEmailLinkFlowReturn<StartEmailLinkFlowParams, SignUpResource>;\ntype UseEmailLinkEmailAddressReturn = CreateEmailLinkFlowReturn<StartEmailLinkFlowParams, EmailAddressResource>;\n\nfunction useEmailLink(resource: SignInResource): UseEmailLinkSignInReturn;\nfunction useEmailLink(resource: SignUpResource): UseEmailLinkSignUpReturn;\nfunction useEmailLink(resource: EmailAddressResource): UseEmailLinkEmailAddressReturn;\nfunction useEmailLink(\n  resource: EmailLinkable,\n): UseEmailLinkSignInReturn | UseEmailLinkSignUpReturn | UseEmailLinkEmailAddressReturn {\n  const { startEmailLinkFlow, cancelEmailLinkFlow } = React.useMemo(() => resource.createEmailLinkFlow(), [resource]);\n\n  React.useEffect(() => {\n    return cancelEmailLinkFlow;\n  }, []);\n\n  return {\n    startEmailLinkFlow,\n    cancelEmailLinkFlow,\n  } as UseEmailLinkSignInReturn | UseEmailLinkSignUpReturn | UseEmailLinkEmailAddressReturn;\n}\n\nexport { useEmailLink };\n","import { eventMethodCalled } from '@clerk/shared/telemetry';\nimport type { SignInSignalValue, SignUpSignalValue } from '@clerk/shared/types';\nimport { useCallback, useSyncExternalStore } from 'react';\n\nimport { useIsomorphicClerkContext } from '../contexts/IsomorphicClerkContext';\nimport { useAssertWrappedByClerkProvider } from './useAssertWrappedByClerkProvider';\n\nfunction useClerkSignal(signal: 'signIn'): SignInSignalValue;\nfunction useClerkSignal(signal: 'signUp'): SignUpSignalValue;\nfunction useClerkSignal(signal: 'signIn' | 'signUp'): SignInSignalValue | SignUpSignalValue {\n  useAssertWrappedByClerkProvider('useClerkSignal');\n\n  const clerk = useIsomorphicClerkContext();\n\n  switch (signal) {\n    case 'signIn':\n      clerk.telemetry?.record(eventMethodCalled('useSignIn', { apiVersion: '2025-11' }));\n      break;\n    case 'signUp':\n      clerk.telemetry?.record(eventMethodCalled('useSignUp', { apiVersion: '2025-11' }));\n      break;\n    default:\n      break;\n  }\n\n  const subscribe = useCallback(\n    (callback: () => void) => {\n      if (!clerk.loaded) {\n        return () => {};\n      }\n\n      return clerk.__internal_state.__internal_effect(() => {\n        switch (signal) {\n          case 'signIn':\n            clerk.__internal_state.signInSignal();\n            break;\n          case 'signUp':\n            clerk.__internal_state.signUpSignal();\n            break;\n          default:\n            throw new Error(`Unknown signal: ${signal}`);\n        }\n        callback();\n      });\n    },\n    [clerk, clerk.loaded, clerk.__internal_state],\n  );\n  const getSnapshot = useCallback(() => {\n    switch (signal) {\n      case 'signIn':\n        return clerk.__internal_state.signInSignal() as SignInSignalValue;\n      case 'signUp':\n        return clerk.__internal_state.signUpSignal() as SignUpSignalValue;\n      default:\n        throw new Error(`Unknown signal: ${signal}`);\n    }\n  }, [clerk.__internal_state]);\n\n  const value = useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n\n  return value;\n}\n\n/**\n * This hook allows you to access the Signal-based `SignIn` resource.\n *\n * @example\n * import { useSignInSignal } from \"@clerk/react/experimental\";\n *\n * function SignInForm() {\n *   const { signIn, errors, fetchStatus } = useSignInSignal();\n *   //\n * }\n *\n * @experimental This experimental API is subject to change.\n */\nexport function useSignIn() {\n  return useClerkSignal('signIn');\n}\n\n/**\n * This hook allows you to access the Signal-based `SignUp` resource.\n *\n * @example\n * import { useSignUpSignal } from \"@clerk/react/experimental\";\n *\n * function SignUpForm() {\n *   const { signUp, errors, fetchStatus } = useSignUpSignal();\n *   //\n * }\n *\n * @experimental This experimental API is subject to change.\n */\nexport function useSignUp() {\n  return useClerkSignal('signUp');\n}\n","export { useAuth } from './useAuth';\nexport { useEmailLink } from './useEmailLink';\nexport { useSignIn, useSignUp } from './useClerkSignal';\nexport {\n  useClerk,\n  useOrganization,\n  useOrganizationList,\n  useSessionList,\n  useUser,\n  useSession,\n  useReverification,\n  __experimental_useCheckout,\n  __experimental_CheckoutProvider,\n  __experimental_usePaymentElement,\n  __experimental_PaymentElementProvider,\n  __experimental_PaymentElement,\n} from '@clerk/shared/react';\n","import type { LoadedClerk, Without } from '@clerk/shared/types';\nimport React from 'react';\n\nimport { useIsomorphicClerkContext } from '../contexts/IsomorphicClerkContext';\nimport { useAssertWrappedByClerkProvider } from '../hooks/useAssertWrappedByClerkProvider';\n\nexport const withClerk = <P extends { clerk: LoadedClerk; component?: string }>(\n  Component: React.ComponentType<P>,\n  displayNameOrOptions?: string | { component: string; renderWhileLoading?: boolean },\n) => {\n  const passedDisplayedName =\n    typeof displayNameOrOptions === 'string' ? displayNameOrOptions : displayNameOrOptions?.component;\n  const displayName = passedDisplayedName || Component.displayName || Component.name || 'Component';\n  Component.displayName = displayName;\n\n  const options = typeof displayNameOrOptions === 'string' ? undefined : displayNameOrOptions;\n\n  const HOC = (props: Without<P, 'clerk'>) => {\n    useAssertWrappedByClerkProvider(displayName || 'withClerk');\n\n    const clerk = useIsomorphicClerkContext();\n\n    if (!clerk.loaded && !options?.renderWhileLoading) {\n      return null;\n    }\n\n    return (\n      <Component\n        {...(props as P)}\n        component={displayName}\n        clerk={clerk}\n      />\n    );\n  };\n  HOC.displayName = `withClerk(${displayName})`;\n  return HOC;\n};\n"],"mappings":"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","names":["eventMethodCalled","useCallback","eventMethodCalled","useCallback","React","React"]}
+{"version":3,"sources":["../src/hooks/useAuth.ts","../src/contexts/AuthContext.ts","../src/errors/messages.ts","../src/hooks/utils.ts","../src/hooks/useEmailLink.ts","../src/hooks/useClerkSignal.ts","../src/hooks/index.ts","../src/components/withClerk.tsx"],"sourcesContent":["import { createCheckAuthorization, resolveAuthState } from '@clerk/shared/authorization';\nimport { eventMethodCalled } from '@clerk/shared/telemetry';\nimport type {\n  CheckAuthorizationWithCustomPermissions,\n  GetToken,\n  JwtPayload,\n  PendingSessionOptions,\n  SignOut,\n  UseAuthReturn,\n} from '@clerk/shared/types';\nimport { useCallback } from 'react';\n\nimport { useAuthContext } from '../contexts/AuthContext';\nimport { useIsomorphicClerkContext } from '../contexts/IsomorphicClerkContext';\nimport { errorThrower } from '../errors/errorThrower';\nimport { invalidStateError } from '../errors/messages';\nimport { useAssertWrappedByClerkProvider } from './useAssertWrappedByClerkProvider';\nimport { createGetToken, createSignOut } from './utils';\n\n/**\n * @inline\n */\ntype UseAuthOptions = Record<string, any> | PendingSessionOptions | undefined | null;\n\n/**\n * The `useAuth()` hook provides access to the current user's authentication state and methods to manage the active session.\n *\n * > [!NOTE]\n * > To access auth data server-side, see the [`Auth` object reference doc](https://clerk.com/docs/reference/backend/types/auth-object).\n *\n * <If sdk=\"nextjs\">\n * By default, Next.js opts all routes into static rendering. If you need to opt a route or routes into dynamic rendering because you need to access the authentication data at request time, you can create a boundary by passing the `dynamic` prop to `<ClerkProvider>`. See the [guide on rendering modes](https://clerk.com/docs/guides/development/rendering-modes) for more information, including code examples.\n * </If>\n *\n * @unionReturnHeadings\n * [\"Initialization\", \"Signed out\", \"Signed in (no active organization)\", \"Signed in (with active organization)\"]\n *\n * @param [initialAuthStateOrOptions] - An object containing the initial authentication state or options for the `useAuth()` hook. If not provided, the hook will attempt to derive the state from the context. `treatPendingAsSignedOut` is a boolean that indicates whether pending sessions are considered as signed out or not. Defaults to `true`.\n *\n * @function\n *\n * @example\n *\n * The following example demonstrates how to use the `useAuth()` hook to access the current auth state, like whether the user is signed in or not. It also includes a basic example for using the `getToken()` method to retrieve a session token for fetching data from an external resource.\n *\n * <Tabs items='React,Next.js'>\n * <Tab>\n *\n * ```tsx {{ filename: 'src/pages/ExternalDataPage.tsx' }}\n * import { useAuth } from '@clerk/react'\n *\n * export default function ExternalDataPage() {\n *   const { userId, sessionId, getToken, isLoaded, isSignedIn } = useAuth()\n *\n *   const fetchExternalData = async () => {\n *     const token = await getToken()\n *\n *     // Fetch data from an external API\n *     const response = await fetch('https://api.example.com/data', {\n *       headers: {\n *         Authorization: `Bearer ${token}`,\n *       },\n *     })\n *\n *     return response.json()\n *   }\n *\n *   if (!isLoaded) {\n *     return <div>Loading...</div>\n *   }\n *\n *   if (!isSignedIn) {\n *     return <div>Sign in to view this page</div>\n *   }\n *\n *   return (\n *     <div>\n *       <p>\n *         Hello, {userId}! Your current active session is {sessionId}.\n *       </p>\n *       <button onClick={fetchExternalData}>Fetch Data</button>\n *     </div>\n *   )\n * }\n * ```\n *\n * </Tab>\n * <Tab>\n *\n * {@include ../../docs/use-auth.md#nextjs-01}\n *\n * </Tab>\n * </Tabs>\n */\nexport const useAuth = (initialAuthStateOrOptions: UseAuthOptions = {}): UseAuthReturn => {\n  useAssertWrappedByClerkProvider('useAuth');\n\n  const { treatPendingAsSignedOut, ...rest } = initialAuthStateOrOptions ?? {};\n  const initialAuthState = rest as any;\n\n  const authContextFromHook = useAuthContext();\n  let authContext = authContextFromHook;\n\n  if (authContext.sessionId === undefined && authContext.userId === undefined) {\n    authContext = initialAuthState != null ? initialAuthState : {};\n  }\n\n  const isomorphicClerk = useIsomorphicClerkContext();\n  const getToken: GetToken = useCallback(createGetToken(isomorphicClerk), [isomorphicClerk]);\n  const signOut: SignOut = useCallback(createSignOut(isomorphicClerk), [isomorphicClerk]);\n\n  isomorphicClerk.telemetry?.record(eventMethodCalled('useAuth', { treatPendingAsSignedOut }));\n\n  return useDerivedAuth(\n    {\n      ...authContext,\n      getToken,\n      signOut,\n    },\n    {\n      treatPendingAsSignedOut,\n    },\n  );\n};\n\n/**\n * A hook that derives and returns authentication state and utility functions based on the provided auth object.\n *\n * @param authObject - An object containing authentication-related properties and functions.\n *\n * @returns A derived authentication state with helper methods. If the authentication state is invalid, an error is thrown.\n *\n * @remarks\n * This hook inspects session, user, and organization information to determine the current authentication state.\n * It returns an object that includes various properties such as whether the state is loaded, if a user is signed in,\n * session and user identifiers, Organization Roles, and a `has` function for authorization checks.\n * Additionally, it provides `signOut` and `getToken` functions if applicable.\n *\n * @example\n * ```tsx\n * const {\n *   isLoaded,\n *   isSignedIn,\n *   userId,\n *   orgId,\n *   has,\n *   signOut,\n *   getToken\n * } = useDerivedAuth(authObject);\n * ```\n */\nexport function useDerivedAuth(\n  authObject: any,\n  { treatPendingAsSignedOut = true }: PendingSessionOptions = {},\n): UseAuthReturn {\n  const { userId, orgId, orgRole, has, signOut, getToken, orgPermissions, factorVerificationAge, sessionClaims } =\n    authObject ?? {};\n\n  const derivedHas = useCallback(\n    (params: Parameters<CheckAuthorizationWithCustomPermissions>[0]) => {\n      if (has) {\n        return has(params);\n      }\n      return createCheckAuthorization({\n        userId,\n        orgId,\n        orgRole,\n        orgPermissions,\n        factorVerificationAge,\n        features: ((sessionClaims as JwtPayload | undefined)?.fea as string) || '',\n        plans: ((sessionClaims as JwtPayload | undefined)?.pla as string) || '',\n      })(params);\n    },\n    [has, userId, orgId, orgRole, orgPermissions, factorVerificationAge, sessionClaims],\n  );\n\n  const payload = resolveAuthState({\n    authObject: {\n      ...authObject,\n      getToken,\n      signOut,\n      has: derivedHas,\n    },\n    options: {\n      treatPendingAsSignedOut,\n    },\n  });\n\n  if (!payload) {\n    return errorThrower.throw(invalidStateError);\n  }\n\n  return payload;\n}\n","import { createContextAndHook } from '@clerk/shared/react';\nimport type {\n  ActClaim,\n  JwtPayload,\n  OrganizationCustomPermissionKey,\n  OrganizationCustomRoleKey,\n  SessionStatusClaim,\n} from '@clerk/shared/types';\n\nexport type AuthContextValue = {\n  userId: string | null | undefined;\n  sessionId: string | null | undefined;\n  sessionStatus: SessionStatusClaim | null | undefined;\n  sessionClaims: JwtPayload | null | undefined;\n  actor: ActClaim | null | undefined;\n  orgId: string | null | undefined;\n  orgRole: OrganizationCustomRoleKey | null | undefined;\n  orgSlug: string | null | undefined;\n  orgPermissions: OrganizationCustomPermissionKey[] | null | undefined;\n  factorVerificationAge: [number, number] | null;\n};\n\nexport const [AuthContext, useAuthContext] = createContextAndHook<AuthContextValue>('AuthContext');\n","export const noClerkProviderError = 'You must wrap your application in a <ClerkProvider> component.';\n\nexport const multipleClerkProvidersError =\n  \"You've added multiple <ClerkProvider> components in your React component tree. Wrap your components in a single <ClerkProvider>.\";\n\nexport const multipleChildrenInButtonComponent = (name: string) =>\n  `You've passed multiple children components to <${name}/>. You can only pass a single child component or text.`;\n\nexport const invalidStateError =\n  'Invalid state. Feel free to submit a bug or reach out to support here: https://clerk.com/support';\n\nexport const unsupportedNonBrowserDomainOrProxyUrlFunction =\n  'Unsupported usage of isSatellite, domain or proxyUrl. The usage of isSatellite, domain or proxyUrl as function is not supported in non-browser environments.';\n\nexport const userProfilePageRenderedError =\n  '<UserProfile.Page /> component needs to be a direct child of `<UserProfile />` or `<UserButton />`.';\nexport const userProfileLinkRenderedError =\n  '<UserProfile.Link /> component needs to be a direct child of `<UserProfile />` or `<UserButton />`.';\n\nexport const organizationProfilePageRenderedError =\n  '<OrganizationProfile.Page /> component needs to be a direct child of `<OrganizationProfile />` or `<OrganizationSwitcher />`.';\nexport const organizationProfileLinkRenderedError =\n  '<OrganizationProfile.Link /> component needs to be a direct child of `<OrganizationProfile />` or `<OrganizationSwitcher />`.';\n\nexport const customPagesIgnoredComponent = (componentName: string) =>\n  `<${componentName} /> can only accept <${componentName}.Page /> and <${componentName}.Link /> as its children. Any other provided component will be ignored. Additionally, please ensure that the component is rendered in a client component.`;\n\nexport const customPageWrongProps = (componentName: string) =>\n  `Missing props. <${componentName}.Page /> component requires the following props: url, label, labelIcon, alongside with children to be rendered inside the page.`;\n\nexport const customLinkWrongProps = (componentName: string) =>\n  `Missing props. <${componentName}.Link /> component requires the following props: url, label and labelIcon.`;\n\nexport const useAuthHasRequiresRoleOrPermission =\n  'Missing parameters. `has` from `useAuth` requires a permission or role key to be passed. Example usage: `has({permission: \"org:posts:edit\"`';\n\nexport const noPathProvidedError = (componentName: string) =>\n  `The <${componentName}/> component uses path-based routing by default unless a different routing strategy is provided using the \\`routing\\` prop. When path-based routing is used, you need to provide the path where the component is mounted on by using the \\`path\\` prop. Example: <${componentName} path={'/my-path'} />`;\n\nexport const incompatibleRoutingWithPathProvidedError = (componentName: string) =>\n  `The \\`path\\` prop will only be respected when the Clerk component uses path-based routing. To resolve this error, pass \\`routing='path'\\` to the <${componentName}/> component, or drop the \\`path\\` prop to switch to hash-based routing. For more details please refer to our docs: https://clerk.com/docs`;\n\nexport const userButtonIgnoredComponent = `<UserButton /> can only accept <UserButton.UserProfilePage />, <UserButton.UserProfileLink /> and <UserButton.MenuItems /> as its children. Any other provided component will be ignored. Additionally, please ensure that the component is rendered in a client component.`;\n\nexport const customMenuItemsIgnoredComponent =\n  '<UserButton.MenuItems /> component can only accept <UserButton.Action /> and <UserButton.Link /> as its children. Any other provided component will be ignored. Additionally, please ensure that the component is rendered in a client component.';\n\nexport const userButtonMenuItemsRenderedError =\n  '<UserButton.MenuItems /> component needs to be a direct child of `<UserButton />`.';\n\nexport const userButtonMenuActionRenderedError =\n  '<UserButton.Action /> component needs to be a direct child of `<UserButton.MenuItems />`.';\n\nexport const userButtonMenuLinkRenderedError =\n  '<UserButton.Link /> component needs to be a direct child of `<UserButton.MenuItems />`.';\n\nexport const userButtonMenuItemLinkWrongProps =\n  'Missing props. <UserButton.Link /> component requires the following props: href, label and labelIcon.';\n\nexport const userButtonMenuItemsActionWrongsProps =\n  'Missing props. <UserButton.Action /> component requires the following props: label.';\n","import type { IsomorphicClerk } from '../isomorphicClerk';\n\n/**\n * @internal\n */\nconst clerkLoaded = (isomorphicClerk: IsomorphicClerk) => {\n  return new Promise<void>(resolve => {\n    const handler = (status: string) => {\n      if (['ready', 'degraded'].includes(status)) {\n        resolve();\n        isomorphicClerk.off('status', handler);\n      }\n    };\n\n    // Register the event listener\n    isomorphicClerk.on('status', handler, { notify: true });\n  });\n};\n\n/**\n * @internal\n */\nexport const createGetToken = (isomorphicClerk: IsomorphicClerk) => {\n  return async (options: any) => {\n    await clerkLoaded(isomorphicClerk);\n    if (!isomorphicClerk.session) {\n      return null;\n    }\n    return isomorphicClerk.session.getToken(options);\n  };\n};\n\n/**\n * @internal\n */\nexport const createSignOut = (isomorphicClerk: IsomorphicClerk) => {\n  return async (...args: any) => {\n    await clerkLoaded(isomorphicClerk);\n    return isomorphicClerk.signOut(...args);\n  };\n};\n","import type {\n  CreateEmailLinkFlowReturn,\n  EmailAddressResource,\n  SignInResource,\n  SignInStartEmailLinkFlowParams,\n  SignUpResource,\n  StartEmailLinkFlowParams,\n} from '@clerk/shared/types';\nimport React from 'react';\n\ntype EmailLinkable = SignUpResource | EmailAddressResource | SignInResource;\ntype UseEmailLinkSignInReturn = CreateEmailLinkFlowReturn<SignInStartEmailLinkFlowParams, SignInResource>;\ntype UseEmailLinkSignUpReturn = CreateEmailLinkFlowReturn<StartEmailLinkFlowParams, SignUpResource>;\ntype UseEmailLinkEmailAddressReturn = CreateEmailLinkFlowReturn<StartEmailLinkFlowParams, EmailAddressResource>;\n\nfunction useEmailLink(resource: SignInResource): UseEmailLinkSignInReturn;\nfunction useEmailLink(resource: SignUpResource): UseEmailLinkSignUpReturn;\nfunction useEmailLink(resource: EmailAddressResource): UseEmailLinkEmailAddressReturn;\nfunction useEmailLink(\n  resource: EmailLinkable,\n): UseEmailLinkSignInReturn | UseEmailLinkSignUpReturn | UseEmailLinkEmailAddressReturn {\n  const { startEmailLinkFlow, cancelEmailLinkFlow } = React.useMemo(() => resource.createEmailLinkFlow(), [resource]);\n\n  React.useEffect(() => {\n    return cancelEmailLinkFlow;\n  }, []);\n\n  return {\n    startEmailLinkFlow,\n    cancelEmailLinkFlow,\n  } as UseEmailLinkSignInReturn | UseEmailLinkSignUpReturn | UseEmailLinkEmailAddressReturn;\n}\n\nexport { useEmailLink };\n","import { eventMethodCalled } from '@clerk/shared/telemetry';\nimport type { SignInSignalValue, SignUpSignalValue } from '@clerk/shared/types';\nimport { useCallback, useSyncExternalStore } from 'react';\n\nimport { useIsomorphicClerkContext } from '../contexts/IsomorphicClerkContext';\nimport { useAssertWrappedByClerkProvider } from './useAssertWrappedByClerkProvider';\n\nfunction useClerkSignal(signal: 'signIn'): SignInSignalValue;\nfunction useClerkSignal(signal: 'signUp'): SignUpSignalValue;\nfunction useClerkSignal(signal: 'signIn' | 'signUp'): SignInSignalValue | SignUpSignalValue {\n  useAssertWrappedByClerkProvider('useClerkSignal');\n\n  const clerk = useIsomorphicClerkContext();\n\n  switch (signal) {\n    case 'signIn':\n      clerk.telemetry?.record(eventMethodCalled('useSignIn', { apiVersion: '2025-11' }));\n      break;\n    case 'signUp':\n      clerk.telemetry?.record(eventMethodCalled('useSignUp', { apiVersion: '2025-11' }));\n      break;\n    default:\n      break;\n  }\n\n  const subscribe = useCallback(\n    (callback: () => void) => {\n      if (!clerk.loaded) {\n        return () => {};\n      }\n\n      return clerk.__internal_state.__internal_effect(() => {\n        switch (signal) {\n          case 'signIn':\n            clerk.__internal_state.signInSignal();\n            break;\n          case 'signUp':\n            clerk.__internal_state.signUpSignal();\n            break;\n          default:\n            throw new Error(`Unknown signal: ${signal}`);\n        }\n        callback();\n      });\n    },\n    [clerk, clerk.loaded, clerk.__internal_state],\n  );\n  const getSnapshot = useCallback(() => {\n    switch (signal) {\n      case 'signIn':\n        return clerk.__internal_state.signInSignal() as SignInSignalValue;\n      case 'signUp':\n        return clerk.__internal_state.signUpSignal() as SignUpSignalValue;\n      default:\n        throw new Error(`Unknown signal: ${signal}`);\n    }\n  }, [clerk.__internal_state]);\n\n  const value = useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n\n  return value;\n}\n\n/**\n * This hook allows you to access the Signal-based `SignIn` resource.\n *\n * @example\n * import { useSignInSignal } from \"@clerk/react/experimental\";\n *\n * function SignInForm() {\n *   const { signIn, errors, fetchStatus } = useSignInSignal();\n *   //\n * }\n *\n * @experimental This experimental API is subject to change.\n */\nexport function useSignIn() {\n  return useClerkSignal('signIn');\n}\n\n/**\n * This hook allows you to access the Signal-based `SignUp` resource.\n *\n * @example\n * import { useSignUpSignal } from \"@clerk/react/experimental\";\n *\n * function SignUpForm() {\n *   const { signUp, errors, fetchStatus } = useSignUpSignal();\n *   //\n * }\n *\n * @experimental This experimental API is subject to change.\n */\nexport function useSignUp() {\n  return useClerkSignal('signUp');\n}\n","export { useAuth } from './useAuth';\nexport { useEmailLink } from './useEmailLink';\nexport { useSignIn, useSignUp } from './useClerkSignal';\nexport {\n  useClerk,\n  useOrganization,\n  useOrganizationList,\n  useSessionList,\n  useUser,\n  useSession,\n  useReverification,\n  __experimental_useCheckout,\n  __experimental_CheckoutProvider,\n  __experimental_usePaymentElement,\n  __experimental_PaymentElementProvider,\n  __experimental_PaymentElement,\n} from '@clerk/shared/react';\n","import { usePortalRoot } from '@clerk/shared/react';\nimport type { LoadedClerk, Without } from '@clerk/shared/types';\nimport React from 'react';\n\nimport { useIsomorphicClerkContext } from '../contexts/IsomorphicClerkContext';\nimport { useAssertWrappedByClerkProvider } from '../hooks/useAssertWrappedByClerkProvider';\n\nexport const withClerk = <P extends { clerk: LoadedClerk; component?: string }>(\n  Component: React.ComponentType<P>,\n  displayNameOrOptions?: string | { component: string; renderWhileLoading?: boolean },\n) => {\n  const passedDisplayedName =\n    typeof displayNameOrOptions === 'string' ? displayNameOrOptions : displayNameOrOptions?.component;\n  const displayName = passedDisplayedName || Component.displayName || Component.name || 'Component';\n  Component.displayName = displayName;\n\n  const options = typeof displayNameOrOptions === 'string' ? undefined : displayNameOrOptions;\n\n  const HOC = (props: Without<P, 'clerk'>) => {\n    useAssertWrappedByClerkProvider(displayName || 'withClerk');\n\n    const clerk = useIsomorphicClerkContext();\n    const getContainer = usePortalRoot();\n\n    if (!clerk.loaded && !options?.renderWhileLoading) {\n      return null;\n    }\n\n    return (\n      <Component\n        getContainer={getContainer}\n        {...(props as P)}\n        component={displayName}\n        clerk={clerk}\n      />\n    );\n  };\n  HOC.displayName = `withClerk(${displayName})`;\n  return HOC;\n};\n"],"mappings":"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","names":["eventMethodCalled","useCallback","eventMethodCalled","useCallback","React","React"]}

package/dist/{chunk-YKGYOPLG.mjs → chunk-JPHCBAWH.mjs}

@@ -15,7 +15,7 @@ import {
   userProfileLinkRenderedError,
   userProfilePageRenderedError,
   withClerk
-} from "./chunk-J32KHXBI.mjs";
+} from "./chunk-FDDR7URL.mjs";
 import {
   errorThrower
 } from "./chunk-MB46WFKC.mjs";
@@ -1030,4 +1030,4 @@ export {
   TaskChooseOrganization,
   TaskResetPassword
 };
-//# sourceMappingURL=chunk-YKGYOPLG.mjs.map
+//# sourceMappingURL=chunk-JPHCBAWH.mjs.map

package/dist/experimental.js

@@ -31,24 +31,24 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 var experimental_exports = {};
 __export(experimental_exports, {
   CheckoutButton: () => CheckoutButton,
-  CheckoutProvider: () => import_react22.__experimental_CheckoutProvider,
-  PaymentElement: () => import_react22.__experimental_PaymentElement,
-  PaymentElementProvider: () => import_react22.__experimental_PaymentElementProvider,
+  CheckoutProvider: () => import_react23.__experimental_CheckoutProvider,
+  PaymentElement: () => import_react23.__experimental_PaymentElement,
+  PaymentElementProvider: () => import_react23.__experimental_PaymentElementProvider,
   PlanDetailsButton: () => PlanDetailsButton,
   SubscriptionDetailsButton: () => SubscriptionDetailsButton,
-  useAPIKeys: () => import_react22.__experimental_useAPIKeys,
-  useCheckout: () => import_react22.__experimental_useCheckout,
-  usePaymentAttempts: () => import_react22.__experimental_usePaymentAttempts,
-  usePaymentElement: () => import_react22.__experimental_usePaymentElement,
-  usePaymentMethods: () => import_react22.__experimental_usePaymentMethods,
-  usePlans: () => import_react22.__experimental_usePlans,
-  useStatements: () => import_react22.__experimental_useStatements,
-  useSubscription: () => import_react22.__experimental_useSubscription
+  useAPIKeys: () => import_react23.__experimental_useAPIKeys,
+  useCheckout: () => import_react23.__experimental_useCheckout,
+  usePaymentAttempts: () => import_react23.__experimental_usePaymentAttempts,
+  usePaymentElement: () => import_react23.__experimental_usePaymentElement,
+  usePaymentMethods: () => import_react23.__experimental_usePaymentMethods,
+  usePlans: () => import_react23.__experimental_usePlans,
+  useStatements: () => import_react23.__experimental_useStatements,
+  useSubscription: () => import_react23.__experimental_useSubscription
 });
 module.exports = __toCommonJS(experimental_exports);
 
 // src/components/CheckoutButton.tsx
-var import_react19 = __toESM(require("react"));
+var import_react20 = __toESM(require("react"));
 
 // src/hooks/useAuth.ts
 var import_authorization = require("@clerk/shared/authorization");
@@ -242,11 +242,11 @@ var useCustomElementPortal = (elements) => {
 
 // src/utils/useCustomPages.tsx
 var import_utils4 = require("@clerk/shared/utils");
-var import_react17 = __toESM(require("react"));
+var import_react18 = __toESM(require("react"));
 
 // src/components/uiComponents.tsx
 var import_utils2 = require("@clerk/shared/utils");
-var import_react15 = __toESM(require("react"));
+var import_react16 = __toESM(require("react"));
 
 // src/utils/useWaitForComponentMount.ts
 var import_react11 = require("react");
@@ -389,7 +389,8 @@ var ClerkHostRenderer = class extends import_react13.default.PureComponent {
 };
 
 // src/components/withClerk.tsx
-var import_react14 = __toESM(require("react"));
+var import_react14 = require("@clerk/shared/react");
+var import_react15 = __toESM(require("react"));
 var withClerk = (Component, displayNameOrOptions) => {
   const passedDisplayedName = typeof displayNameOrOptions === "string" ? displayNameOrOptions : displayNameOrOptions == null ? void 0 : displayNameOrOptions.component;
   const displayName = passedDisplayedName || Component.displayName || Component.name || "Component";
@@ -398,12 +399,14 @@ var withClerk = (Component, displayNameOrOptions) => {
   const HOC = (props) => {
     useAssertWrappedByClerkProvider(displayName || "withClerk");
     const clerk = useIsomorphicClerkContext();
+    const getContainer = (0, import_react14.usePortalRoot)();
     if (!clerk.loaded && !(options == null ? void 0 : options.renderWhileLoading)) {
       return null;
     }
-    return /* @__PURE__ */ import_react14.default.createElement(
+    return /* @__PURE__ */ import_react15.default.createElement(
       Component,
       {
+        getContainer,
         ...props,
         component: displayName,
         clerk
@@ -417,7 +420,7 @@ var withClerk = (Component, displayNameOrOptions) => {
 // src/components/uiComponents.tsx
 var CustomPortalsRenderer = (props) => {
   var _a, _b;
-  return /* @__PURE__ */ import_react15.default.createElement(import_react15.default.Fragment, null, (_a = props == null ? void 0 : props.customPagesPortals) == null ? void 0 : _a.map((portal, index) => (0, import_react15.createElement)(portal, { key: index })), (_b = props == null ? void 0 : props.customMenuItemsPortals) == null ? void 0 : _b.map((portal, index) => (0, import_react15.createElement)(portal, { key: index })));
+  return /* @__PURE__ */ import_react16.default.createElement(import_react16.default.Fragment, null, (_a = props == null ? void 0 : props.customPagesPortals) == null ? void 0 : _a.map((portal, index) => (0, import_react16.createElement)(portal, { key: index })), (_b = props == null ? void 0 : props.customMenuItemsPortals) == null ? void 0 : _b.map((portal, index) => (0, import_react16.createElement)(portal, { key: index })));
 };
 var SignIn = withClerk(
   ({ clerk, component, fallback, ...props }) => {
@@ -426,7 +429,7 @@ var SignIn = withClerk(
     const rendererRootProps = {
       ...shouldShowFallback && fallback && { style: { display: "none" } }
     };
-    return /* @__PURE__ */ import_react15.default.createElement(import_react15.default.Fragment, null, shouldShowFallback && fallback, clerk.loaded && /* @__PURE__ */ import_react15.default.createElement(
+    return /* @__PURE__ */ import_react16.default.createElement(import_react16.default.Fragment, null, shouldShowFallback && fallback, clerk.loaded && /* @__PURE__ */ import_react16.default.createElement(
       ClerkHostRenderer,
       {
         component,
@@ -447,7 +450,7 @@ var SignUp = withClerk(
     const rendererRootProps = {
       ...shouldShowFallback && fallback && { style: { display: "none" } }
     };
-    return /* @__PURE__ */ import_react15.default.createElement(import_react15.default.Fragment, null, shouldShowFallback && fallback, clerk.loaded && /* @__PURE__ */ import_react15.default.createElement(
+    return /* @__PURE__ */ import_react16.default.createElement(import_react16.default.Fragment, null, shouldShowFallback && fallback, clerk.loaded && /* @__PURE__ */ import_react16.default.createElement(
       ClerkHostRenderer,
       {
         component,
@@ -463,11 +466,11 @@ var SignUp = withClerk(
 );
 function UserProfilePage({ children }) {
   (0, import_utils2.logErrorInDevMode)(userProfilePageRenderedError);
-  return /* @__PURE__ */ import_react15.default.createElement(import_react15.default.Fragment, null, children);
+  return /* @__PURE__ */ import_react16.default.createElement(import_react16.default.Fragment, null, children);
 }
 function UserProfileLink({ children }) {
   (0, import_utils2.logErrorInDevMode)(userProfileLinkRenderedError);
-  return /* @__PURE__ */ import_react15.default.createElement(import_react15.default.Fragment, null, children);
+  return /* @__PURE__ */ import_react16.default.createElement(import_react16.default.Fragment, null, children);
 }
 var _UserProfile = withClerk(
   ({
@@ -482,7 +485,7 @@ var _UserProfile = withClerk(
       ...shouldShowFallback && fallback && { style: { display: "none" } }
     };
     const { customPages, customPagesPortals } = useUserProfileCustomPages(props.children);
-    return /* @__PURE__ */ import_react15.default.createElement(import_react15.default.Fragment, null, shouldShowFallback && fallback, /* @__PURE__ */ import_react15.default.createElement(
+    return /* @__PURE__ */ import_react16.default.createElement(import_react16.default.Fragment, null, shouldShowFallback && fallback, /* @__PURE__ */ import_react16.default.createElement(
       ClerkHostRenderer,
       {
         component,
@@ -492,7 +495,7 @@ var _UserProfile = withClerk(
         props: { ...props, customPages },
         rootProps: rendererRootProps
       },
-      /* @__PURE__ */ import_react15.default.createElement(CustomPortalsRenderer, { customPagesPortals })
+      /* @__PURE__ */ import_react16.default.createElement(CustomPortalsRenderer, { customPagesPortals })
     ));
   },
   { component: "UserProfile", renderWhileLoading: true }
@@ -501,7 +504,7 @@ var UserProfile = Object.assign(_UserProfile, {
   Page: UserProfilePage,
   Link: UserProfileLink
 });
-var UserButtonContext = (0, import_react15.createContext)({
+var UserButtonContext = (0, import_react16.createContext)({
   mount: () => {
   },
   unmount: () => {
@@ -539,7 +542,7 @@ var _UserButton = withClerk(
       customPagesPortals,
       customMenuItemsPortals
     };
-    return /* @__PURE__ */ import_react15.default.createElement(UserButtonContext.Provider, { value: passableProps }, shouldShowFallback && fallback, clerk.loaded && /* @__PURE__ */ import_react15.default.createElement(
+    return /* @__PURE__ */ import_react16.default.createElement(UserButtonContext.Provider, { value: passableProps }, shouldShowFallback && fallback, clerk.loaded && /* @__PURE__ */ import_react16.default.createElement(
       ClerkHostRenderer,
       {
         component,
@@ -548,25 +551,25 @@ var _UserButton = withClerk(
         rootProps: rendererRootProps
       },
       props.__experimental_asProvider ? sanitizedChildren : null,
-      /* @__PURE__ */ import_react15.default.createElement(CustomPortalsRenderer, { ...portalProps })
+      /* @__PURE__ */ import_react16.default.createElement(CustomPortalsRenderer, { ...portalProps })
     ));
   },
   { component: "UserButton", renderWhileLoading: true }
 );
 function MenuItems({ children }) {
   (0, import_utils2.logErrorInDevMode)(userButtonMenuItemsRenderedError);
-  return /* @__PURE__ */ import_react15.default.createElement(import_react15.default.Fragment, null, children);
+  return /* @__PURE__ */ import_react16.default.createElement(import_react16.default.Fragment, null, children);
 }
 function MenuAction({ children }) {
   (0, import_utils2.logErrorInDevMode)(userButtonMenuActionRenderedError);
-  return /* @__PURE__ */ import_react15.default.createElement(import_react15.default.Fragment, null, children);
+  return /* @__PURE__ */ import_react16.default.createElement(import_react16.default.Fragment, null, children);
 }
 function MenuLink({ children }) {
   (0, import_utils2.logErrorInDevMode)(userButtonMenuLinkRenderedError);
-  return /* @__PURE__ */ import_react15.default.createElement(import_react15.default.Fragment, null, children);
+  return /* @__PURE__ */ import_react16.default.createElement(import_react16.default.Fragment, null, children);
 }
 function UserButtonOutlet(outletProps) {
-  const providerProps = (0, import_react15.useContext)(UserButtonContext);
+  const providerProps = (0, import_react16.useContext)(UserButtonContext);
   const portalProps = {
     ...providerProps,
     props: {
@@ -574,7 +577,7 @@ function UserButtonOutlet(outletProps) {
       ...outletProps
     }
   };
-  return /* @__PURE__ */ import_react15.default.createElement(ClerkHostRenderer, { ...portalProps });
+  return /* @__PURE__ */ import_react16.default.createElement(ClerkHostRenderer, { ...portalProps });
 }
 var UserButton = Object.assign(_UserButton, {
   UserProfilePage,
@@ -586,11 +589,11 @@ var UserButton = Object.assign(_UserButton, {
 });
 function OrganizationProfilePage({ children }) {
   (0, import_utils2.logErrorInDevMode)(organizationProfilePageRenderedError);
-  return /* @__PURE__ */ import_react15.default.createElement(import_react15.default.Fragment, null, children);
+  return /* @__PURE__ */ import_react16.default.createElement(import_react16.default.Fragment, null, children);
 }
 function OrganizationProfileLink({ children }) {
   (0, import_utils2.logErrorInDevMode)(organizationProfileLinkRenderedError);
-  return /* @__PURE__ */ import_react15.default.createElement(import_react15.default.Fragment, null, children);
+  return /* @__PURE__ */ import_react16.default.createElement(import_react16.default.Fragment, null, children);
 }
 var _OrganizationProfile = withClerk(
   ({
@@ -605,7 +608,7 @@ var _OrganizationProfile = withClerk(
       ...shouldShowFallback && fallback && { style: { display: "none" } }
     };
     const { customPages, customPagesPortals } = useOrganizationProfileCustomPages(props.children);
-    return /* @__PURE__ */ import_react15.default.createElement(import_react15.default.Fragment, null, shouldShowFallback && fallback, clerk.loaded && /* @__PURE__ */ import_react15.default.createElement(
+    return /* @__PURE__ */ import_react16.default.createElement(import_react16.default.Fragment, null, shouldShowFallback && fallback, clerk.loaded && /* @__PURE__ */ import_react16.default.createElement(
       ClerkHostRenderer,
       {
         component,
@@ -615,7 +618,7 @@ var _OrganizationProfile = withClerk(
         props: { ...props, customPages },
         rootProps: rendererRootProps
       },
-      /* @__PURE__ */ import_react15.default.createElement(CustomPortalsRenderer, { customPagesPortals })
+      /* @__PURE__ */ import_react16.default.createElement(CustomPortalsRenderer, { customPagesPortals })
     ));
   },
   { component: "OrganizationProfile", renderWhileLoading: true }
@@ -631,7 +634,7 @@ var CreateOrganization = withClerk(
     const rendererRootProps = {
       ...shouldShowFallback && fallback && { style: { display: "none" } }
     };
-    return /* @__PURE__ */ import_react15.default.createElement(import_react15.default.Fragment, null, shouldShowFallback && fallback, clerk.loaded && /* @__PURE__ */ import_react15.default.createElement(
+    return /* @__PURE__ */ import_react16.default.createElement(import_react16.default.Fragment, null, shouldShowFallback && fallback, clerk.loaded && /* @__PURE__ */ import_react16.default.createElement(
       ClerkHostRenderer,
       {
         component,
@@ -645,7 +648,7 @@ var CreateOrganization = withClerk(
   },
   { component: "CreateOrganization", renderWhileLoading: true }
 );
-var OrganizationSwitcherContext = (0, import_react15.createContext)({
+var OrganizationSwitcherContext = (0, import_react16.createContext)({
   mount: () => {
   },
   unmount: () => {
@@ -679,20 +682,20 @@ var _OrganizationSwitcher = withClerk(
       component
     };
     clerk.__experimental_prefetchOrganizationSwitcher();
-    return /* @__PURE__ */ import_react15.default.createElement(OrganizationSwitcherContext.Provider, { value: passableProps }, /* @__PURE__ */ import_react15.default.createElement(import_react15.default.Fragment, null, shouldShowFallback && fallback, clerk.loaded && /* @__PURE__ */ import_react15.default.createElement(
+    return /* @__PURE__ */ import_react16.default.createElement(OrganizationSwitcherContext.Provider, { value: passableProps }, /* @__PURE__ */ import_react16.default.createElement(import_react16.default.Fragment, null, shouldShowFallback && fallback, clerk.loaded && /* @__PURE__ */ import_react16.default.createElement(
       ClerkHostRenderer,
       {
         ...passableProps,
         hideRootHtmlElement: !!props.__experimental_asProvider
       },
       props.__experimental_asProvider ? sanitizedChildren : null,
-      /* @__PURE__ */ import_react15.default.createElement(CustomPortalsRenderer, { customPagesPortals })
+      /* @__PURE__ */ import_react16.default.createElement(CustomPortalsRenderer, { customPagesPortals })
     )));
   },
   { component: "OrganizationSwitcher", renderWhileLoading: true }
 );
 function OrganizationSwitcherOutlet(outletProps) {
-  const providerProps = (0, import_react15.useContext)(OrganizationSwitcherContext);
+  const providerProps = (0, import_react16.useContext)(OrganizationSwitcherContext);
   const portalProps = {
     ...providerProps,
     props: {
@@ -700,7 +703,7 @@ function OrganizationSwitcherOutlet(outletProps) {
       ...outletProps
     }
   };
-  return /* @__PURE__ */ import_react15.default.createElement(ClerkHostRenderer, { ...portalProps });
+  return /* @__PURE__ */ import_react16.default.createElement(ClerkHostRenderer, { ...portalProps });
 }
 var OrganizationSwitcher = Object.assign(_OrganizationSwitcher, {
   OrganizationProfilePage,
@@ -714,7 +717,7 @@ var OrganizationList = withClerk(
     const rendererRootProps = {
       ...shouldShowFallback && fallback && { style: { display: "none" } }
     };
-    return /* @__PURE__ */ import_react15.default.createElement(import_react15.default.Fragment, null, shouldShowFallback && fallback, clerk.loaded && /* @__PURE__ */ import_react15.default.createElement(
+    return /* @__PURE__ */ import_react16.default.createElement(import_react16.default.Fragment, null, shouldShowFallback && fallback, clerk.loaded && /* @__PURE__ */ import_react16.default.createElement(
       ClerkHostRenderer,
       {
         component,
@@ -735,7 +738,7 @@ var GoogleOneTap = withClerk(
     const rendererRootProps = {
       ...shouldShowFallback && fallback && { style: { display: "none" } }
     };
-    return /* @__PURE__ */ import_react15.default.createElement(import_react15.default.Fragment, null, shouldShowFallback && fallback, clerk.loaded && /* @__PURE__ */ import_react15.default.createElement(
+    return /* @__PURE__ */ import_react16.default.createElement(import_react16.default.Fragment, null, shouldShowFallback && fallback, clerk.loaded && /* @__PURE__ */ import_react16.default.createElement(
       ClerkHostRenderer,
       {
         component,
@@ -756,7 +759,7 @@ var Waitlist = withClerk(
     const rendererRootProps = {
       ...shouldShowFallback && fallback && { style: { display: "none" } }
     };
-    return /* @__PURE__ */ import_react15.default.createElement(import_react15.default.Fragment, null, shouldShowFallback && fallback, clerk.loaded && /* @__PURE__ */ import_react15.default.createElement(
+    return /* @__PURE__ */ import_react16.default.createElement(import_react16.default.Fragment, null, shouldShowFallback && fallback, clerk.loaded && /* @__PURE__ */ import_react16.default.createElement(
       ClerkHostRenderer,
       {
         component,
@@ -780,7 +783,7 @@ var PricingTable = withClerk(
     const rendererRootProps = {
       ...shouldShowFallback && fallback && { style: { display: "none" } }
     };
-    return /* @__PURE__ */ import_react15.default.createElement(import_react15.default.Fragment, null, shouldShowFallback && fallback, clerk.loaded && /* @__PURE__ */ import_react15.default.createElement(
+    return /* @__PURE__ */ import_react16.default.createElement(import_react16.default.Fragment, null, shouldShowFallback && fallback, clerk.loaded && /* @__PURE__ */ import_react16.default.createElement(
       ClerkHostRenderer,
       {
         component,
@@ -801,7 +804,7 @@ var APIKeys = withClerk(
     const rendererRootProps = {
       ...shouldShowFallback && fallback && { style: { display: "none" } }
     };
-    return /* @__PURE__ */ import_react15.default.createElement(import_react15.default.Fragment, null, shouldShowFallback && fallback, clerk.loaded && /* @__PURE__ */ import_react15.default.createElement(
+    return /* @__PURE__ */ import_react16.default.createElement(import_react16.default.Fragment, null, shouldShowFallback && fallback, clerk.loaded && /* @__PURE__ */ import_react16.default.createElement(
       ClerkHostRenderer,
       {
         component,
@@ -822,7 +825,7 @@ var UserAvatar = withClerk(
     const rendererRootProps = {
       ...shouldShowFallback && fallback && { style: { display: "none" } }
     };
-    return /* @__PURE__ */ import_react15.default.createElement(import_react15.default.Fragment, null, shouldShowFallback && fallback, clerk.loaded && /* @__PURE__ */ import_react15.default.createElement(
+    return /* @__PURE__ */ import_react16.default.createElement(import_react16.default.Fragment, null, shouldShowFallback && fallback, clerk.loaded && /* @__PURE__ */ import_react16.default.createElement(
       ClerkHostRenderer,
       {
         component,
@@ -843,7 +846,7 @@ var TaskChooseOrganization = withClerk(
     const rendererRootProps = {
       ...shouldShowFallback && fallback && { style: { display: "none" } }
     };
-    return /* @__PURE__ */ import_react15.default.createElement(import_react15.default.Fragment, null, shouldShowFallback && fallback, clerk.loaded && /* @__PURE__ */ import_react15.default.createElement(
+    return /* @__PURE__ */ import_react16.default.createElement(import_react16.default.Fragment, null, shouldShowFallback && fallback, clerk.loaded && /* @__PURE__ */ import_react16.default.createElement(
       ClerkHostRenderer,
       {
         component,
@@ -864,7 +867,7 @@ var TaskResetPassword = withClerk(
     const rendererRootProps = {
       ...shouldShowFallback && fallback && { style: { display: "none" } }
     };
-    return /* @__PURE__ */ import_react15.default.createElement(import_react15.default.Fragment, null, shouldShowFallback && fallback, clerk.loaded && /* @__PURE__ */ import_react15.default.createElement(
+    return /* @__PURE__ */ import_react16.default.createElement(import_react16.default.Fragment, null, shouldShowFallback && fallback, clerk.loaded && /* @__PURE__ */ import_react16.default.createElement(
       ClerkHostRenderer,
       {
         component,
@@ -880,9 +883,9 @@ var TaskResetPassword = withClerk(
 );
 
 // src/utils/componentValidation.ts
-var import_react16 = __toESM(require("react"));
+var import_react17 = __toESM(require("react"));
 var isThatComponent = (v, component) => {
-  return !!v && import_react16.default.isValidElement(v) && (v == null ? void 0 : v.type) === component;
+  return !!v && import_react17.default.isValidElement(v) && (v == null ? void 0 : v.type) === component;
 };
 
 // src/utils/useCustomPages.tsx
@@ -922,7 +925,7 @@ var useSanitizedChildren = (children) => {
     UserProfilePage,
     UserProfileLink
   ];
-  import_react17.default.Children.forEach(children, (child) => {
+  import_react18.default.Children.forEach(children, (child) => {
     if (!excludedComponents.some((component) => isThatComponent(child, component))) {
       sanitizedChildren.push(child);
     }
@@ -933,7 +936,7 @@ var useCustomPages = (params, options) => {
   const { children, LinkComponent, PageComponent, MenuItemsComponent, reorderItemsLabels, componentName } = params;
   const { allowForAnyChildren = false } = options || {};
   const validChildren = [];
-  import_react17.default.Children.forEach(children, (child) => {
+  import_react18.default.Children.forEach(children, (child) => {
     if (!isThatComponent(child, PageComponent) && !isThatComponent(child, LinkComponent) && !isThatComponent(child, MenuItemsComponent)) {
       if (child && !allowForAnyChildren) {
         (0, import_utils4.logErrorInDevMode)(customPagesIgnoredComponent(componentName));
@@ -1028,7 +1031,7 @@ var isExternalLink = (childProps) => {
 
 // src/utils/useCustomMenuItems.tsx
 var import_utils5 = require("@clerk/shared/utils");
-var import_react18 = __toESM(require("react"));
+var import_react19 = __toESM(require("react"));
 var useUserButtonCustomMenuItems = (children, options) => {
   var _a;
   const reorderItemsLabels = ["manageAccount", "signOut"];
@@ -1056,7 +1059,7 @@ var useCustomMenuItems = ({
   const validChildren = [];
   const customMenuItems = [];
   const customMenuItemsPortals = [];
-  import_react18.default.Children.forEach(children, (child) => {
+  import_react19.default.Children.forEach(children, (child) => {
     if (!isThatComponent(child, MenuItemsComponent) && !isThatComponent(child, UserProfileLinkComponent) && !isThatComponent(child, UserProfilePageComponent)) {
       if (child && !allowForAnyChildren) {
         (0, import_utils5.logErrorInDevMode)(userButtonIgnoredComponent);
@@ -1067,7 +1070,7 @@ var useCustomMenuItems = ({
       return;
     }
     const { props } = child;
-    import_react18.default.Children.forEach(props.children, (child2) => {
+    import_react19.default.Children.forEach(props.children, (child2) => {
       if (!isThatComponent(child2, MenuActionComponent) && !isThatComponent(child2, MenuLinkComponent)) {
         if (child2) {
           (0, import_utils5.logErrorInDevMode)(customMenuItemsIgnoredComponent);
@@ -1223,13 +1226,13 @@ var CheckoutButton = withClerk(
       return clickHandler();
     };
     const childProps = { ...rest, onClick: wrappedChildClickHandler };
-    return import_react19.default.cloneElement(child, childProps);
+    return import_react20.default.cloneElement(child, childProps);
   },
   { component: "CheckoutButton", renderWhileLoading: true }
 );
 
 // src/components/PlanDetailsButton.tsx
-var import_react20 = __toESM(require("react"));
+var import_react21 = __toESM(require("react"));
 var PlanDetailsButton = withClerk(
   ({ clerk, children, ...props }) => {
     const { plan, planId, initialPlanPeriod, planDetailsProps, ...rest } = props;
@@ -1253,13 +1256,13 @@ var PlanDetailsButton = withClerk(
       return clickHandler();
     };
     const childProps = { ...rest, onClick: wrappedChildClickHandler };
-    return import_react20.default.cloneElement(child, childProps);
+    return import_react21.default.cloneElement(child, childProps);
   },
   { component: "PlanDetailsButton", renderWhileLoading: true }
 );
 
 // src/components/SubscriptionDetailsButton.tsx
-var import_react21 = __toESM(require("react"));
+var import_react22 = __toESM(require("react"));
 var SubscriptionDetailsButton = withClerk(
   ({
     clerk,
@@ -1297,13 +1300,13 @@ var SubscriptionDetailsButton = withClerk(
       return clickHandler();
     };
     const childProps = { ...rest, onClick: wrappedChildClickHandler };
-    return import_react21.default.cloneElement(child, childProps);
+    return import_react22.default.cloneElement(child, childProps);
   },
   { component: "SubscriptionDetailsButton", renderWhileLoading: true }
 );
 
 // src/experimental.ts
-var import_react22 = require("@clerk/shared/react");
+var import_react23 = require("@clerk/shared/react");
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   CheckoutButton,